@charset "utf-8";

.ps-media-board {
    --ps-red: #d14f30;
    --ps-red-dark: #b94227;
    --ps-ink: #171717;
    --ps-copy: #68635f;
    --ps-line: #ded9d5;
    --ps-paper: #f7f5f2;
    width: min(1200px, calc(100% - 48px)) !important;
    margin: 0 auto;
    padding: 92px 0 120px;
    color: var(--ps-ink);
    font-family: "Noto Sans KR", "Pretendard", "Malgun Gothic", sans-serif;
}

.ps-media-board *, .ps-media-board *::before, .ps-media-board *::after { box-sizing: border-box; }
.ps-media-board h2, .ps-media-board h3, .ps-media-board p, .ps-media-board figure, .ps-media-board dl, .ps-media-board dd, .ps-media-board ul { margin: 0; padding: 0; }
.ps-media-board ul { list-style: none; }
.ps-media-board a { color: inherit; text-decoration: none; }
.ps-media-board button, .ps-media-board input, .ps-media-board select, .ps-media-board textarea { font: inherit; }

.ps-media-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 60px; margin-bottom: 54px; padding-bottom: 34px; border-bottom: 1px solid var(--ps-line); }
.ps-media-heading > div:first-child > p, .ps-media-view-header > p, .ps-media-write-heading > p { color: var(--ps-red); font-family: Inter, sans-serif; font-size: 14px; font-weight: 700; line-height: 22px; letter-spacing: .08em; }
.ps-media-heading h2 { margin-top: 10px; font-size: 42px; font-weight: 700; line-height: 1.35; letter-spacing: -.035em; }
.ps-media-heading > div:first-child > span { display: block; margin-top: 10px; color: var(--ps-copy); font-size: 17px; line-height: 1.7; }
.ps-media-heading-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 9px; }
.ps-media-heading-actions > span { margin-right: 12px; color: #77716d; font-size: 14px; }
.ps-media-heading-actions > span strong { color: var(--ps-red); }
.ps-media-icon-btn { display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid var(--ps-line); background: #fff; color: #605b57; transition: .25s ease; }
.ps-media-icon-btn:hover { border-color: var(--ps-red); color: var(--ps-red); transform: translateY(-2px); }
.ps-media-write-btn { display: inline-flex; height: 46px; align-items: center; justify-content: center; gap: 8px; padding: 0 20px; background: var(--ps-red); color: #fff !important; font-size: 14px; font-weight: 700; transition: .25s ease; }
.ps-media-write-btn:hover { background: var(--ps-red-dark); box-shadow: 0 10px 24px rgba(121, 43, 24, .18); transform: translateY(-2px); }

.ps-media-category { margin: -16px 0 42px; }
.ps-media-category ul { display: flex; flex-wrap: wrap; gap: 8px; }
.ps-media-category li { list-style: none; }
.ps-media-category a { display: inline-flex; min-width: 90px; height: 40px; align-items: center; justify-content: center; padding: 0 17px; border: 1px solid var(--ps-line); background: #fff; color: #69635f; font-size: 13px; }
.ps-media-category #bo_cate_on, .ps-media-category a:hover { border-color: var(--ps-red); background: var(--ps-red); color: #fff; }

.ps-media-admin-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; padding: 13px 16px; border: 1px solid #e4dfdb; background: var(--ps-paper); font-size: 13px; }
.ps-media-admin-bar label { display: flex; align-items: center; gap: 7px; }
.ps-media-admin-bar div { display: flex; gap: 6px; }
.ps-media-admin-bar button { height: 34px; padding: 0 11px; border: 1px solid #d7d1cd; background: #fff; color: #615b57; cursor: pointer; }

.ps-media-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 52px 28px; }
.ps-media-card { position: relative; min-width: 0; }
.ps-media-board.is-material .ps-media-card {
    overflow: hidden;
    border: 1px solid #e3ded9;
    background: #fff;
    transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
.ps-media-board.is-material .ps-media-card:hover {
    border-color: #d5cbc4;
    box-shadow: 0 14px 34px rgba(57, 42, 34, .09);
    transform: translateY(-4px);
}
.ps-media-card-check { position: absolute; top: 14px; left: 14px; z-index: 3; width: 18px; height: 18px; accent-color: var(--ps-red); }
.ps-media-card-link { display: block; height: 100%; }
.ps-media-thumb { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #1b1b1b; }
.ps-media-board.is-video .ps-media-thumb { aspect-ratio: 16 / 9; }
.ps-media-thumb > img { width: 100%; height: 100%; object-fit: cover; transition: transform .75s cubic-bezier(.22, .61, .36, 1), filter .45s ease; }
.ps-media-board.is-video .ps-media-thumb > img { object-position: center; }
.ps-media-card-link:hover .ps-media-thumb > img { filter: brightness(.88); transform: scale(1.055); }
.ps-media-thumb > em { position: absolute; top: 14px; right: 14px; padding: 6px 10px; background: var(--ps-red); color: #fff; font-family: Inter, sans-serif; font-size: 10px; font-style: normal; font-weight: 700; letter-spacing: .08em; }
.ps-media-play { position: absolute; top: 50%; left: 50%; display: grid; width: 66px; height: 66px; place-items: center; border: 1px solid rgba(255,255,255,.72); border-radius: 50%; background: rgba(0,0,0,.42); box-shadow: 0 8px 24px rgba(0,0,0,.18); transform: translate(-50%, -50%); transition: .35s ease; }
.ps-media-play i { width: 0; height: 0; margin-left: 5px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 13px solid #fff; }
.ps-media-card-link:hover .ps-media-play { border-color: var(--ps-red); background: var(--ps-red); transform: translate(-50%, -50%) scale(1.08); }
.ps-media-no-thumb { display: flex; position: absolute; inset: 0; align-items: center; justify-content: center; flex-direction: column; gap: 12px; background: linear-gradient(135deg, #25211f, #161616); color: rgba(255,255,255,.64); }
.ps-media-no-thumb i { font-size: 38px; }
.ps-media-no-thumb b { font-family: Inter, sans-serif; font-size: 12px; letter-spacing: .13em; }
.ps-media-card-copy { padding: 22px 2px 0; }
.ps-media-board.is-material .ps-media-card-copy { padding: 22px 22px 24px; }
.ps-media-card-date { color: var(--ps-red); font-family: Inter, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .05em; }
.ps-media-card-copy h3 { min-height: 60px; margin-top: 10px; overflow: hidden; font-size: 21px; font-weight: 650; line-height: 1.45; letter-spacing: -.025em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.ps-media-card-copy p { min-height: 48px; margin-top: 10px; overflow: hidden; color: #78716d; font-size: 14px; line-height: 1.7; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.ps-media-card-copy > b { display: inline-flex; align-items: center; gap: 12px; margin-top: 18px; color: #77706c; font-family: Inter, sans-serif; font-size: 11px; letter-spacing: .08em; }
.ps-media-card-copy > b i { color: var(--ps-red); font-size: 16px; font-style: normal; transition: transform .25s ease; }
.ps-media-card-link:hover .ps-media-card-copy h3 { color: var(--ps-red); }
.ps-media-card-link:hover .ps-media-card-copy > b i { transform: translateX(5px); }
.ps-media-empty { grid-column: 1 / -1; display: flex; min-height: 330px; align-items: center; justify-content: center; flex-direction: column; gap: 10px; border-top: 1px solid var(--ps-line); border-bottom: 1px solid var(--ps-line); color: #918a85; text-align: center; }
.ps-media-empty i { margin-bottom: 10px; color: #c7c0bb; font-size: 42px; }
.ps-media-empty strong { color: #5e5854; font-size: 17px; }
.ps-media-empty span { font-size: 13px; }

.ps-media-pagination { margin-top: 64px; text-align: center; }
.ps-media-pagination .pg_wrap { display: block; float: none; margin: 0; }
.ps-media-pagination .pg { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 5px; }
.ps-media-pagination .pg_page, .ps-media-pagination .pg_current { box-sizing: border-box; display: inline-flex; flex: 0 0 40px; align-items: center; justify-content: center; width: 40px; min-width: 40px; height: 40px; margin: 0; padding: 0; border: 1px solid var(--ps-line); background: #fff; color: #736d69; font-size: 13px; line-height: 1; }
.ps-media-pagination .pg_current { border-color: var(--ps-red); background: var(--ps-red); color: #fff; }
.ps-media-pagination .pg_page:hover, .ps-media-pagination .pg_page:focus-visible { border-color: var(--ps-red); color: var(--ps-red); background: #fff; }
.ps-media-pagination .pg_page:focus-visible { outline: 2px solid var(--ps-red); outline-offset: 2px; }
.ps-media-pagination .pg_start, .ps-media-pagination .pg_prev, .ps-media-pagination .pg_next, .ps-media-pagination .pg_end { position: relative; overflow: hidden; text-indent: -9999px; }
.ps-media-pagination .pg_start::before, .ps-media-pagination .pg_prev::before, .ps-media-pagination .pg_next::before, .ps-media-pagination .pg_end::before, .ps-media-pagination .pg_start::after, .ps-media-pagination .pg_end::after { content: ""; position: absolute; top: 50%; left: 50%; width: 7px; height: 7px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; }
.ps-media-pagination .pg_prev::before { transform: translate(-25%, -50%) rotate(-135deg); }
.ps-media-pagination .pg_next::before { transform: translate(-75%, -50%) rotate(45deg); }
.ps-media-pagination .pg_start::before { transform: translate(-65%, -50%) rotate(-135deg); }
.ps-media-pagination .pg_start::after { transform: translate(15%, -50%) rotate(-135deg); }
.ps-media-pagination .pg_end::before { transform: translate(-115%, -50%) rotate(45deg); }
.ps-media-pagination .pg_end::after { transform: translate(-35%, -50%) rotate(45deg); }
.ps-media-search { display: grid; width: min(520px, 100%); grid-template-columns: 130px 1fr 50px; margin: 40px auto 0; }
.ps-media-search select, .ps-media-search input { height: 50px; padding: 0 14px; border: 1px solid var(--ps-line); background: #fff; color: #514c49; outline: none; }
.ps-media-search input { border-right: 0; border-left: 0; }
.ps-media-search button { border: 0; background: #252321; color: #fff; cursor: pointer; transition: background .25s ease; }
.ps-media-search button:hover { background: var(--ps-red); }

/* view */
.ps-media-view { padding-top: 84px; }
.ps-media-view-header { padding: 0 0 36px; border-bottom: 1px solid var(--ps-line); text-align: center; }
.ps-media-view-header h2 { width: min(880px, 100%); margin: 13px auto 0; font-size: 38px; line-height: 1.4; letter-spacing: -.035em; word-break: keep-all; }
.ps-media-view-header dl { display: flex; justify-content: center; gap: 34px; margin-top: 24px; color: #817a75; font-family: Inter, sans-serif; font-size: 12px; }
.ps-media-view-header dl div { display: flex; gap: 9px; }
.ps-media-view-header dt { color: #4c4744; font-weight: 700; }
.ps-media-video-frame { position: relative; width: min(1040px, 100%); aspect-ratio: 16 / 9; margin: 54px auto 0; overflow: hidden; background: #111; box-shadow: 0 24px 60px rgba(40, 22, 16, .14); }
.ps-media-video-frame iframe { width: 100%; height: 100%; border: 0; }
.ps-media-invalid-video { display: flex; height: 100%; min-height: 320px; align-items: center; justify-content: center; flex-direction: column; gap: 10px; background: #24211f; color: #fff; }
.ps-media-invalid-video i { margin-bottom: 8px; color: var(--ps-red); font-size: 46px; }
.ps-media-invalid-video span { color: rgba(255,255,255,.55); font-size: 13px; }
.ps-media-view-gallery { display: grid; gap: 24px; width: min(1040px, 100%); margin: 54px auto 0; }
.ps-media-view-gallery figure { overflow: hidden; background: var(--ps-paper); text-align: center; }
.ps-media-view-gallery figure img { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.ps-media-view-content { width: min(1040px, 100%); min-height: 220px; margin: 0 auto; padding: 50px 24px 70px; border-bottom: 1px solid var(--ps-line); color: #5f5955; font-size: 16px; line-height: 1.9; }
.ps-media-view-content img { max-width: 100%; height: auto; }
.ps-media-downloads { width: min(1040px, 100%); margin: 32px auto 0; padding: 24px 26px; background: var(--ps-paper); }
.ps-media-downloads h3 { font-size: 15px; }
.ps-media-downloads h3 span { color: var(--ps-red); }
.ps-media-downloads li { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ps-line); color: #5f5955; font-size: 13px; }
.ps-media-downloads li i { color: var(--ps-red); }
.ps-media-downloads li a { min-width: 0; overflow: hidden; flex: 1; text-overflow: ellipsis; white-space: nowrap; }
.ps-media-downloads li span { color: #99918b; }
.ps-media-view-actions { display: flex; width: min(1040px, 100%); align-items: center; justify-content: space-between; gap: 16px; margin: 36px auto 0; }
.ps-media-view-actions a { display: inline-flex; min-width: 86px; height: 46px; align-items: center; justify-content: center; gap: 8px; padding: 0 18px; border: 1px solid var(--ps-line); background: #fff; color: #5f5955; font-size: 13px; }
.ps-media-view-actions a:hover { border-color: var(--ps-red); color: var(--ps-red); }
.ps-media-view-actions div { display: flex; gap: 7px; }
.ps-media-view-actions a.is-primary { border-color: var(--ps-red); background: var(--ps-red); color: #fff; }
.ps-media-siblings { width: min(1040px, 100%); margin: 54px auto 0; border-top: 1px solid #3a3633; border-bottom: 1px solid var(--ps-line); }
.ps-media-siblings a { display: grid; min-height: 68px; grid-template-columns: 72px 1fr 100px; align-items: center; gap: 18px; padding: 12px 16px; border-top: 1px solid var(--ps-line); }
.ps-media-siblings a:first-child { border-top: 0; }
.ps-media-siblings span { color: var(--ps-red); font-family: Inter, sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .08em; }
.ps-media-siblings strong { overflow: hidden; font-size: 14px; font-weight: 550; text-overflow: ellipsis; white-space: nowrap; }
.ps-media-siblings time { color: #928a84; font-size: 12px; text-align: right; }

/* write */
.ps-media-write { padding-top: 84px; }
.ps-media-write-heading { margin-bottom: 44px; padding-bottom: 30px; border-bottom: 1px solid var(--ps-line); }
.ps-media-write-heading h2 { margin-top: 10px; font-size: 38px; line-height: 1.4; letter-spacing: -.035em; }
.ps-media-write-heading > span { display: block; margin-top: 9px; color: var(--ps-copy); font-size: 15px; }
.ps-media-form { border-top: 2px solid #312e2c; }
.ps-media-form-row { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px; }
.ps-media-field { display: grid; grid-template-columns: 180px minmax(0, 1fr); align-items: start; padding: 22px 20px; border-bottom: 1px solid var(--ps-line); }
.ps-media-field > label { padding-top: 14px; color: #3d3936; font-size: 14px; font-weight: 650; }
.ps-media-field label em, .ps-media-file-field label em { color: var(--ps-red); font-style: normal; }
.ps-media-field input, .ps-media-field select { width: 100%; height: 50px; padding: 0 15px; border: 1px solid #d5cfcb; background: #fff; color: #3d3936; outline: none; }
.ps-media-field input:focus, .ps-media-field select:focus, .ps-media-field textarea:focus { border-color: var(--ps-red); box-shadow: 0 0 0 3px rgba(209,79,48,.08); }
.ps-media-field small { grid-column: 2; margin-top: 8px; color: #8b837e; font-size: 12px; }
.ps-media-form-row .ps-media-field { grid-template-columns: 100px minmax(0,1fr); }
.ps-media-form-row .ps-media-field + .ps-media-field { border-left: 1px solid var(--ps-line); }
.ps-media-options { display: flex; gap: 20px; padding: 15px 20px; border-bottom: 1px solid var(--ps-line); background: var(--ps-paper); font-size: 13px; }
.ps-media-options label { display: flex; align-items: center; gap: 6px; }
.ps-media-editor { min-width: 0; }
.ps-media-editor textarea { display: block; width: 100%; min-height: 320px; padding: 18px; border: 1px solid #d5cfcb; resize: vertical; outline: none; line-height: 1.8; }
.ps-media-editor .cke_chrome { border-color: #d5cfcb !important; }
.ps-media-upload-section { padding: 26px 20px 10px; border-bottom: 1px solid var(--ps-line); }
.ps-media-upload-heading { display: flex; align-items: baseline; gap: 14px; margin-bottom: 18px; }
.ps-media-upload-heading strong { font-size: 15px; }
.ps-media-upload-heading span { color: #8b837e; font-size: 12px; }
.ps-media-file-field { display: grid; grid-template-columns: 160px minmax(0,1fr); align-items: center; gap: 10px 20px; padding: 13px 0; border-top: 1px solid #ebe7e4; }
.ps-media-file-field > label:first-child { font-size: 13px; font-weight: 650; }
.ps-media-file-field input[type="file"] { width: 100%; padding: 11px; border: 1px dashed #cfc7c1; background: #fbfaf9; }
.ps-media-file-field > input[type="text"] { grid-column: 2; height: 44px; padding: 0 12px; border: 1px solid #d5cfcb; }
.ps-media-file-delete { grid-column: 2; color: #a8402d; font-size: 12px; }
.ps-media-captcha { padding: 22px 20px; border-bottom: 1px solid var(--ps-line); }
.ps-media-form-actions { display: flex; justify-content: center; gap: 8px; margin-top: 46px; }
.ps-media-form-actions a, .ps-media-form-actions button { display: inline-flex; min-width: 140px; height: 52px; align-items: center; justify-content: center; border: 1px solid #2f2c2a; background: #fff; color: #2f2c2a; font-size: 14px; font-weight: 700; cursor: pointer; }
.ps-media-form-actions button { border-color: var(--ps-red); background: var(--ps-red); color: #fff; }
.ps-media-form-actions button:hover { background: var(--ps-red-dark); }

@media (max-width: 900px) {
    .ps-media-board { width: calc(100% - 40px) !important; padding: 70px 0 90px; }
    .ps-media-heading { align-items: flex-start; flex-direction: column; gap: 24px; }
    .ps-media-heading-actions { width: 100%; }
    .ps-media-heading-actions > span { margin-right: auto; }
    .ps-media-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 42px 22px; }
    .ps-media-field { grid-template-columns: 140px minmax(0,1fr); }
    .ps-media-view-header h2 { font-size: 32px; }
}

@media (max-width: 640px) {
    .ps-media-board { width: calc(100% - 32px) !important; padding: 56px 0 76px; }
    .ps-media-heading { margin-bottom: 38px; padding-bottom: 26px; }
    .ps-media-heading h2 { font-size: 32px; }
    .ps-media-heading > div:first-child > span { font-size: 15px; }
    .ps-media-heading-actions { flex-wrap: wrap; }
    .ps-media-grid { grid-template-columns: 1fr; gap: 38px; }
    .ps-media-card-copy h3 { min-height: 0; font-size: 20px; }
    .ps-media-card-copy p { min-height: 0; }
    .ps-media-search { grid-template-columns: 105px 1fr 48px; }
    .ps-media-view-header { text-align: left; }
    .ps-media-view-header h2 { font-size: 27px; }
    .ps-media-view-header dl { justify-content: flex-start; }
    .ps-media-video-frame, .ps-media-view-gallery { margin-top: 36px; }
    .ps-media-invalid-video { min-height: 220px; }
    .ps-media-view-content { min-height: 160px; padding: 36px 4px 50px; font-size: 15px; }
    .ps-media-view-actions { align-items: stretch; flex-direction: column; }
    .ps-media-view-actions > a { width: 100%; }
    .ps-media-view-actions div { display: grid; grid-template-columns: repeat(3,1fr); }
    .ps-media-view-actions div a { min-width: 0; }
    .ps-media-siblings a { grid-template-columns: 58px minmax(0,1fr); padding-right: 8px; padding-left: 8px; }
    .ps-media-siblings time { display: none; }
    .ps-media-write-heading h2 { font-size: 30px; }
    .ps-media-form-row { grid-template-columns: 1fr; gap: 0; }
    .ps-media-form-row .ps-media-field + .ps-media-field { border-left: 0; }
    .ps-media-field, .ps-media-form-row .ps-media-field { grid-template-columns: 1fr; gap: 10px; padding: 18px 4px; }
    .ps-media-field > label { padding-top: 0; }
    .ps-media-field small { grid-column: 1; }
    .ps-media-upload-section { padding-right: 4px; padding-left: 4px; }
    .ps-media-upload-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
    .ps-media-file-field { grid-template-columns: 1fr; }
    .ps-media-file-field > input[type="text"], .ps-media-file-delete { grid-column: 1; }
    .ps-media-form-actions a, .ps-media-form-actions button { min-width: 0; flex: 1; }
}