@charset "utf-8";
/* board.css — line 사이트 게시판 공통 디자인
 * 모든 게시판이 공유하는 root·검색·표·카드·필드·버튼·상태·반응형을 소유한다.
 * board-{type}.css에는 .board.board--{type}으로 체이닝한 실제 차이만 둔다.
 */

.board {
  --board-accent: #124531;
  --board-border: #e0e0e0;
  --board-muted: #696969;
  width: 100%;
  max-width: 1440px;
  min-width: 0;
  margin: 0 auto;
  padding: 0;
  color: #222;
  font-family: "Noto Sans KR", sans-serif;
}

.board,
.board *,
.board *::before,
.board *::after {
  box-sizing: border-box;
}

.board [hidden] {
  display: none !important;
}
.board img {
  max-width: 100%;
}
.board a {
  /*color: inherit;*/
}
.board button,
.board input,
.board select,
.board textarea {
  font: inherit;
}

.board-list__wrap {
  overflow-x: auto;
}

.board-list__link {
  display: block;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── 카드 목록 공통 ── */
.board-gallery {
  display: grid;
  grid-template-columns: repeat(var(--board-card-columns, 3), minmax(0, 1fr));
  gap: 48px 60px;
  margin: 48px 0 0;
  padding: 0;
  list-style: none;
}

.board-gallery__thumb > img {
  display: block;
  width: 100%;
  height: 275px;
  object-fit: cover;
}

.board-gallery__thumb {
  position: relative;
  margin: 0;
}
.board-gallery__badge {
  position: absolute;
  top: 0;
  left: 0;
}

.board-control--text {
  display: flex;
  align-items: center;
  max-width: 640px;
  min-height: 44px;
  padding: 0 16px;
}

.board-control--wide {
  max-width: 880px;
}

.board-choice__input--check {
  border-radius: 4px;
}
.board-choice__input--check:checked {
  background: var(--board-accent) url("/_res/skku-alumni/line/img/board/event-application-survey-check.png") center /
    14px 14px no-repeat;
}

.board-view__heading {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 64px;
  font-size: 18px;
  line-height: 18px;
  letter-spacing: -0.27px;
}

.board-view__heading span:last-child {
  color: var(--board-muted);
}
.board-view__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
}
.board-view__meta dd {
  margin: 0;
}
.board-view__file {
  padding: 0;
  list-style: none;
}

.board-view__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 48px;
}

.board-write__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 160px;
  height: 56px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
}

.board :is(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--board-accent);
  outline-offset: 2px;
}

@media (max-width: 1024px) {
  .board-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 24px;
  }
}

@media (max-width: 768px) {
  .board-gallery {
    grid-template-columns: 1fr;
    margin-top: 32px;
  }

  .board-gallery__thumb > img {
    height: auto;
    aspect-ratio: 440 / 275;
  }

  .board-view__heading {
    height: 52px;
    font-size: 16px;
    line-height: 16px;
  }
  .board-view__actions {
    gap: 8px;
    margin-top: 32px;
  }
  .board-view__actions > * {
    flex: 1 1 0;
    width: auto;
    max-width: 160px;
    height: 50px;
    font-size: 16px;
  }
}

/* @board-extracted start */

/* @board-extracted end */

/* @comp board-paging */
.board-paging {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
  min-height: 120px;
}

.board-paging a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  color: #222;
  font-family: var(--cms-font-pretendard-gov, "Pretendard GOV"), sans-serif;
  font-size: 16px;
  line-height: 26px;
  text-decoration: none;
}

.board-paging [aria-current="page"],
.board-paging .is-active {
  background: var(--board-accent);
  color: #fff;
}

.board-paging img {
  width: 36px;
  height: 36px;
  object-fit: contain;
}

@media (max-width: 768px) {
  .board-paging {
    gap: 4px;
    min-height: 96px;
  }

  .board-paging a,
  .board-paging img {
    width: 32px;
    height: 32px;
  }
}
/* @comp-end board-paging */

/* @comp board-write */
.board-form .board-control::placeholder {
  color: #c0c0c0;
  opacity: 1;
}

/* ── 필드·보기·쓰기 공통 ── */
.board-form,
.board-form .board-field-list {
  margin: 0;
}

.board-form .board-field-list {
  border-top: 2px solid var(--board-accent);
}

.board-form .board-field-list__row {
  display: grid;
  grid-template-columns: 192px minmax(0, 1fr);
  min-width: 0;
  min-height: 72px;
}

.board-form .board-field-list__label,
.board-form .board-field-list__field {
  display: flex;
  align-items: center;
  min-width: 0;
  padding: 13px 32px;
  border-right: 1px solid var(--board-border);
  border-bottom: 1px solid var(--board-border);
}

.board-form .board-field-list__label {
  justify-content: center;
  margin: 0;
  background: #f9fdfb;
  color: #404040;
  font-size: 18px;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: -0.27px;
}

.board-form .board-field-list__field {
  color: var(--board-muted);
  font-size: 18px;
  line-height: 18px;
  letter-spacing: -0.27px;
}

.board-form .board-control {
  width: 100%;
  min-width: 0;
  border: 1px solid #c0c0c0;
  border-radius: 4px;
  background: #fff;
  color: #404040;
}

.board-form .board-field-list__label,
.board-form .board-field-list__field {
  align-items: flex-start;
  padding-top: 23px;
  padding-bottom: 23px;
}

.board-form .board-field-list__label {
  padding-top: 31px;
}

.board-form .board-required {
  margin-left: 8px;
  color: #ef0000;
  font-weight: 700;
}

.board-form .board-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 48px;
}

.board-form .board-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 160px;
  height: 56px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
}

@media (max-width: 1024px) {
  .board-form .board-field-list__row {
    grid-template-columns: 160px minmax(0, 1fr);
  }

  .board-form .board-field-list__label,
  .board-form .board-field-list__field {
    padding-right: 24px;
    padding-left: 24px;
  }
}

@media (max-width: 768px) {
  .board-form .board-field-list__row {
    display: block;
    min-height: 0;
  }

  .board-form .board-field-list__label {
    justify-content: flex-start;
    min-height: 48px;
    padding: 14px 16px;
    border-left: 1px solid var(--board-border);
    font-size: 16px;
  }

  .board-form .board-field-list__field {
    min-height: 68px;
    padding: 12px 16px;
    border-left: 1px solid var(--board-border);
    font-size: 16px;
    line-height: 20px;
  }

  .board-form .board-field-list__label,
  .board-form .board-field-list__field {
    padding: 14px 16px;
  }

  .board-form .board-actions {
    gap: 8px;
    margin-top: 32px;
  }

  .board-form .board-actions > * {
    flex: 1 1 0;
    width: auto;
    max-width: 160px;
    height: 50px;
    font-size: 16px;
  }
}

/* ── 필드·보기·쓰기 공통 ── */
.board-write {
  margin: 0;
}

.board-write__row {
  display: grid;
  grid-template-columns: 192px minmax(0, 1fr);
  min-width: 0;
  min-height: 72px;
}

.board-write__label,
.board-write__field {
  display: flex;
  align-items: center;
  min-width: 0;
  padding: 13px 32px;
  border-right: 1px solid var(--board-border);
  border-bottom: 1px solid var(--board-border);
}

.board-write__label {
  justify-content: center;
  margin: 0;
  background: #f9fdfb;
  color: #404040;
  font-size: 18px;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: -0.27px;
}

.board-write__field {
  color: var(--board-muted);
  font-size: 18px;
  line-height: 18px;
  letter-spacing: -0.27px;
}

.board-write__input,
.board-write__textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #c0c0c0;
  border-radius: 4px;
  background: #fff;
  color: #404040;
}

.board-write__input {
  display: flex;
  align-items: center;
  max-width: 640px;
  min-height: 44px;
  padding: 0 16px;
}

.board-field-list__row--content,
.board-write__row--content {
  min-height: 400px;
}

.board-write__row--content .board-write__label,
.board-write__row--content .board-write__field {
  align-items: flex-start;
  padding-top: 23px;
  padding-bottom: 23px;
}

.board-write__row--content .board-write__label {
  padding-top: 31px;
}

.board-write__required {
  margin-left: 8px;
  color: #ef0000;
  font-weight: 700;
}

.board-write__textarea {
  min-height: 352px;
  padding: 20px 24px;
  resize: vertical;
  font-size: 16px;
  line-height: 1.4;
}

.board-write__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 48px;
}

@media (max-width: 1024px) {
  .board-write__row {
    grid-template-columns: 160px minmax(0, 1fr);
  }
  .board-write__label,
  .board-write__field {
    padding-right: 24px;
    padding-left: 24px;
  }
}

@media (max-width: 768px) {
  .board-write__row {
    display: block;
    min-height: 0;
  }
  .board-write__label {
    justify-content: flex-start;
    min-height: 48px;
    padding: 14px 16px;
    border-left: 1px solid var(--board-border);
    font-size: 16px;
  }
  .board-write__field {
    min-height: 68px;
    padding: 12px 16px;
    border-left: 1px solid var(--board-border);
    font-size: 16px;
    line-height: 20px;
  }
  .board-write__row--content .board-write__label,
  .board-write__row--content .board-write__field {
    padding: 14px 16px;
  }
  .board-write__textarea {
    min-height: 240px;
    padding: 16px;
  }
  .board-write__actions {
    gap: 8px;
    margin-top: 32px;
  }
  .board-write__actions > * {
    flex: 1 1 0;
    width: auto;
    max-width: 160px;
    height: 50px;
    font-size: 16px;
  }
}

/* 게시판 버튼 그룹 */
.board-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.board-actions.board-actions--left {
  justify-content: flex-start;
}

.board-actions.board-actions--center {
  justify-content: center;
}

.board-actions.board-actions--right {
  justify-content: flex-end;
}

/* ── write ── */
.board.board--create-event .board-write__table {
  width: 100%;
  border-spacing: 0;
}

.board.board--create-event .board-write__field--upload {
  gap: 16px;
}

.board.board--create-event .board-write__upload {
  display: inline-flex;
  flex: 0 0 144px;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 144px;
  height: 44px;
  border: 1px solid #e4e7ec;
  border-radius: 6px;
  background: #ebebeb;
  color: #222;
  font-size: 16px;
  font-weight: 500;
  line-height: 23px;
  cursor: pointer;
}

.board.board--create-event .board-write__upload img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}

.board.board--create-event .board-write__input--alt {
  flex: 0 1 480px;
  width: 480px;
}

@media (max-width: 768px) {
  .board.board--create-event .board-write__field--upload {
    flex-wrap: wrap;
    gap: 8px;
  }
  .board.board--create-event .board-write__upload {
    flex-basis: 132px;
    width: 132px;
  }
  .board.board--create-event .board-write__input--alt {
    flex: 1 1 180px;
    width: auto;
  }
}
/* @comp-end board-write */

/* @comp-end board-btn */

/* @comp board-btn */
/* @tag-interop board-btn — <a>·<button> 어느 태그로도 동일하게 렌더 */
.board-btn {
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  text-align: inherit;
  text-decoration: none;
  cursor: pointer;
}

.board-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 160px;
  height: 56px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
}

.board-btn.board-btn--primary,
.board-btn.board-btn--submit {
  border-color: var(--board-accent);
  background: var(--board-accent);
  color: #fff;
}

.board-btn.board-btn--secondary,
.board-btn.board-btn--cancel {
  border-color: #e4e7ec;
  background: #f5f5f5;
  color: #222;
}
/* @comp-end board-btn */

/* @comp board-label */
.board-label {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  min-width: 68px;
  height: 28px;
  padding: 0 8px;
  border-radius: 4px;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 14px;
}

.board-label--success {
  background: #55ab00;
}

.board-label--warning {
  background: #ff6c0d;
}

.board-label--muted {
  background: #e5e5e5;
  color: #808080;
}

.board-card__label.board-label--muted {
  background: #696969;
}
/* @comp-end board-label */

/* @comp board-list */
.board-list {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  table-layout: fixed;
  border-top: 2px solid var(--board-accent);
}

.board-list th {
  height: 88px;
  padding: 0 24px;
  border-bottom: 1px solid var(--board-border);
  background: #eaedf2;
  color: #222;
  font-size: 18px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: -0.27px;
  text-align: center;
}

.board-list td {
  height: 72px;
  padding: 0 24px;
  border-bottom: 1px solid var(--board-border);
  background: #fff;
  font-size: 18px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.27px;
  text-align: center;
}

.board-list .board-list__subject {
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.board-list__subject a {
  display: block;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.board-list__detail {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--board-muted);
  font-size: 16px;
  font-weight: 600;
  line-height: 19px;
  text-decoration: none;
}

.board-list__detail img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

@media (max-width: 768px) {
  .board-list th,
  .board-list td {
    padding-right: 12px;
    padding-left: 12px;
    font-size: 16px;
  }
}

/* ── list ── */
.board.board--my-event-participation .board-list__col--no {
  width: 7.9%;
}

.board.board--my-event-participation .board-list__col--subject {
  width: 65.3%;
}

.board.board--my-event-participation .board-list__col--date,
.board.board--my-event-participation .board-list__col--status {
  width: 9.5%;
}

.board.board--my-event-participation .board-list__col--action {
  width: 7.8%;
}

/* ── list ── */
.board.board--notice .board-list__col--no {
  width: 10%;
}

.board.board--notice .board-list__col--subject {
  width: 75%;
}

.board.board--notice .board-list__col--date {
  width: 15%;
}
/* @comp-end board-list */

/* @comp board-list-toolbar */
/* ── 목록 공통 ── */
.board-list-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  min-height: 88px;
  padding: 0 0 20px;
}

.board-total {
  margin: 0;
  color: #222;
  font-family: var(--cms-font-pretendard-gov, "Pretendard GOV"), sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 22px;
}

.board-total strong {
  font: inherit;
}

.board-search {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
}

.board-search input,
.board-search select,
.board-search button {
  min-width: 0;
}

.board-search__category,
.board-search__field,
.board-search__input,
.board-search__submit {
  height: 48px;
  border-radius: 6px;
  font-family: var(--cms-font-pretendard-gov, "Pretendard GOV"), sans-serif;
  font-size: 16px;
  line-height: 26px;
}

.board-search__category,
.board-search__field {
  width: 160px;
  padding: 0 48px 0 16px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: #fff url("/_res/skku-alumni/line/img/board/event-application-survey-chevron.png") right 16px center /
    24px 24px no-repeat;
  color: var(--board-muted);
  font-weight: 600;
  appearance: none;
}

.board-search__input {
  width: 400px;
  padding: 0 16px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: #fff;
  color: #222;
  font-weight: 600;
}

.board-search__input::placeholder {
  color: #c0c0c0;
  opacity: 1;
}

.board-search__submit {
  min-width: 78px;
  padding: 0 24px;
  border: 0;
  background: var(--board-accent);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

@media (max-width: 1024px) {
  .board-list-toolbar {
    align-items: stretch;
    flex-direction: column;
    gap: 16px;
    padding: 24px 0;
  }
  .board-search {
    width: 100%;
  }
  .board-search__input {
    flex: 1;
    width: auto;
    min-width: 160px;
  }
}

@media (max-width: 768px) {
  .board-search {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .board-search__category,
  .board-search__field,
  .board-search__input {
    width: 100%;
    min-width: 0;
  }
  .board-search__input,
  .board-search__submit {
    grid-column: 1 / -1;
  }
}
/* @comp-end board-list-toolbar */

/* @comp board-choice */
.board-choice {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #404040;
  font-size: 16px;
  line-height: 16px;
  cursor: pointer;
}

.board-choice__input {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--board-accent);
  background-color: #fff;
  appearance: none;
  cursor: pointer;
}

.board-choice__input--radio {
  border-radius: 50%;
}

.board-choice__input--radio:checked {
  background: var(--board-accent);
  box-shadow: inset 0 0 0 5px #fff;
}
/* @comp-end board-choice */

/* @comp board-card-list */
/* ── 카드 목록 공통 ── */
.board-card-list {
  display: grid;
  grid-template-columns: repeat(var(--board-card-columns, 3), minmax(0, 1fr));
  gap: 48px 60px;
  margin: 48px 0 0;
  padding: 0;
  list-style: none;
}

.board-card {
  display: flex;
  min-width: 0;
  min-height: 515px;
  flex-direction: column;
  overflow: hidden;
  border: 0;
  border-radius: 24px;
  background: #fff;
}

.board-card__image {
  display: block;
  width: 100%;
  height: 275px;
  object-fit: cover;
}

.board-card__body {
  display: flex;
  min-height: 240px;
  padding: 24px 32px 32px;
  flex-direction: column;
}

.board-card__label {
  align-self: flex-start;
  min-width: 76px;
  height: 26px;
  margin-bottom: 32px;
  padding: 0 12px;
  border: 1px solid rgba(249, 249, 249, 0.45);
  border-radius: 20px;
  color: #fff;
  font-size: 15px;
  line-height: 14px;
}

.board-card__title {
  margin: 0;
  color: #0d3123;
  font-family: var(--cms-font-pretendard, "Pretendard"), sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 24px;
}

.board-card__title a {
  text-decoration: none;
}

.board-card__meta {
  display: flex;
  align-items: center;
  margin: 14px 0 0;
  color: var(--board-muted);
  font-size: 16px;
  line-height: 16px;
}

.board-card__meta span + span {
  margin-left: 10px;
  padding-left: 10px;
  border-left: 1px solid rgba(0, 0, 0, 0.3);
}

.board-card__description {
  display: none;
  margin: 22px 0 0;
  color: var(--board-muted);
  font-size: 16px;
  line-height: 24px;
}

.board .board-card__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-end;
  width: 122px;
  height: 44px;
  margin-top: auto;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 22px;
  background: #0d3123;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  text-decoration: none;
}

.board-card__action span {
  margin-left: 10px;
  font-size: 18px;
}

@media (max-width: 1024px) {
  .board-card-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 24px;
  }
}

@media (max-width: 768px) {
  .board-card-list {
    grid-template-columns: 1fr;
    margin-top: 32px;
  }
  .board-card {
    min-height: 0;
  }
  .board-card__image {
    height: auto;
    aspect-ratio: 440 / 275;
  }
  .board-card__body {
    min-height: 220px;
    padding: 24px;
  }
  .board-card__label {
    margin-bottom: 24px;
  }
  .board-card__title {
    font-size: 21px;
    line-height: 26px;
  }
  .board-card__meta {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    line-height: 22px;
  }
  .board-card__meta span + span {
    margin-left: 0;
    padding-left: 0;
    border-left: 0;
  }
}
/* @comp-end board-card-list */