@charset "UTF-8";
/* #Base */
/* Reset */
* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}

*:before, *:after {
    -webkit-box-sizing: inherit;
            box-sizing: inherit;
}

a {
    color: inherit;
    text-decoration: none;
    outline: 0;
}

img {
    max-width: 100%;
    height: auto;
    border: 0;
}

table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

input {
    font-family: inherit;
}

select {
    font-family: inherit;
}

textarea {
    font-family: inherit;
    resize: vertical;
}

button {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    letter-spacing: inherit;
    cursor: pointer;
    outline: 0;
}

/* Fonts */
@font-face {
    font-family: Pretendard;
    font-weight: 200;
    src: url("../fonts/Pretendard-ExtraLight.woff2") format("woff2");
}
@font-face {
    font-family: Pretendard;
    font-weight: 300;
    src: url("../fonts/Pretendard-Light.woff2") format("woff2");
}
@font-face {
    font-display: swap;
    font-family: Pretendard;
    font-weight: 400;
    src: url("../fonts/Pretendard-Regular.woff2") format("woff2");
}
@font-face {
    font-family: Pretendard;
    font-weight: 500;
    src: url("../fonts/Pretendard-Medium.woff2") format("woff2");
}
@font-face {
    font-family: Pretendard;
    font-weight: 600;
    src: url("../fonts/Pretendard-SemiBold.woff2") format("woff2");
}
@font-face {
    font-family: Pretendard;
    font-weight: 700;
    src: url("../fonts/Pretendard-Bold.woff2") format("woff2");
}
@font-face {
    font-family: Pretendard;
    font-weight: 800;
    src: url("../fonts/Pretendard-ExtraBold.woff2") format("woff2");
}
@font-face {
    font-family: Pretendard;
    font-weight: 900;
    src: url("../fonts/Pretendard-Black.woff2") format("woff2");
}
/* Helper Classes */
.sr-text {
    display: block;
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    font-size: 1px;
    color: transparent;
    white-space: nowrap;
    overflow: hidden;
    border: 0;
}

.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.lg-hidden {
    display: none !important;
}
@media screen and (max-width: 1024px) {
    .lg-hidden {
        display: block !important;
    }
}

@media screen and (max-width: 1024px) {
    .sm-hidden {
        display: none !important;
    }
}

/* #Common */
/* Button */
.btn-done {
    display: inline-block;
    padding: 1.2272727273em 4em;
    font-size: 1.375rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.05em;
    border: 0;
    border-radius: 0.625rem;
    background: var(--color-point);
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.btn-done:hover {
    background-color: var(--color-hover);
}
@media screen and (max-width: 1024px) {
    .btn-done {
        padding: 1em 3.6666666667em;
        font-size: 0.9375rem;
        border-radius: 0.3333333333em;
    }
}

.btn-cancel {
    display: inline-block;
    padding: 1.2272727273em 4em;
    font-size: 1.375rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.05em;
    border: 0;
    border-radius: 0.625rem;
    background: var(--color-gray);
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.btn-cancel:hover {
    background-color: #404344;
}
@media screen and (max-width: 1024px) {
    .btn-cancel {
        padding: 1em 3.6666666667em;
        font-size: 0.9375rem;
        border-radius: 0.3333333333em;
    }
}

.btn-wrap {
    margin-top: 3.125rem;
    text-align: center;
}
@media screen and (max-width: 1024px) {
    .btn-wrap {
        margin-top: 1.5625rem;
    }
}

.action-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 3.125rem -0.3125rem -0.625rem;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.action-group [class*=btn-] {
    margin: 0 0.3125rem 0.625rem;
}
@media screen and (max-width: 1024px) {
    .action-group {
        margin: 1.5625rem -0.3125rem -0.625rem;
    }
}

/* Color */
.important {
    color: var(--color-point);
    font-style: normal;
}

/* Forms */
.form-text {
    display: inline-block;
    width: 100%;
    height: 3.75rem;
    padding: 0 1.5rem;
    font-size: inherit;
    font-weight: 500;
    border: 1px solid #C2C2C2;
    border-radius: 0;
    background: #fff;
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    outline: 0;
    -webkit-transition: border 0.3s, -webkit-box-shadow 0.3s;
    transition: border 0.3s, -webkit-box-shadow 0.3s;
    transition: border 0.3s, box-shadow 0.3s;
    transition: border 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
    vertical-align: middle;
}
.form-text:focus {
    border-color: var(--color-point);
    -webkit-box-shadow: inset 0 0 0 3px var(--color-point);
            box-shadow: inset 0 0 0 3px var(--color-point);
}
@media screen and (max-width: 1024px) {
    .form-text {
        height: 2.5rem;
        padding: 0 0.75rem;
    }
    .form-text:focus {
        border-color: var(--color-point);
        -webkit-box-shadow: inset 0 0 0 1px var(--color-point);
                box-shadow: inset 0 0 0 1px var(--color-point);
    }
}

.form-textarea {
    display: inline-block;
    width: 100%;
    height: 32.5rem;
    padding: 1.5rem;
    font-size: inherit;
    font-weight: 500;
    border: 1px solid #C2C2C2;
    border-radius: 0;
    background: #fff;
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    outline: 0;
    resize: none;
    -webkit-transition: border 0.3s, -webkit-box-shadow 0.3s;
    transition: border 0.3s, -webkit-box-shadow 0.3s;
    transition: border 0.3s, box-shadow 0.3s;
    transition: border 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
    vertical-align: middle;
}
.form-textarea:focus {
    border-color: var(--color-point);
    -webkit-box-shadow: inset 0 0 0 3px var(--color-point);
            box-shadow: inset 0 0 0 3px var(--color-point);
}
@media screen and (max-width: 1024px) {
    .form-textarea {
        height: 28.75rem;
        padding: 0.75rem;
    }
    .form-textarea:focus {
        border-color: var(--color-point);
        -webkit-box-shadow: inset 0 0 0 1px var(--color-point);
                box-shadow: inset 0 0 0 1px var(--color-point);
    }
}

.form-selectbox {
    display: inline-block;
    position: relative;
    width: 100%;
    max-width: 21.4375rem;
    height: 3.75rem;
    vertical-align: middle;
}
.form-selectbox:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 1.875rem;
    bottom: 0;
    width: 1.125rem;
    height: 0.625rem;
    margin: auto;
    background: url("../img/ic_caret.svg") no-repeat 0 0;
    background-size: contain;
    pointer-events: none;
}
.form-selectbox select {
    width: 100%;
    height: 100%;
    padding: 0 3.125rem 0 1.5rem;
    font-size: inherit;
    font-weight: 500;
    border: 1px solid #C2C2C2;
    border-radius: 0;
    background: #fff;
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    outline: 0;
    -webkit-transition: border 0.3s, -webkit-box-shadow 0.3s;
    transition: border 0.3s, -webkit-box-shadow 0.3s;
    transition: border 0.3s, box-shadow 0.3s;
    transition: border 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
}
.form-selectbox select:focus {
    border-color: var(--color-point);
    -webkit-box-shadow: inset 0 0 0 3px var(--color-point);
            box-shadow: inset 0 0 0 3px var(--color-point);
}
.form-selectbox select:invalid,
.form-selectbox option[disabled] {
    color: #C2C2C2;
}
.form-selectbox option {
    font-size: 1rem;
    color: #000;
}
.form-selectbox select:focus {
    border-color: var(--color-point);
    -webkit-box-shadow: inset 0 0 0 3px var(--color-point);
            box-shadow: inset 0 0 0 3px var(--color-point);
}
@media screen and (max-width: 1024px) {
    .form-selectbox {
        max-width: none;
        height: 2.5rem;
    }
    .form-selectbox:after {
        right: 1.125rem;
        width: 0.625rem;
        height: 0.375rem;
    }
    .form-selectbox select {
        padding: 0 1.875rem 0 0.75rem;
    }
    .form-selectbox select:focus {
        border-color: var(--color-point);
        -webkit-box-shadow: inset 0 0 0 2px var(--color-point);
                box-shadow: inset 0 0 0 2px var(--color-point);
    }
}

.form-file {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    width: 100%;
    height: 3.75rem;
    padding: 0 1.5rem;
    font-size: 1.125rem;
    font-weight: 500;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border: 1px solid #C2C2C2;
    background: #fff;
    outline: 0;
    overflow: hidden;
    -webkit-transition: background-color 0.3s, border 0.3s;
    transition: background-color 0.3s, border 0.3s;
}
.form-file input[type] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.form-file:has(input:focus) {
    border-color: var(--color-point);
    -webkit-box-shadow: inset 0 0 0 3px var(--color-point);
            box-shadow: inset 0 0 0 3px var(--color-point);
}
.form-file .btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 0 1em;
    font-weight: 500;
    color: #fff;
    line-height: 2.2222222222;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    cursor: pointer;
    border: 0;
    border-radius: 80px;
    background: var(--color-gray);
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.form-file .btn:hover {
    background-color: #363A3A;
}
.form-file .file-limit,
.form-file .file-name {
    margin-left: 0.5555555556em;
}
.form-file .file-name {
    display: inline-block;
    min-width: 0;
    font-weight: 700;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.form-file .icon-file {
    display: inline-block;
    width: 1.1111111111em;
    height: 1.1111111111em;
    margin: -2px 4px 0 0;
    vertical-align: middle;
    background: url("../img/ic_file.svg") no-repeat 0 0;
    background-size: contain;
}
@media screen and (max-width: 1024px) {
    .form-file {
        height: 2.5rem;
        padding: 0 0.75rem;
        font-size: 0.8125rem;
    }
    .form-file:focus {
        border-color: var(--color-point);
        -webkit-box-shadow: inset 0 0 0 1px var(--color-point);
                box-shadow: inset 0 0 0 1px var(--color-point);
    }
    .form-file .btn {
        padding: 0 0.6923076923em;
        line-height: 1.9230769231;
    }
}

.input-wrap {
    display: inline-block;
    position: relative;
    width: 100%;
    vertical-align: middle;
}

/* #Layout */
:root {
    --color-point: #90001E;
    --color-hover: #70001E;
    --color-gray: #4F5556;
}

@media screen and (min-width: 1920px) {
    html {
        font-size: 0.8333333333vw;
    }
}
@media screen and (max-width: 1400px) {
    html {
        font-size: 1.1428571429vw;
    }
}
@media screen and (max-width: 1024px) {
    html {
        font-size: 1rem;
    }
}
@media screen and (max-width: 414px) {
    html {
        font-size: 3.8647342995vw;
    }
}

body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 100dvh;
    font-family: Pretendard, sans-serif;
    color: #000;
    letter-spacing: -0.03em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    overflow: hidden;
    overflow-y: scroll;
    word-break: keep-all;
    word-wrap: break-word;
}

.skip {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 1em;
    font-weight: bold;
    color: #fff;
    text-align: center;
    opacity: 0;
    background: var(--color-point);
    -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
            transform: translateY(-100%);
    z-index: -1;
}
.skip:focus, .skip:active {
    position: relative;
    opacity: 1;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    z-index: 99;
}

.container {
    width: 100%;
    max-width: 83.3333333333vw;
    margin: 0 auto;
}
@media screen and (max-width: 1024px) {
    .container {
        max-width: 88.4057971014vw;
    }
}

/* Header */
.header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 1.75rem 3rem 0;
    z-index: 10;
}
@media screen and (max-width: 1024px) {
    .header {
        padding: 0.875rem 1.5rem 0;
    }
}

.site-logo {
    width: 19.375rem;
    height: 2.25rem;
}
.site-logo a {
    display: block;
    width: 100%;
    height: 100%;
}
.site-logo img {
    display: block;
    width: 100%;
    height: 100%;
}
@media screen and (max-width: 1024px) {
    .site-logo {
        width: 13.25rem;
        height: 1.5625rem;
        margin: 0 auto;
    }
}

.btn-login {
    position: absolute;
    top: 1.5625rem;
    right: 2.5rem;
    padding: 0 1.4444444444em;
    font-size: 1.125rem;
    font-weight: 800;
    color: #000;
    line-height: 2.2222222222;
    border-radius: 0.5555555556em;
    background: #fff;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.btn-login:hover {
    background-color: #e1e1e1;
}
@media screen and (max-width: 1024px) {
    .btn-login {
        top: 0.7142857143em;
        right: 0.8571428571em;
        padding: 0 0.4285714286em;
        font-size: 0.875rem;
    }
    .btn-login span {
        position: absolute;
        top: 0;
        left: 0;
        width: 1px;
        height: 1px;
        opacity: 0;
        overflow: hidden;
    }
}

.btn-logout {
    position: absolute;
    top: 1.5625rem;
    right: 2.5rem;
    padding: 0 1.4444444444em;
    font-size: 1.125rem;
    font-weight: 800;
    color: #000;
    line-height: 2.2222222222;
    border-radius: 0.5555555556em;
    background: #fff;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.btn-logout::before {
    content: "";
    display: inline-block;
    width: 1.3333333333em;
    height: 1.3333333333em;
    margin: -2px 2px 0 0;
    vertical-align: middle;
    background: url("../img/ic_logout.svg") no-repeat 0 0;
    background-size: contain;
}
.btn-logout:hover {
    background-color: #e1e1e1;
}
@media screen and (max-width: 1024px) {
    .btn-logout {
        top: 0.7142857143em;
        right: 0.8571428571em;
        padding: 0 0.4285714286em;
        font-size: 0.875rem;
    }
    .btn-logout span {
        position: absolute;
        top: 0;
        left: 0;
        width: 1px;
        height: 1px;
        opacity: 0;
        overflow: hidden;
    }
    .btn-logout:before {
        margin-right: 0;
    }
}

/* 페이지 공통 레이아웃 */
.page-title {
    font-size: 5rem;
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 1;
}
@media screen and (max-width: 1024px) {
    .page-title {
        font-size: 2.5rem;
    }
}

.page-header {
    position: relative;
    width: 100%;
    padding: 14.375rem 0;
    color: #fff;
    overflow: hidden;
    background: #efefef;
    z-index: 0;
}
.page-header .cover {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: -1;
}
.page-header .bg-video {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    z-index: -1;
}
.page-header .bg-video video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
}
@media screen and (max-width: 1024px) {
    .page-header {
        padding: 8.5rem 0;
    }
    .page-header .page-title {
        text-align: center;
    }
}

.page-body {
    padding: 7.25rem 0 6.25rem;
}
@media screen and (max-width: 1024px) {
    .page-body {
        padding: 2rem 0 3.125rem;
    }
}

.section {
    margin-top: 6.25rem;
}
.section:first-child {
    margin-top: 0;
}
@media screen and (max-width: 1024px) {
    .section {
        margin-top: 3.125rem;
    }
}

.section-title {
    margin-bottom: 1em;
    font-size: 1.875rem;
    font-weight: 700;
}
@media screen and (max-width: 1024px) {
    .section-title {
        margin-bottom: 0.65em;
        font-size: 1.25rem;
    }
}

/* 로그인 */
.login-content {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    font-size: 0;
    background: #B1A499 url("../img/login_bg.jpg") no-repeat 50% 50%;
    background-size: cover;
    overflow: auto;
    text-align: center;
    white-space: nowrap;
}
.login-content:before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
.login-content .container {
    display: inline-block;
    width: 45.375rem;
    max-width: none;
    font-size: 1rem;
    vertical-align: middle;
    text-align: left;
    white-space: normal;
}
.login-content .headline {
    font-size: 5em;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.05em;
    line-height: 1;
    text-align: center;
}
.login-content .headline img {
    display: block;
    width: 3.875em;
    height: 0.45em;
    margin: 0 auto 0.3375em;
}
@media screen and (max-width: 1024px) {
    .login-content {
        min-height: 0;
        background-position: 30% 100%;
    }
    .login-content .container {
        width: 87.6811594203%;
    }
    .login-content .headline {
        font-size: 3.0625rem;
    }
}

.login-form {
    margin: 3.125em 0;
    padding: 5.9375em 11.4325068871%;
    color: #fff;
    border-radius: 1.875em;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(15px);
}
.login-form .form-row {
    margin-bottom: 2.5em;
    padding-bottom: 1.875em;
    border-bottom: 1px solid;
}
.login-form input[name] {
    width: 100%;
    padding: 0 1em 0 6.8em;
    font-size: 1.25rem;
    font-weight: 500;
    color: inherit;
    letter-spacing: -0.05em;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    border: 0;
    border-radius: 0;
    background: transparent;
    -webkit-box-shadow: none;
            box-shadow: none;
    outline: 0;
}
.login-form input[name]::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.3);
}
.login-form input[name]::-moz-placeholder {
    color: rgba(255, 255, 255, 0.3);
}
.login-form input[name]:-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.3);
}
.login-form input[name]::-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.3);
}
.login-form input[name]::placeholder {
    color: rgba(255, 255, 255, 0.3);
}
.login-form input[name]::-ms-reveal {
    display: none;
}
.login-form input[name]::-ms-clear {
    display: none;
}
.icon-label {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 5.8em;
    height: 1em;
    margin: auto;
    padding-left: 1.45em;
    font-size: 1.25em;
    font-weight: 500;
    letter-spacing: -0.05em;
    background-repeat: no-repeat;
    background-position: 0 50%;
    background-size: 1.2em auto;
}
.icon-label:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    height: 0.9em;
    margin: auto;
    border: 1px solid;
    opacity: 0.3;
}

.login-id .icon-label {
    background-image: url("../img/ic_id.svg");
}

.login-pwd .icon-label {
    background-image: url("../img/ic_pwd.svg");
}

.login-form .btn-login {
    position: static;
    display: block;
    width: 100%;
    height: 3.6363636364em;
    padding: 0;
    font-size: 1.375rem;
    font-weight: 700;
    color: #000;
    letter-spacing: -0.05em;
    line-height: normal;
    border: 0;
    border-radius: 0.4545454545em;
    background: #fff;
    -webkit-transition: color 0.3s, background-color 0.3s;
    transition: color 0.3s, background-color 0.3s;
}
.login-form .btn-login:hover {
    color: inherit;
    background-color: var(--color-point);
}
@media screen and (max-width: 1024px) {
    .login-form {
        padding: 4em 11.5702479339%;
        font-size: 0.8125rem;
        border-radius: 1.1538461538em;
    }
    .login-form .form-row {
        margin-bottom: 2.3076923077em;
        padding-bottom: 1.1538461538em;
    }
    .login-form input[name] {
        padding: 0 0.625rem 0 4.875rem;
        font-size: 16px;
    }
    .login-form .icon-label {
        width: 5.2307692308em;
        height: 1.2307692308em;
        padding-left: 1.1153846154em;
        font-size: inherit;
        background-size: 0.9230769231em auto;
    }
    .login-form .btn-login {
        font-size: 0.9375rem;
    }
}

/* 제보안내 */
.petition-desc {
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1.4285714286;
}
@media screen and (max-width: 1024px) {
    .petition-desc {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        font-size: 0.9375rem;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
}

.desc-pic {
    width: 43.5625%;
    margin-left: 5.625%;
    float: right;
}
.desc-pic img {
    width: 100%;
}
@media screen and (max-width: 1024px) {
    .desc-pic {
        width: 100%;
        margin: 1em 0 0;
        float: none;
        -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1;
    }
}

.petition-policy dl {
    font-size: 1.25rem;
    line-height: 1.5;
    overflow: hidden;
}
.petition-policy dl dt {
    font-weight: 700;
    float: left;
    clear: both;
}
.petition-policy dl dd {
    margin: 0 0 0.7em 10.4em;
}
@media screen and (max-width: 1024px) {
    .petition-policy dl {
        font-size: 0.8125rem;
    }
    .petition-policy dl dt {
        font-size: 1.1538461538em;
        margin-bottom: 0.3846153846em;
        float: none;
    }
    .petition-policy dl dd {
        margin: 0 0 2.1538461538em;
    }
    .petition-policy dl dd:last-child {
        margin-bottom: 0;
    }
}

.petition-type {
    overflow: hidden;
}
.petition-type ol {
    counter-reset: num;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.25rem;
    list-style: none;
}
.petition-type ol li {
    counter-increment: num;
    padding: 2.4em 3.125%;
    font-weight: 700;
    line-height: 1.25;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    border: 1px solid #C2C2C2;
    text-align: center;
}
.petition-type ol li:before {
    content: counter(num, decimal-leading-zero);
    display: block;
    width: 1.7857142857em;
    margin: 0 auto 0.3571428571em;
    font-size: 0.7em;
    color: #fff;
    line-height: 1.7857142857;
    border-radius: 50%;
    background: #4F5556;
    text-align: center;
}
.petition-type ol li + li {
    margin-left: 0.6em;
}
@media screen and (max-width: 1600px) {
    .petition-type ol {
        font-size: 1.0625rem;
    }
}
@media screen and (max-width: 1024px) {
    .petition-type ol {
        font-size: 0.875rem;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .petition-type ol li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 1.1428571429em 1.2857142857em;
        text-align: left;
    }
    .petition-type ol li:before {
        margin: 0 0.8em 0 0;
        font-size: 0.7142857143em;
    }
    .petition-type ol li + li {
        margin: 0.4285714286em 0 0;
    }
}

.petition-steps {
    overflow: hidden;
}
.petition-steps ol {
    counter-reset: num;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    font-size: 1.25rem;
}
.petition-steps ol li {
    counter-increment: num;
    padding: 6.7em 1.875% 2em;
    line-height: 1.25;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    border: 1px solid #C2C2C2;
    background-repeat: no-repeat;
    background-position: 50% 2.7em;
    background-size: 3.7em auto;
    text-align: center;
}
.petition-steps ol li + li {
    margin-left: 1.2em;
}
.petition-steps ol li:nth-child(1) {
    background-image: url("../img/petition_step1.svg");
}
.petition-steps ol li:nth-child(2) {
    background-image: url("../img/petition_step2.svg");
}
.petition-steps ol li:nth-child(3) {
    background-image: url("../img/petition_step3.svg");
}
.petition-steps ol li:nth-child(4) {
    background-image: url("../img/petition_step4.svg");
}
.petition-steps ol li:nth-child(5) {
    background-image: url("../img/petition_step5.svg");
}
.petition-steps ol .title {
    margin-bottom: 0.5217391304em;
    font-size: 1.15em;
    font-weight: 700;
}
.petition-steps ol .title:before {
    content: counter(num) ".";
    margin-right: 4px;
}
@media screen and (max-width: 1600px) {
    .petition-steps ol {
        font-size: 1.0625rem;
    }
}
@media screen and (max-width: 1024px) {
    .petition-steps ol {
        font-size: 0.8125rem;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .petition-steps ol li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        min-height: 7.3076923077em;
        padding: 0.8846153846em 0.9230769231em 0.8846153846em 6.1538461538em;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        background-position: 1.5384615385em 50%;
        background-size: 3.6153846154em auto;
        text-align: left;
    }
    .petition-steps ol li + li {
        margin: 0.9230769231em 0 0;
    }
    .petition-steps ol .title {
        margin-bottom: 3px;
        font-size: 1.1538461538em;
    }
}

/* 게시판 */
.editor-wrap .xefu-container {
    position: relative;
    width: 100%;
    margin-top: 0.8695652174em;
    font-size: 1.125rem;
    font-weight: 500;
    border: 1px solid #C2C2C2;
    background: #fff;
    outline: 0;
    overflow: hidden;
}
.editor-wrap .xefu-dropzone {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0.6111111111em 1.3333333333rem;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}
.editor-wrap .xefu-dropzone .fileinput-button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 0.5555555556em;
    padding: 0 1em;
    font-weight: 500;
    color: #fff;
    line-height: 2.2222222222;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    cursor: pointer;
    border: 0;
    border-radius: 80px;
    background: var(--color-gray);
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.editor-wrap .xefu-dropzone .fileinput-button input[type] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.editor-wrap .xefu-dropzone .fileinput-button:has(input:focus) {
    border-color: var(--color-point);
    -webkit-box-shadow: inset 0 0 0 3px var(--color-point);
            box-shadow: inset 0 0 0 3px var(--color-point);
}
.editor-wrap .xefu-dropzone .fileinput-button:hover {
    background-color: #363A3A;
}
.editor-wrap .xefu-progress-status {
    width: 100%;
    margin: 5px 0;
}
.editor-wrap .xefu-progressbar {
    width: 100%;
    border-bottom: 1px solid #6AB97D;
}
.editor-wrap .xefu-progressbar div {
    height: 3px;
    background: #6AB97D;
}
.editor-wrap .xefu-controll {
    padding: 0.8333333333em 1.5rem;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    border-top: 1px solid #C2C2C2;
}
.editor-wrap .xefu-controll[style*=block] {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}
.editor-wrap .xefu-controll .xefu-btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: 3px;
    padding: 0 1.2857142857em;
    font-size: 0.7777777778em;
    font-weight: 500;
    color: #fff;
    line-height: 2.2222222222;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    cursor: pointer;
    border: 0;
    border-radius: 80px;
    background: var(--color-gray);
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.editor-wrap .xefu-controll .xefu-btn input[type] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.editor-wrap .xefu-controll .xefu-btn:has(input:focus) {
    border-color: var(--color-point);
    -webkit-box-shadow: inset 0 0 0 3px var(--color-point);
            box-shadow: inset 0 0 0 3px var(--color-point);
}
.editor-wrap .xefu-controll .xefu-btn:hover {
    background-color: #363A3A;
}
.editor-wrap .xefu-list {
    border-top: 1px solid #C2C2C2;
    padding: 0.6666666667em 1.5rem;
}
.editor-wrap .xefu-list .xefu-list-files {
    margin-top: 0.6666666667em;
    padding-top: 0.3333333333em;
    border-top: 1px solid #C2C2C2;
}
.editor-wrap .xefu-list ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}
.editor-wrap .xefu-file {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: 1em;
    padding: 0.3333333333em 0;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    word-break: break-all;
}
.editor-wrap .xefu-file .xefu-file-name, .editor-wrap .xefu-file .xefu-file-info span:first-child {
    margin-right: 8px;
}
.editor-wrap .xefu-file.selected .xefu-file-name {
    color: var(--color-point);
    text-decoration: underline;
}
.editor-wrap .xefu-file input[type=checkbox] {
    margin-top: -2px;
    vertical-align: middle;
}
.editor-wrap .xefu-file-image {
    position: relative;
    width: 3.3333333333em;
    height: 3.3333333333em;
    margin-right: 0.5555555556em;
    border: 3px solid #DDD;
}
.editor-wrap .xefu-file-image .xefu-file-name {
    display: none;
}
.editor-wrap .xefu-file-image .xefu-file-size {
    display: none;
}
.editor-wrap .xefu-file-image img {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.editor-wrap .xefu-file-image input[type=checkbox] {
    position: absolute;
    top: 0;
    left: 0;
}
@media screen and (max-width: 1024px) {
    .editor-wrap .xefu-container {
        font-size: 0.8125rem;
        margin-top: 0.8695652174em;
    }
    .editor-wrap .xefu-dropzone {
        padding: 0.7777777778em 0.75rem;
    }
    .editor-wrap .xefu-dropzone .fileinput-button {
        padding: 0 0.6923076923em;
        line-height: 1.9230769231;
    }
    .editor-wrap .xefu-controll {
        padding: 0.7777777778em 0.75rem;
    }
    .editor-wrap .xefu-list {
        padding: 0.7777777778em 0.75rem;
    }
}

.form-table {
    font-size: 1.4375rem;
    letter-spacing: -0.05em;
    border-top: 1px solid;
}
.form-table .form-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 1.2173913043em 0;
    border-bottom: 1px solid #C2C2C2;
}
.form-table .col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 0;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}
.form-table .editor-wrap {
    width: 100%;
}
.form-table .form-label {
    width: 9.7826086957em;
    font-weight: 700;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 9.7826086957em;
            flex: 0 0 9.7826086957em;
}
.form-table .help-msg {
    width: 37.5rem;
    margin-left: 0.8888888889em;
    font-size: 0.7826086957em;
    font-weight: 500;
    letter-spacing: -0.05em;
    color: var(--color-gray);
    line-height: 1.1;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 37.5rem;
            flex: 0 0 37.5rem;
}
@media screen and (max-width: 1024px) {
    .form-table {
        padding-top: 0.9285714286em;
        font-size: 0.875rem;
    }
    .form-table .form-row {
        margin-bottom: 1.7142857143em;
        padding: 0 0 1.0714285714em;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .form-table .form-row:last-child {
        margin-bottom: 0;
    }
    .form-table .col {
        -webkit-box-align: initial;
            -ms-flex-align: initial;
                align-items: initial;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .form-table .form-label {
        width: 100%;
        margin-bottom: 0.5714285714em;
        -ms-flex-preferred-size: 100%;
            flex-basis: 100%;
    }
    .form-table .help-msg {
        width: 100%;
        margin: 1.0714285714em 0 0;
        font-size: 0.8571428571em;
        -ms-flex-preferred-size: 100%;
            flex-basis: 100%;
    }
}

.board-footer {
    position: relative;
}

.board-list {
    list-style: none;
    border-top: 1px solid;
}
.board-list > li {
    margin-bottom: 1.25rem;
}
@media screen and (max-width: 1024px) {
    .board-list > li {
        margin-bottom: 0.625rem;
    }
}

.list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 0;
    height: 6.25rem;
    padding: 0 3.875%;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border: 1px solid #DCDCDC;
    background: #fff;
    -webkit-transition: background-color 0.3s, border-color 0.3s, -webkit-box-shadow 0.3s;
    transition: background-color 0.3s, border-color 0.3s, -webkit-box-shadow 0.3s;
    transition: background-color 0.3s, border-color 0.3s, box-shadow 0.3s;
    transition: background-color 0.3s, border-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
}
.list-item > *:not(:last-child) {
    margin-right: 0.875em;
}
.list-item:hover {
    border-color: var(--color-point);
    -webkit-box-shadow: inset 0 0 0 1px var(--color-point);
            box-shadow: inset 0 0 0 1px var(--color-point);
    background-color: #f3f3f3;
}
.list-item a:hover {
    text-decoration: underline;
}
@media screen and (max-width: 1024px) {
    .list-item {
        display: block;
        height: auto;
        padding: 1.0625rem 13.698630137% 1.0625rem 1.25rem;
    }
    .list-item > *:not(:last-child) {
        margin-right: 0;
    }
}

.list-no {
    position: relative;
    min-width: 2.6875em;
    padding-right: 0.875em;
    font-weight: 500;
    letter-spacing: -0.05em;
    white-space: nowrap;
}
.list-no:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    height: 0.9375em;
    margin: auto;
    border-right: 1px solid #DCDCDC;
}
@media screen and (max-width: 1024px) {
    .list-no {
        min-width: 0;
        margin-right: 8px !important;
        font-size: 0.6875rem;
        float: left;
        white-space: normal;
    }
}

.list-category {
    width: 6.25em;
    font-weight: 500;
    color: var(--color-gray);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 6.25em;
            flex: 0 0 6.25em;
    letter-spacing: -0.05em;
}
@media screen and (max-width: 1024px) {
    .list-category {
        width: auto;
        font-size: 0.75rem;
    }
}

.list-title {
    min-width: 0;
    padding-right: 1em;
    font-size: 1.375em;
    font-weight: 700;
    letter-spacing: -0.05em;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
@media screen and (max-width: 1024px) {
    .list-title {
        display: -webkit-box;
        max-height: 2.5714285714em;
        padding-right: 0;
        font-size: 1.125rem;
        line-height: 1.2857142857;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        white-space: normal;
    }
    .list-title:not(:first-child) {
        margin-top: 0.3333333333em;
    }
}

.list-meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.list-meta > * {
    position: relative;
    padding-left: 1.625em;
    background-repeat: no-repeat;
    background-position: 0 50%;
    background-size: 1.5em auto;
}
.list-meta > *:not(:last-child) {
    margin-right: 0.625em;
    padding-right: 0.625em;
}
.list-meta > *:not(:last-child):before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    height: 0.9375em;
    margin: auto;
    border-right: 1px solid #DCDCDC;
}
@media screen and (max-width: 1024px) {
    .list-meta {
        margin-top: 0.5454545455em;
        font-size: 0.6875rem;
    }
}

.list-date {
    background-image: url("../img/ic_date.svg");
}

.list-writer {
    background-image: url("../img/ic_writer.svg");
}
.list-writer em {
    font-style: normal;
}

.list-total-view {
    background-image: url("../img/ic_viewing.svg");
}

.pagination {
    margin: 1.875rem 18.75rem 0;
    font-size: 0;
    letter-spacing: 0;
    line-height: 1;
    text-align: center;
}
.pagination a {
    font-size: 1.25rem;
    line-height: 1;
    vertical-align: middle;
}
.pagination .page {
    margin: 0 0.6em 3px;
    padding: 0 4px;
}
.pagination .page:hover {
    text-decoration: underline;
}
.pagination .current {
    margin-bottom: 0;
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.35;
    border-bottom: 3px solid var(--color-gray);
    pointer-events: none;
    vertical-align: middle;
}
.pagination [class^=btn-page-] {
    display: inline-block;
    width: 1.85em;
    height: 1.85em;
    border: 1px solid #C2C2C2;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: contain;
    -webkit-transition: border-color 0.3s;
    transition: border-color 0.3s;
}
.pagination [class^=btn-page-]:hover {
    border-color: #000;
}
.pagination .btn-page-first {
    margin-right: 3px;
    background-image: url("../img/ic_page_first.svg");
}
.pagination .btn-page-prev {
    margin-right: 1em;
    background-image: url("../img/ic_page_prev.svg");
}
.pagination .btn-page-next {
    margin-left: 1em;
    background-image: url("../img/ic_page_next.svg");
}
.pagination .btn-page-last {
    margin-left: 3px;
    background-image: url("../img/ic_page_last.svg");
}
@media screen and (max-width: 1024px) {
    .pagination {
        margin: 1.75rem 0 0;
    }
    .pagination a {
        font-size: 1.0625rem;
    }
    .pagination .page {
        margin: 0 0.6470588235em 3px;
    }
    .pagination .current {
        font-size: 1.0625rem;
    }
    .pagination [class^=btn-page-] {
        width: 1.7647058824em;
        height: 1.7647058824em;
    }
}

.board .view-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 2.1875em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.board .view-header .list-category {
    width: auto;
    margin-bottom: 0.5142857143em;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.board .view-header .list-title {
    padding: 0;
    font-size: 2.1875rem;
}
.board .view-header .list-meta {
    margin-top: 0.875em;
}
.board .view-body {
    border-top: 2px solid;
    border-bottom: 2px solid;
}
.board .view-body .form-table {
    font-size: 1rem;
    border-top: 0;
}
.board .view-body .form-row {
    padding: 1.625em 0 1.625em;
    border-color: #000;
}
.board .view-body .form-row:last-child {
    border: 0;
}
.board .view-body .value {
    display: block;
}
.board .view-body .long-desc {
    display: block;
    min-height: 30em;
    font-size: 1.25em;
    overflow: hidden;
    word-break: break-all;
}
.board .view-body .long-desc img {
    display: block;
}
.board .view-attachment {
    min-height: 4.25em;
    padding: 1.375em 0.625em;
    letter-spacing: -0.05em;
    border-top: 1px solid #C2C2C2;
}
.board .view-attachment a {
    display: inline-block;
    min-height: 1.5em;
    padding-left: 2em;
    color: #3641C0;
    line-height: 1.5;
    background: url("../img/ic_file.svg") no-repeat 0 0;
    background-size: 1.5em auto;
    text-decoration: underline;
    vertical-align: middle;
}
.board .view-attachment a:hover {
    font-weight: 700;
}
.board .view-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    border-bottom: 2px solid;
}
.board .view-footer [class*=list-] {
    display: block;
    min-width: 0;
    max-width: 46.875%;
    padding: 1.3888888889em 1.5555555556em;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.05em;
    background-repeat: no-repeat;
    background-size: 0.5em auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.board .view-footer [class*=list-]:before {
    content: "";
    display: block;
    margin-bottom: 2px;
    font-size: 0.7777777778em;
    font-weight: 400;
}
.board .view-footer [class*=list-]:hover strong {
    text-decoration: underline;
}
.board .view-footer .list-prev {
    margin-right: auto;
    background-position: 0 50%;
    background-image: url("../img/ic_list_prev.svg");
}
.board .view-footer .list-prev:before {
    content: "이전글";
}
.board .view-footer .list-next {
    margin-left: auto;
    background-image: url("../img/ic_list_next.svg");
    background-position: 100% 50%;
    text-align: right;
}
.board .view-footer .list-next:before {
    content: "다음글";
}
.board .view-footer .btn-listview {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 3.75rem;
    height: 3.75rem;
    margin: auto;
    border-radius: 0.625rem;
    background: var(--color-gray) url("../img/ic_listview.svg") no-repeat 50% 50%;
    background-size: 38.3333333333% auto;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.board .view-footer .btn-listview:hover {
    background-color: #404344;
}
@media screen and (max-width: 1024px) {
    .board .view-header {
        margin-bottom: 1.5625em;
    }
    .board .view-header .list-category {
        margin-bottom: 0.347826087em;
    }
    .board .view-header .list-title {
        display: block;
        margin-bottom: 0.5652173913em;
        font-size: 1.4375rem;
    }
    .board .view-header .list-meta {
        font-size: 0.6875rem;
    }
    .board .view-body .form-table {
        padding-top: 1.5625em;
        font-size: 0.8125rem;
    }
    .board .view-body .form-row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 1.5625em;
        padding: 0 0 1.5625em;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }
    .board .view-body .form-label {
        width: 9.3846153846em;
        margin-bottom: 0;
        -webkit-box-flex: 0;
            -ms-flex: 0 0 9.3846153846em;
                flex: 0 0 9.3846153846em;
    }
    .board .view-body .long-desc {
        min-height: 23em;
        font-size: 0.875em;
    }
    .board .view-attachment {
        min-height: 3.0769230769em;
        padding: 0.7857142857em;
        font-size: 0.8125rem;
    }
    .board .view-footer [class*=list-] {
        max-width: 36.231884058%;
        padding: 1.7857142857em 1.2142857143em;
        font-size: 0.875rem;
        white-space: normal;
    }
    .board .view-footer [class*=list-]:before {
        margin-bottom: 1px;
        font-size: 0.7857142857em;
        font-weight: 200;
    }
    .board .view-footer [class*=list-] strong {
        display: -webkit-box;
        max-height: 2.4em;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .board .view-footer .btn-listview {
        width: 2.375rem;
        height: 2.375rem;
        border-radius: 0.3125rem;
    }
}

/* #Print */
@media print {
    @page {
        size: auto;
        margin: 10mm;
    }
    * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .header, .page-header, .action-group, .btn-group,
    .pagination, .board .view-footer {
        display: none;
    }
    .page-body {
        padding: 0;
    }
    .container {
        max-width: none;
        padding: 0;
    }
    li {
        page-break-inside: avoid;
    }
    img {
        max-width: 100% !important;
        page-break-inside: avoid;
    }
}