<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">                            @charset "utf-8";

/* reset CSS */
html { height: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;  }
body { height: 100%; margin: 0; line-height: 1.4; }
body, input, textarea, button, select, pre { font-family: "SCoreDream", "Malgun Gothic", "AppleGothic", sans-serif; font-size: 16px; color: #000;  word-break: keep-all; }
ul, ol, dl, h1, h2, h3, h4, h5, h6, p, fieldset { margin: 0; padding: 0; }
ul, ol, dl { list-style: none; }
caption, legend { width: 0px;height: 0px;overflow: hidden; }
fieldset { border: none; }
textarea { resize: none; }
input[readonly]{ background:#F5F5F5; }
select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABGCAQAAADbJyoPAAACP0lEQVR42u3YuU7DQBAG4K1AnIGeG3G8A10IEM6OAgmJU9wUv3gEHoiHoKEDKcgoIVCDEDcdRbDBhBmT+NyNQBptFXvj/TSenZ1EldTfGUowghGMYAQjGMEIRjAGMDjAPY6Q8k6AydGLY9xg0YPBPEqfI4eGmmF6cOuuOsIxh+7lEgqcY4zShZfymvscky7fcDhtxjGDhPKOYW/O7BJODq1GMQO4I6vNVdhN2CYTrO+XZSRtH8hKM1W2NlbJpCu0GMEM4pWsMu5TZ7BBJuadl6WZ0o9nssIk/Isei46FRq2UPjyRp2ecawEVmEXnHPXaKN12Wf158sTX1cDjgHEsNGuKCt1B2e/rIc4mbJEvXmiITgeLyvTPnVAHJZbJly8TRqeP7aBRei/kqY0VFp32BJv5wZu2kTE2Z4+lcpOGXJnz3o/Qz7BULsTY6L/qSgKMzVkjDysiFYkyxChjleZEw/DoFNEaISpvv+tKUozCDnnoGepCUTrLrZMzpqrNi45RWGdlsClEVO6DoxIXwxsMuzkNKPw0KrN+c+NheHTyPpwulrZZ/xjGxSgsMU5blRJHKemgFxofw6OTq7DReUM5EZzoSTB8Z1mel8Ubytkwuy4ZhrdfRbSQEscaynDVKCmGNxh5l9PLcmUqbGlMjuFHqGV/TuHR7zg0i1HYJIuf4DRa2urG8DPL92SuBYbnjvuTLGqToQ/Du0FPQ1l7DOVk4nSCejEKC/axeB1c+DVg5D89wQhGMIIRjGAEI5h/ivkALYLMcpqwu0EAAAAASUVORK5CYII=") right 10px center no-repeat; background-size: 10px 10px; }
a { color: #0681ce; }
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration: underline; transition-duration: 250ms; }
a:active { text-decoration: none; }
a:focus { text-decoration: none; }
.blind { width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; line-height: 1px; text-indent: -9999em; overflow: hidden; position: absolute; top: -9999em; left: -9999em; }
::-webkit-input-placeholder, :-ms-input-placeholder, ::placeholder { color: #767676; }
@media screen and (max-width:1000px) {
    body, input, textarea, button, select, pre { font-size: 15px; }
}

/* margin */
.mt-0 { margin-top: 0 !important; }
.mt-5 { margin-top: 5px !important; }
.mt-10 { margin-top: 10px !important; }
.mt-15 { margin-top: 15px !important; }
.mt-20 { margin-top: 20px !important; }
.ml-0 { margin-left: 0 !important; }
.ml-5 { margin-left: 5px !important; }
.ml-10 { margin-left: 10px !important; }
.ml-15 { margin-left: 15px !important; }
.ml-20 { margin-left: 20px !important; }
.mr-0 { margin-right: 0 !important; }
.mr-5 { margin-right: 5px !important; }
.mr-10 { margin-right: 10px !important; }
.mr-15 { margin-right: 15px !important; }
.mr-20 { margin-right: 20px !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-5 { margin-bottom: 5px !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-15 { margin-bottom: 15px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-30 { margin-bottom: 30px !important; }

/* display */
.disp-inblock { display: inline-block; }
.disp-block { display: block; }

/* text */
.text-primary { color: #00813e !important; }
.text-secondary { color: #797676 !important; }
.text-success { color: #007975 !important; }
.text-info { color: #0681ce !important; }
.text-warning { color: #947201 !important; }
.text-danger { color: #dd3654 !important; }
.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }
.text-bold-5 { font-weight: 500 !important; }
.text-bold-6 { font-weight: 600 !important; }
.requied { color: #d74f4f !important; }
strong { font-weight: 500; }
mark { background-color: #fcf8e3; font-weight: 500; }
h4, .h4 { margin: 0 0 15px 0; font-size: 1.5rem; letter-spacing: -.3px; line-height: 1.35; font-weight: 500; display: block; }
h5, .h5 { margin: 0 0 10px 0; font-size: 1.25rem; letter-spacing: -.3px; line-height: 1.35; font-weight: 500; display: block; }
h6, .h6 { margin: 0 0 7px 0; font-size: 1rem; font-weight: 500; display: block; }

/* badge */
.badge { padding: 5px 10px; border: 1px solid #D9D9D9; border-radius: 5px; box-sizing: border-box; line-height: 1; text-align: center; font-weight: 500; font-size: .875rem; white-space: nowrap; vertical-align: baseline; display: inline-block; }
.badge-primary { background-color: #e8f4ee; border-color: #e8f4ee; color: #00813e; }
.badge-secondary { background-color: #f2f3f4; border-color: #f2f3f4; color: #797676; }
.badge-success { background-color: #e8f3f3; border-color: #e8f3f3; color: #007975; }
.badge-info { background-color: #e9f2f6; border-color: #e9f2f6; color: #096A9D; }
.badge-warning { background-color: #f5f2e8; border-color: #f5f2e8; color: #947201; }
.badge-danger { background-color: #fcedef; border-color: #fcedef; color: #dd3654; }
.badge-dark { background-color: #f0f0f0; border-color: #f0f0f0; color: #595959; }
.badge-outline-primary { background-color: #fff; border-color: #00813e; color: #00813e; }
.badge-outline-secondary { background-color: #fff; border-color: #727780; color: #727780; }
.badge-outline-success { background-color: #fff; border-color: #007975; color: #007975; }
.badge-outline-info { background-color: #fff; border-color: #096A9D; color: #096A9D; }
.badge-outline-warning { background-color: #fff; border-color: #947201; color: #947201; }
.badge-outline-danger { background-color: #fff; border-color: #DB374D; color: #DB374D; }
.badge-outline-dark { background-color: #fff; border-color: #595959; color: #595959; }

/* form */
.form-group { margin-bottom: 15px; }
.form-group.flex { display: flex; }
.form-group.flex .form-control { width: 100%; }
.form-group.flex .form-control + .form-control { margin-left: 7px; }
.form-group.flex .custom-control + .custom-control { margin-left: 15px; }
.form-group .hyphen { margin: 0 5px; display: flex; align-items: center; }

/* input */
.form-control { width: 100%; padding: 10px; background-color: #fff; border: 1px solid #D9D9D9; box-sizing: border-box; border-radius: 7px; font-weight: normal; }
.form-control:focus { border-color: #00823E; transition-duration: 250ms; }
.size-sm { padding: 7px 10px; font-size: .813rem; }
.size-lg { padding: 15px 10px; border-radius: 10px; font-size: 1.125rem; }

/* size */
.w-xs { width: 80px !important; }
.w-sm { width: 100px !important; }
.w-md { width: 150px !important; }
.w-lg { width: 200px !important; }
.w-xl { width: 250px !important; }
.w-full { width: 100% !important; }
.w-2xl { width: 300px !important; }
.w-3xl { width: 350px !important; }
.w-4xl { width: 400px !important; }
.w-5xl { width: 450px !important; }
.w-6xl { width: 500px !important; }
.w-7xl { width: 600px !important; }
.w-full { width: 100% !important; }

/* 체크박스, 라디오버튼 커스텀 */
.custom-control { display: flex; position: relative; }
.custom-control input[type="radio"], .custom-control input[type="checkbox"] { width: 16px; margin: 0 -16px 0 0; opacity: 0; z-index: auto; }
.custom-control label { padding: 0 0 0 22px; line-height: 1.35; cursor: pointer; display: inline-block; position:relative; }
.custom-control label:before, .custom-control label:after { content: ""; display: block; position: absolute; top: 1px; left: 0; }
.custom-control label:before { width: 15px; height: 15px; background-color: #fff; border: 1px solid #b1b1b1; border-radius: 4px; }
.custom-control input:focus + label:before { outline: 2px solid #000; }
.custom-control input[type="radio"] + label:before, .custom-control input[type="radio"] + label:after { border-radius: 50px; }
.custom-control input[type="radio"]:checked + label:after { width: 9px; height: 9px; margin: 4px; background-color: #00813e; }
.custom-control input[type="checkbox"]:checked + label:after { width: 9px; height: 4px; margin: 4px 3px; border-left: 2px solid #00813e; border-bottom: 2px solid #00813e; -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.custom-control input[disabled] + label { color: #8c8c8c; }
.custom-control input[disabled] + label:before { background-color: #e8e8e8; }
.custom-control.check-lg label { padding: 0 0 0 28px; font-size: 1.125rem; }
.custom-control.check-lg label:before { width: 19px; height: 19px; }
.custom-control.check-lg input[type="checkbox"]:checked + label:after { width: 11px; height: 5px; margin: 5px 4px; }

/* 버튼형 라디오 버튼 */
.btn-group { display: flex; position: relative; }
.btn-group .btn-check { clip: rect(0, 0, 0, 0); position: absolute; }
.btn-group .btn-check:focus + label { outline: 2px solid #000; }
.btn-group .btn-check:checked + .btn { border-color: #00813e; color: #00813e; z-index: 3; }
.btn-group &gt; .btn:not(:last-child), .btn-group &gt; .btn-group:not(:last-child) &gt; .btn { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.btn-group &gt; .btn:nth-child(n+3), .btn-group &gt; :not(.btn-check) + .btn, .btn-group &gt; .btn-group:not(:first-child) &gt; .btn { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.btn-group &gt; :not(.btn-check:first-child) + .btn { margin-left: -1px; }

/* button */
.btn { padding: 10px 20px; background-color: transparent; border: 1px solid transparent; box-sizing: border-box; color: #fff; border-radius: 7px; text-align: center; font-weight: normal; line-height: 1.4; display: inline-block; cursor: pointer; }
.btn:hover { text-decoration: none; outline: 2px dashed black; outline-offset: 2px; transition:none; }/*웹접근성 조치, 아웃라인 추가*/
.btn:focus{ text-decoration: none; outline: 3px solid black; outline-offset: 2px; transition:none; } /*웹접근성 조치, 아웃라인 추가*/
.btn-sm { padding: 6px 13px 4px 13px; border-radius: 7px; font-size: .875rem; }
.btn-lg { padding: 15px 20px; border-radius: 10px; font-size: 1.125rem; }
.btn-block { width: 100%; display: block; }
.btn-primary { background-color: #00813e; border-color: #00813e; }
.btn-primary:hover { background-color: #006732; }
.btn-secondary { background-color: #727780; }
.btn-secondary:hover { background-color: #5b5f66; }
.btn-success { background-color: #007975;}
.btn-success:hover { background-color: #00615e;  }
.btn-info { background-color: #096A9D;  }
.btn-info:hover { background-color: #07557e;}
.btn-warning { background-color: #947201;  }
.btn-warning:hover { background-color: #765b01;}
.btn-danger { background-color: #DB374D; }
.btn-danger:hover { background-color: #af2c3e;  }
.btn-light { background-color: #fff; border-color: #D9D9D9; color: #000; }
.btn-light:hover { background-color: #FBFBFB; border-color: #aeaeae; }
.btn-dark { background-color: #595959; }
.btn-dark:hover { background-color: #474747;  }

.btn-outline-primary { background-color: #fff; border-color: #00813e; color: #00813e; }
.btn-outline-primary:hover { background-color: #ebf5f0; border-color: #006732; color: #006732; }
.btn-outline-secondary { background-color: #fff; border-color: #727780; color: #727780; }
.btn-outline-secondary:hover { background-color: #f4f4f5; border-color: #5b5f66; color: #5b5f66; }
.btn-outline-success { background-color: #fff; border-color: #007975; color: #007975; }
.btn-outline-success:hover { background-color: #ebf4f4; border-color: #00615e; color: #00615e; }
.btn-outline-info { background-color: #fff; border-color: #096A9D; color: #096A9D; }
.btn-outline-info:hover { background-color: #ecf3f7; border-color: #0567a5; color: #0567a5; }
.btn-outline-warning { background-color: #fff; border-color: #947201; color: #947201; }
.btn-outline-warning:hover { background-color: #f7f4eb; border-color: #765b01; color: #765b01; }
.btn-outline-danger { background-color: #fff; border-color: #DB374D; color: #DB374D; }
.btn-outline-danger:hover { background-color: #fdf5f6; border-color: #af2c3e; color: #af2c3e; }
.btn-outline-dark { background-color: #fff; border-color: #595959; color: #595959; }
.btn-outline-dark:hover { background-color: #f7f7f7; border-color: #474747; color: #474747; }

/* 버튼 아이콘 */
.btn-down:after { width: 15px; height: 15px; margin-left: 5px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -60px -123px; display: inline-block; }
.btn-sm.btn-down:after { width: 14px; height: 14px; margin-left: 5px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-size: 463px auto; background-position: -56px -114px; display: inline-block; position: relative; top: 1px; }
.btn-plus, .btn-minus { width: 30px !important; height: 31px; position: relative; }
.btn-plus:before, .btn-plus:after, .btn-minus:before { content: ""; background-color: #fff; display: inline-block; }
.btn-plus:before { width: 2px; height: 14px; position: relative; top: 1px; }
.btn-plus:after { width: 14px; height: 2px; margin-top: -1px; position: absolute; top: 50%; left: 7px; }
.btn-minus:before { width: 13px; height: 2px; position: relative; top: -5px; left: -5px; }

/* 목록 스타일 */
.list-type { padding-left: 15px; }
.list-type li { position: relative; }
.list-type li + li { margin-top: 4px; }
.list-type &gt; li ul { margin: 5px 0 10px 0; padding-left: 0; }
.list-type &gt; li &gt; ul &gt; li ul { margin-left: 10px; }
.list-type.dot &gt; li:before { width: 4px; height: 4px; content: ""; background-color: #00827F; border-radius: 10px; display: block; position: absolute; top: 9px; left: -9px; }
.list-type.dot &gt; li &gt; ul { padding-top: .2rem; }
.list-type.decimal { padding-left: 20px; list-style-type: decimal; list-style-position: outside; }
.list-type.decimal &gt; li &gt; ul { padding-top: .2rem; }
.list-type.ganada &gt; li { padding-left: 8px; position: relative; }
.list-type.ganada &gt; li &gt; i { font-style: normal; position: absolute; left: -15px; }
.list-type.hyphen &gt; li:before { width: 7px; height: 1px; content: ""; background-color: #000; display: block; position: absolute; top: 10px; left: -13px; }
.list-type.hyphen &gt; li &gt; ul { padding-top: .2rem; }

/* info ment */
* + .info-ment  { margin: 7px 0 0 0; }
.info-ment { padding: 0px 0 0 18px; color: #767676; font-size: .938rem; line-height: 1.3; display: inline-block; position: relative; }
.info-ment:before { width: 13px; height: 13px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -128px -45px; display: inline-block; position: absolute; top: 3px; left: 0; }
.wrong-ment { padding: 0px 0 0 18px; color: #DB374D; font-size: .938rem; line-height: 1.3; display: inline-block; position: relative; }
.wrong-ment:before { width: 13px; height: 13px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -144px -45px; display: inline-block; position: absolute; top: 3px; left: 0; }

/* 테이블 상단 컨텐츠 */
.table-utility { margin-bottom: 15px; display: flex; align-items: center; }
.table-utility .left { margin-right: auto; }
.table-utility .right { margin-left: auto; }
.table-utility .txt span { color: #00813e; font-weight: 500; }
.table-utility .count span { margin-right: 2px; }
.table-utility .btn { width: auto; }

/* 테이블 (본문용) */
.table { width: 100%; margin: 20px 0; border-collapse: collapse; border-spacing: 0; box-sizing: border-box; position: relative; }
.table th, .table td { padding: 11px 10px; border-bottom-width: 1px; border-left-width: 1px; border-right-width: 1px; border-width: 1px; border-style: solid; border-color: #dedede; text-align: center; line-height: 1.45; word-wrap: break-word; word-break: keep-all; vertical-align: middle; }
.table:before { width: 100%; height: 1px; content: ""; background-color: #000; display: block; position: absolute; left: 0; top: 0; }
.table th:first-child, .table td:first-child { border-left: none; }
.table th:last-child, .table td:last-child { border-right: none; }
.table thead th { padding: 11px 10px; border-bottom: 0; font-weight: 500; }
.table tbody th { font-weight: normal; }
.table tbody td * { vertical-align: middle; }
.col-table thead th { padding: 11px 10px; background-color: #f6f6f6; border-bottom: 0; font-weight: 500; }
.row-table tbody th { background-color: #f6f6f6; font-weight: 500; }
.table-scroll .table { margin: 0; }

/* 데이터 테이블 */
.data-table { margin: 0; }
.data-table thead th { padding: 13px 13px; background-color: #f7f7f7; font-weight: 500; }
.data-table tbody td { padding: 13px 13px; }
.data-table .none { width: 100%; padding: 8rem 0; color: #767676; font-size: 1.125rem; text-align: center; }
.data-table th a, .data-table td a:not(.btn) { color: #000; }
.data-table th a:hover, .data-table td a:not(.btn):hover { color: #00813e; }
.data-table td .icon-link { width: 15px; height: 15px; margin-left: 5px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -20px -123px; display: inline-block; position: relative; top: -2px; }
.data-table td .icon-print { width: 15px; height: 15px; margin-left: 5px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -40px -123px; display: inline-block; position: relative; top: -2px; }
.data-table + .pagination { margin-top: 30px; }

/* 상세 테이블 */
.detail-table tbody th { padding: 13px 13px; background-color: #f7f7f7; font-weight: 500; }
.detail-table tbody td { padding: 13px 13px; }
.detail-table td a { color: #000; }
.detail-table td a:hover { color: #00813e; }

/* 상세 테이블 (입력 폼) */
.detail-table .required { display: inline-block; }
.detail-table .required:before { margin-left: 5px; content: "*"; color: #dd3654; display: inline-block; }
.detail-table .required span { display: none; }
.detail-table tbody td { text-align: left; }
.detail-table .form-group { margin-bottom: 0; }
.detail-table .form-group + * { margin-top: 6px; }
.detail-table .form-control { width: 200px; }
.detail-table  textarea:focus{ outline: 2px solid black; } /*웹접근성 추가 조치*/
.detail-table .phone { display: flex; align-items: center; }
.detail-table .phone .form-control { width: 80px; min-width: 80px; }
.detail-table .email { display: flex; align-items: center; flex-wrap: wrap; }
.detail-table .form-control + .form-control { margin-left: 7px; }
.detail-table [class$="ment"] { margin-top: 6px; display: block; }
.detail-table + .action-btn-group { margin-top: 30px; }
.detail-table .none { width: 100%; padding: 2rem 0; color: #767676; font-size: 1.125rem; text-align: center; }

/* 검색조건 */
.search-condition { margin-bottom: 30px; padding: 25px; background-color: #F0F8F4; display: flex; flex-direction: column; }
.search-condition .tr { display: flex; flex-wrap: wrap; }
.search-condition .tr .form-group { margin-right: 20px; display: flex; align-items: center; }
.search-condition .tr .lable { min-width: 100px; margin-right: 10px; font-size: .938rem; }
.search-condition .tr .lable.w-sm { min-width: 110px; }
.search-condition .tr .form-control { min-width: 150px; }
.search-condition .tr .form-control + .form-control { margin-left: 7px; }
.search-condition .tr .form-control[type="text"] { min-width: 200px; }
.search-condition .tr .form-control.w-lg { min-width: 200px !important; }
.search-condition .tr .form-control.w-sm { min-width: 100px !important; }
.search-condition .tr .tieup { display: flex; align-items: center; flex-wrap: wrap; }
.search-condition .tr .tieup strong { width: 100%; margin-bottom: 8px; }
.search-condition .tr .btn + .btn { margin-left: 5px; }
.search-condition .action-btn-group { margin-top: 10px; padding-top: 20px; border-top: 2px solid #D8ECE1; }

.btncon { width: 15px; height: 15px; margin-right: 7px; }
.icon-search { width: 15px; height: 15px; margin-right: 7px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: 0 -123px; display: inline-block; position: relative; top: 1px; }

/* 요소 하단 버튼 그룹 */
.action-btn-group { display: flex; justify-content: center; }
.action-btn-group .center, .action-btn-group .left, .action-btn-group .right { display: flex; }
.action-btn-group .btn + .btn { margin-left: .5rem; }
.action-btn-group .left { margin-right: auto; }
.action-btn-group .right { margin-left: auto; }
.action-btn-group .full { width: 100%; display: flex; }
.action-btn-group .full .btn { width: 100%; }
form + .action-btn-group { margin-top: 10px; }

/* 게시판 상단 검색 */
.post-search fieldset { display: flex; align-items: center; }
.post-search fieldset select { width: 100px; margin-right: 7px; }
.post-search .wrap { position: relative; }
.post-search .wrap .form-control { padding-right: 43px; }
.post-search .wrap .btn { width: 43px; height: 43px; padding: 0; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; right: 0; }
.post-search .wrap .btn:before { width: 19px; height: 19px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -308px -80px; display: block; position: relative; top: -1px; }
.post-search .wrap .btn:hover:before { color: #049BA2; }
.post-search .wrap .btn span { width: 1px; height: 1px; line-height: 1px; text-indent: -9999em; overflow: hidden; position: absolute; top: -9999em; left: -9999em; }

/* 게시판 목록 */
.board-list { margin: 0 0 1rem 0; }
.board-list .num { width: 85px; }
.board-list .subject { width: auto; }
.board-list .date { width: 140px; }
.board-list .counter { width: 100px; }
.board-list th { padding: 15px 13px; border-left-width: 0; border-right-width: 0; }
.board-list td { padding: 15px 13px; border-left-width: 0; border-right-width: 0; }
.board-list .none { width: 100%; padding: 8rem 0; color: #767676; font-size: 1.125rem; text-align: center; }
.board-list .fixed { background-color: #f6fbf8; }
.board-list .fixed .subject a strong { color: #00813e; }
.board-list .fixed .num .badge { background-color: transparent; border: 1px solid #00813e; color: #00813e; }
.board-list td.subject { text-align: left; }
.board-list .subject a { color: #000; display: flex; }
.board-list .subject a strong { height: 20px; color: #000; font-weight: normal; line-height: 1.3; white-space: normal; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.board-list .subject a strong:hover { text-decoration: underline !important; }
.board-list .subject .new { width: 18px; height: 18px; margin-left: 5px; display: inline-block; position: relative; }
.board-list .subject .new:before { width: 18px; height: 18px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -126px -80px; display: inline-block; }
.board-list .subject .new span, .board-list .subject .file span { width: 1px; height: 1px; line-height: 1px; text-indent: -9999em; overflow: hidden; position: absolute; top: -9999em; left: -9999em; }
.board-list .subject .file { width: 14px; height: 14px; margin-left: 5px; display: inline-block; position: relative; top: -1px; }
.board-list .subject .file:before { width: 14px; height: 14px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -149px -80px; display: inline-block; }
.board-list + .pagination { margin-top: 2rem; }

/* 페이지넘버 */
.pagination { margin-bottom: .5rem; display: flex; align-items: center; justify-content: center; }
.pagination ul { margin: 0; display: flex; }
.pagination ul li { vertical-align: middle; display: inline-block; }
.pagination ul li + li { border-left: none !important; }
.pagination ul li a { min-width: 32px; height: 32px; padding: 0 6px; border-radius: .4rem; box-sizing: border-box; color: #444444; text-decoration: none; display: flex; align-items: center; justify-content: center; position: relative; }
.pagination ul li a span { position: relative; bottom: -1px; }
.pagination ul li.first, .pagination ul li.prev { margin-right: 6px; }
.pagination ul li.next, .pagination ul li.last { margin-left: 6px; }
.pagination ul li.first a, .pagination ul li.prev a, .pagination ul li.next a, .pagination ul li.last a { width: 26px; height: 32px; background: url("../images/common/base_sprite.png") no-repeat 0 0; border: 0px solid #6E6E6E; position: relative; }  /*기존: #D9D9D9*/
.pagination ul li.first a:hover, .pagination ul li.prev a:hover, .pagination ul li.next a:hover, .pagination ul li.last a:hover { background-color: #F6F7F8; }
.pagination .active &gt; a, .pagination .active &gt; a:hover, .pagination .active &gt; a:focus { background-color: #00813e; color: #fff; text-decoration: none; }
.pagination ul li a:hover, .pagination li a:focus { color: #00813e; text-decoration: underline; }
.pagination ul li.first a { background-position: -168px -81px; }
.pagination ul li.prev a { background-position: -203px -81px; }
.pagination ul li.next a { background-position: -239px -81px; }
.pagination ul li.last a { background-position: -273px -81px; }
.pagination ul li.disabled a { cursor: default; } /*웹접근성 수정, 오퍼시티 삭제*/
.pagination ul li.disabled a:hover { background-color: #fff; }
.pagination .m-num { display: none; }
.pagination .m-num .page-mark { padding: 6px 15px; line-height: 1.4; text-decoration: none; vertical-align: top; position: relative; }
.pagination .m-num .page-mark span { color: #00813e; font-weight: 500; cursor: default; }
.pagination .m-num .page-mark span:after { content: "/"; padding: 0 7px; color: #bbb; }

/* 게시판 읽기 */
.board-view { margin: 0 0 30px 0; border-top: 1px solid #3c3c3c; border-bottom: 1px solid #3c3c3c; }
.board-view .head { padding: 25px 15px; border-bottom: 1px solid #dedede; }
.board-view .head .subject { font-size: 1.75rem; font-weight: 500; letter-spacing: -.3px; line-height: 1.35; text-align: center; display: block; }
.board-view .head .info { margin: 10px 0 0 0; padding: 0; text-align: center; }
.board-view .head .info li { margin: 0; padding: 0; color: #767676; font-size: .938rem; display: inline-block; }
.board-view .head .info li strong { margin-right: 8px; font-weight: normal; }
.board-view .head .info li:after { width: 1px; height: 13px; margin: 0 9px 0 14px; content: ""; background-color: #D9D9D9; display: inline-block; position: relative; top: 0; }
.board-view .head .info li:last-child:after { display: none; }
.board-view .content { min-height: 200px; padding: 30px 15px; line-height: 1.6; }
.board-view .file { padding: 15px; border-top: 1px solid #dedede; }
.board-view .file .tit { margin-bottom: .7rem; color: #767676; }
.board-view .file ul { margin: 0; }
.board-view .file ul li { padding-left: 20px; line-height: 1.35; text-align: left; position: relative; }
.board-view .file ul li + li { margin: 5px 0 0 0; }
.board-view .file ul li:before { width: 14px; height: 14px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -149px -80px; display: inline-block; position: absolute; top: 4px; left: 0; }
.board-view .file ul li a { color: #000; }
.board-view .file ul li a:hover { color: #00813e; }

/* 이전글, 다음글 */
.board-nextpost { width: 100%; margin: 30px 0; padding: 0; border-top: 1px solid #767676; border-bottom: 1px solid #767676; }
.board-nextpost li { padding: 14px 0 12px 0; border-bottom: 1px solid #dedede; line-height: 1.3; display: flex; }
.board-nextpost li:last-child { border-bottom: none; }
.board-nextpost li strong { width: 100px; color: #767676; text-align: center; font-weight: normal; }
.board-nextpost li a { width: 100%; height: 20px; padding: 0 15px; color: #000; font-weight: normal; white-space: normal; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }

/* 게시글 작성 */
.board-write { margin: 0 0 30px 0; }
.board-write .table { margin: 0; }
.board-write .subject { display: flex; align-items: center; }
.board-write .subject .custom-control { margin-left: 15px; }
.file-upload .input-file { display: flex; position: relative; }
.file-upload .input-file .file-route { width: 100%; padding: 10px; background-color: #fff; border: 1px solid #D9D9D9; border-right: none; box-sizing: border-box; border-radius: .4rem 0 0 .4rem; font-weight: normal; }
.file-upload .input-file .file-label { padding: 10px 20px; background-color: #fff; border: 1px solid #595959; box-sizing: border-box; color: #595959; border-radius: 0 .4rem .4rem 0; text-align: center; font-weight: normal; display: inline-block; cursor: pointer; }
.file-upload .input-file [type="file"] { width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; clip-path: inset(50%); overflow: hidden; position: absolute; }
.file-upload .input-file .file-focus { outline: 2px solid #000; }
.file-upload .upload-list { margin-top: 10px; }
.file-upload .upload-list li { /*padding-left: 20px;*/ line-height: 1.35; text-align: left; position: relative; }
/*.file-upload .upload-list li:before { width: 14px; height: 14px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -149px -80px; display: inline-block; position: absolute; top: 4px; left: 0; }*/
.file-upload .upload-list li + li { margin-top: 3px; }
.file-upload .upload-list li a { color: #000; display: inline-block; }
.file-upload .upload-list li a:hover { color: #00813e; }
.file-upload .upload-list li .delete { width: 16px; height: 16px; margin: -2px 0 0 7px; display: inline-block; position: relative; }
.file-upload .upload-list li .delete:before { width: 16px; height: 16px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-size: 420px auto; background-position: -279px -67px; display: inline-block; position: relative; }
.file-upload .upload-list li .delete span { width: 1px; height: 1px; line-height: 1px; text-indent: -9999em; overflow: hidden; position: absolute; top: -9999em; left: -9999em; }

/* FAQ */
.faq-list { margin: 0 0 30px 0; border-top: 1px solid #000; }
.faq-list ul { width: 100%; list-style: none; }
.faq-list ul li { border-bottom: 1px solid #dedede; position: relative; }
.faq-list ul li.active { background-color: #f6fbf8; }
.faq-list .question { padding: 25px 50px 25px 80px; text-decoration:none; color: #000; display: block; position: relative; }
.faq-list .question:before { width: 40px; height: 40px; content: "Q"; background-color: #00813e; border-radius: 50px; font-size: 1.25rem; color: #fff; font-weight: 500; display: flex; align-items: center; justify-content: center; position: absolute; top: calc(50% - 20px); left: 25px; }
.faq-list .question:after { width: 14px; height: 8px; content: ""; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAICAYAAADJEc7MAAAAcklEQVR42mMoKyubzEACAKrPAWJ1htDQUObS0tI/xGgCqtsJxG5wgYaGBjagKT8J2LStvLzcE0OisLCQE2jaNxyatgA1eeM0NSsriweo6DOapo1A7EfQHwUFBQJAm99DNa0H4gBSQo4XqPk80HlWDNQGAMl9L5RuMd/fAAAAAElFTkSuQmCC") no-repeat 0 0; display: block; position: absolute; top: calc(50% - 4px); right: 20px; }
.faq-list .active .question:after { transform: rotate( 180deg ); }
.faq-list .question strong { height: 20px; color: #000; font-weight: 500; line-height: 1.3; white-space: normal; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.faq-list .answer { padding: 10px 25px 25px 80px; position: relative; }
.faq-list .answer:before { width: 30px; height: 30px; content: "A"; background-color: #947201; border-radius: 50px; font-size: 1.125rem; color: #fff; font-weight: 500; display: flex; align-items: center; justify-content: center; position: absolute; top: 10px; left: 30px; }
.faq-list .none { width: 100%; padding: 8rem 0; color: #767676; font-size: 1.125rem; text-align: center; }

/* 안내멘트 박스 */
.notice-box, .info-box { width: 100%; margin-bottom: 30px; padding: 4px; box-sizing: border-box; }
.notice-box { background: url("../images/common/notice_pattern.png") repeat 0 0; }
.notice-box .inner { padding: 23px 25px 20px 110px; background-color: #fff; background-image: url("../images/common/notice_icon.png"); background-size: 71px auto; background-repeat: no-repeat; background-position: 20px center; }
.info-box { background: url("../images/common/notice_pattern.png") repeat 0 0; }
.info-box .inner { padding: 23px 25px 20px 110px; background-color: #fff; background-image: url("../images/common/info_icon.png"); background-size: 71px auto; background-repeat: no-repeat; background-position: 20px 20px; }
.info-box .inner .tit { margin-bottom: 5px; padding: 0 0 0 11px; display: block; position: relative; }
.info-box .inner .tit:before { width: 5px; height: 15px; content: ""; background-color: #183855; position: absolute; top: 4px; left: 0; }
.border-box { width: 100%; margin-bottom: 30px; padding: 23px 25px; border: 1px solid #D5D5D5; box-sizing: border-box;     border-radius: 15px; }

.alert-box { width: 100%; margin-bottom: 20px; padding: 15px 15px 15px 44px; background-color: #fff; border: 1px solid #ccc; box-sizing: border-box; font-size: 16px; font-weight: bold; display: block; position: relative; }
.alert-box.danger { background-color: #f8d7da; border-color: #f1aeb5; color: #58151c; }
.alert-box.success { background-color: #d1e7dd; border-color: #a3cfbb; color: #0a3622; }
.alert-box.info { background-color: #cff4fc; border-color: #9eeaf9; color: #055160; }
.alert-box.warning { background-color: #fff3cd; border-color: #ffe69c; color: #664d03; }
.alert-box:before { width: 22px; height: 22px; content: ""; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGcAAAAWCAYAAADdP4KdAAAERklEQVR42t2aP2gUQRTGk91LCkOQgOu5KBjUTgwbwei2aQTBwkJIHYjprCKC3kUtRVsL/6y2gTTBlLERBJsVtMlqKsFgYSHxLA6yp+f34DsYztvZmb29YDz4wd57b97B+3Zm3+zc0NA/9jkwc2IE+OCIXA/yt0au3KqAKqkM8reuXXYroErK+60575gDQuIMQBAR4w54B1LQJnIdg2XglSSID+ogBilok5Q28fklCeKDOohBCtokpU18fj/CeOADaBO5PlSSKBWK0lQE+QE2yQ/F/rxr7GFw2kIUF9RAUxGkARLSUOxNxroFRXFBDTQVQRogIQ3F3mSsW0ScVUWU97xeLUGYg+AVC98CT8AMGFZihkEA7oFziv0U2Oa4CQNhxsEGC98CEQiBo8Q4tEWMaXPMuKUw42CDhW+BCITAUWIc2iLGtDlm3EaYWYrxDRwk32ib7XPGdIRJwBmLsR1hZOyaKqZmxnSE2QKBgZgBYzsCuRYzpiPMFggMxgSM7QjkmggzAjYpxLxin6dNfCMFxVlmcT/aPEu6hHkJRg0KXVOE8SyWQU8RqGYoTk0RxrOYbZ4iUM1EnBsU4S0YVuzDtInvRsGHf5NL0pkBC+Pz+dHKmjGwL4BFzQxqMYdv8PBvcpkKMmIWBM0MajGHrxPmKPgJfoFp2m4KvJ6mT2KOFpw1TwcpDItb550faWI+gy8af8Qc9Rxx6rzzI03Md0Hjj5ijrhNnhTPjkWLbEZTvjxizYilOzCKfH6QwLGzMwoaamElwUuMPmSPOESdmYUNNzI6g8YfMEZs0ARMacSZsmwM2ArJ3aQCny7cI3ogYJsLg+jpYlZyaDWbKFrnw3oxdXIO5KpoNZsoW2elDHIc50r82qllNQC9xijQHKGSVhd7s4XtI3zZF0c4YfH9N32RGUau845Oc4q8LOTEJc1UzilrlHZ/kzC6tOIxJmKtq1ARoxLFqDhRxkh6+UYrQEUi7lLEFF3+1T3F2hD0SZ12wFqdXE9AlxAuhh924OdAtaz0E0gnjMEfa77KWJ06Zy5pBS917WevVBFhsVo2bA6UhCDP8ItBjMpoRc4E54hIagjxxymwIjoMTVg1BVhPQJUAAzmb4jJsDFLTOwj7r4w3DM+aol9BKfxf2qJX+DL4Yt9K6JqBLgG3wVeM3ag66NqFTBYSZ4ljJ4Ze0CV3Yw03oovEmFIWcy2oCuop/BVzV+NXmYC6nwDXe+Z8sX994HCNjjV6p7OvXNyjkMgu6VMK5zxJz3c0psgs2WOQtefNsIEzA2DbHuoZF3r8vPlHIiyxoA6yDtYKsM4fkumRQ7DFFIFmmImkS1C6OXVlIX0sRZsxyI7l/jwxQzPugpRyoFeU3eGCxTLlc4tTDtp/cwyRslzv2JmMLHYDt68M2nngGfXK4YPcl/xe4zTZ7VxFklzbxHRkq4fNfHVPv9YcbVY8M9E8X//ofPP4A5z7unVAlwVsAAAAASUVORK5CYII=') 0 0 no-repeat; display: inline-block; position: absolute; top: 15px; left: 15px; }
.alert-box.danger:before { background-position: 0 0; }
.alert-box.success:before { background-position: -27px 0; }
.alert-box.info:before { background-position: -54px 0; }
.alert-box.warning:before { background-position: -81px 0; }	


/* 보호중 동물 - 목록 (썸네일 목록형) */
.animals-list { margin: -13px; display: flex; flex-wrap: wrap; position: relative; }
.animals-list &gt; li { width: calc(100% / 4 - 26px); margin: 13px; }
.animals-list &gt; li a { background-color: #fff; border: 1px solid #D5D5D5; border-radius: 15px; color: #000; overflow: hidden; display: block; position: relative; }
.animals-list &gt; li a:hover { border-color: #00823E; text-decoration: none; transition-duration: 250ms; }
.animals-list &gt; li a:hover .subject { text-decoration: underline; }
.animals-list &gt; li a .thum { height: 300px; overflow: hidden; display: flex; align-items: center; justify-content: center; position: relative; }
.animals-list &gt; li a .inner-img { width: 100%; height: 300px; background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; position: relative; }
.animals-list &gt; li a .thum-img { position: absolute; top: 0; left: 0; width: 0; height: 0; line-height: 0; }
.animals-list &gt; li a .thum img { width: 0; height: 0; }
.animals-list &gt; li a .date { width: 60px; height: 60px; background-color: #00827F; border-radius: 0 0 15px 15px; color: #fff; display: flex; align-items: center; justify-content: center; flex-direction: column; position: absolute; top: 0; right: 20px; }
.animals-list &gt; li a .date span { font-size: .688rem; order: 2; }
.animals-list &gt; li a .date em { font-size: 1.5rem; line-height: 1.2; font-style: normal; font-weight: 500; order: 1; }
.animals-list &gt; li a &gt; ol { padding: 20px 25px; }
.animals-list &gt; li a &gt; ol .subject { font-size: 1.25rem; font-weight: 600; }
.animals-list &gt; li a &gt; ol .info { margin-top: 15px; }
.animals-list &gt; li a &gt; ol .info .info-item { display: flex; }
.animals-list &gt; li a &gt; ol .info .info-item + .info-item { margin-top: 6px; }
.animals-list &gt; li a &gt; ol .info .info-item .label { min-width: 65px; margin-right: 15px; color: #797676; }
.animals-list &gt; li a &gt; ol .info .info-item .value { height: 23px; white-space: normal; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.animals-list &gt; .none { width: 100%; padding: 8rem 0; color: #767676; font-size: 1.125rem; text-align: center; }
.animals-list + .pagination { margin-top: 30px; }

/* lightbox */
#colorbox { z-index: 200; }
#cboxOverlay { width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); position: fixed; top: 0; left: 0; z-index: 190; }
#cboxCurrent, #cboxPrevious, #cboxNext, #cboxClose { width: 40px; height: 40px; background: rgba(0,0,0,0.8) url("../images/common/lightbox.png") no-repeat 0 0; border: 0; text-indent: -99999px; position: absolute; bottom: 5px; }
#cboxCurrent { width: 150px; background: rgba(0,0,0,0.8); color: #fff; line-height: 40px; text-indent: 0; text-align: center; right: 123px; }
#cboxPrevious { right: 82px; }
#cboxNext { background-position: -120px 0; right: 41px; }
#cboxClose { background-position: -160px 0; right: 0; }
.cboxPhoto { max-width: 1000px !important; width: auto !important; height: auto !important; max-height: 750px !important; }

/* modal */
.modal { width: 100%; height: 100%; background-color: rgba(0,0,0,.8); overflow: auto; display: none; position: fixed; left: 0; top: 0; z-index: 900; }
.modal-lg { max-width: 800px !important; }
.modal-xl { max-width: 1000px !important; }
.modal .modal-sandbox { width: 100%; height: 100%; background-color: transparent; position: fixed; top: 0; left: 0; }
.modal .modal-content { width: 90%; max-width: 500px; margin: 100px auto; position: relative; animation-name: modalbox; animation-duration: .4s; animation-timing-function: cubic-bezier(0,0,.3,1.6); }
.modal .modal-head { padding: 13px 20px; background-color: #fff; border-bottom: 1px solid #D9D9D9; border-radius: 15px 15px 0 0; display: flex; position: relative; }
.modal .modal-head .tit { margin-right: auto; font-size: 1.125rem; font-weight: 500; }
.modal .modal-head .btn-close { width: 46px; height: 46px; cursor: pointer; display: inline-block; position: absolute; top: 0; right: 0; }
.modal .modal-head .btn-close span { display: none; }
.modal .modal-head .btn-close:before, .modal .modal-head .btn-close:after { width: 20px; height: 1px; content: ""; background-color: rgba(0,0,0,.6); position: absolute; top: 24px; right: 13px; }
.modal .modal-head .btn-close:before { transform: rotate(-135deg); -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); -ms-transform: rotate(-135deg); }
.modal .modal-head .btn-close:after { transform: rotate(135deg); -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -ms-transform: rotate(135deg); }
.modal .modal-body { min-height: 100px; padding: 20px; background-color: #fff; border-radius: 0 0 15px 15px; }
.modal .modal-body .action-btn-group { margin-top: 25px; }
@-webkit-keyframes modalbox {
  0% { top: -250px; opacity: 0; }
  100% { top: 0; opacity: 1; }
}
@keyframes modalbox {
  0% { top: -250px; opacity: 0; }
  100% { top: 0; opacity: 1; }
}
/* modal : alert */
.alert-ment { text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column; }
.alert-ment:before { width: 55px; height: 55px; margin-bottom: 20px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-size: 365px auto; display: inline-block; }
.alert-ment.success:before { background-position: 0 -104px; }
.alert-ment.info:before { background-position: -60px -104px; }
.alert-ment.save:before { background-position: -120px -104px; }
.alert-ment.danger:before { background-position: -180px -104px; }

/* Tab */
.tab { width: 100%; display: flex; }
.tab &gt; ul { width: 100%; margin: 0; padding: 0; display: flex; align-items: flex-start; position: relative; }
.tab &gt; ul:after { width: 100%; height: 1px; content: ""; background-color: #00823E; position: absolute; top: 49px; }
.tab &gt; ul &gt; li { display: flex; }
.tab &gt; ul &gt; li &gt; a { background-color: #fafafa; border: 1px solid #D9D9D9; border-bottom-color: #D9D9D9; border-radius: 7px 7px 0 0; color: #767676; text-decoration: none; position: relative; }
.tab &gt; ul &gt; li &gt; a &gt; span { padding: 13px 25px; box-sizing: border-box; display: inline-block; cursor: pointer; }
.tab &gt; ul &gt; li .tab-pane { width: 100%; margin: 0; border: 0; box-sizing: border-box; list-style: none; display: none; position: absolute; top: 80px; left: 0; }
.tab &gt; ul &gt; li.active .tab-pane { display: block; }
.tab &gt; ul &gt; li.active &gt; a { background-color: transparent; border: 1px solid #00823E; border-bottom: 1px solid #fff; color: #00823E; z-index: 38; }
.tab &gt; ul &gt; li.active &gt; a &gt; span { font-weight: 500; }
.tab &gt; .size-flex &gt; li, .tab &gt; .size-flex &gt; li &gt; a, .tab &gt; .size-flex &gt; li &gt; a &gt; span { width: 100%; }
.tab &gt; .size-flex &gt; li &gt; a &gt; span { text-align: center; }

/* 본문텍스트 스타일 */
.sub-contents { line-height: 1.5; }
.sub-contents h4 { padding: 0 0 0 34px; position: relative; }
.sub-contents h4:before { width: 25px; height: 25px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -81px -80px; position: absolute; top: 4px; left: 0; }
.sub-contents h5 { padding-left: 16px; position: relative; }
.sub-contents h5:before { width: 10px; height: 13px; content: ""; background: url("../images/common/base_sprite.png") no-repeat 0 0; background-position: -111px -80px; position: absolute; top: 6px; left: 0; }
.sub-contents h6 { display: block; }
hr { margin: 35px 0; height: 1px; background-color: #E6E6E6; border: 0; }
.sub-contents * + h5 { margin-top: 20px; }
.sub-contents * + h6 { margin-top: 15px; }
.sub-contents h4 ~ h6, .sub-contents h5 ~ h6,
.sub-contents h5 + h6 ~ ul, .sub-contents h6 ~ ul, .sub-contents h6 ~ p,
.sub-contents h5 ~ ul, .sub-contents h5 ~ p { margin-left: 15px; }
.quotation { margin: 0 0 30px 0; display: flex; justify-content: center; align-items: center; }
.quotation span { color: #00813e; font-size: 1.5rem; text-align: center; letter-spacing: -.3px; line-height: 1.35; font-weight: 500; display: inline-block; position: relative; }
.quotation span:before { font-family: "OneMobile"; font-size: 4rem; color: #666; font-weight: 500; line-height: 1; opacity: .4; content: '“'; position: absolute; top: -10px; left: -50px; }
.quotation span:after { font-family: "OneMobile"; font-size: 4rem; color: #666; font-weight: 500; line-height: 1; opacity: .4; content: '”'; position: absolute; top: -10px; right: -50px; }
.sub-contents .para + * { margin-top: 35px; }
.card-box { margin-bottom: 40px; padding: 25px; background-color: #F4F5F6; border-radius: 15px; }
.card-box .tit { font-size: 1.25rem; font-weight: 500; }
.card-box .tit + * { margin-top: 10px; }

.img-responsive { display: flex; justify-content: center; }

/* responsive */
@media screen and (max-width:1200px) {
    .animals-list &gt; li { width: calc(100% / 3 - 26px); }
}
@media screen and (max-width:1000px) {
    .table-utility.column { flex-direction: column; }
	.data-table colgroup col { width: 100% !important; }
    .data-table thead th { display: none; }
    .data-table tbody tr { padding: 12px 0; border-bottom: 1px solid #dedede; display: block; }
    .data-table tbody th, .data-table tbody td { width: 100%; padding: 4px 10px; box-sizing: border-box; border-top-width: 0; border-bottom-width: 0;  border-left-width: 0; border-right-width: 0; text-align: left; display: block; }
    .data-table tbody th:before, .data-table tbody td:before { margin-right: 15px; content: attr(data-title); color: #767676; display: inline-block; }
    .detail-table colgroup col { width: 100% !important; }
    .detail-table tr { display: flex; flex-direction: column; }
    .detail-table tbody th, .detail-table tbody td { width: 100%; box-sizing: border-box; border-top-width: 0; border-left-width: 0; border-right-width: 0; }
    .detail-table tbody th { margin-bottom: 6px; padding: 13px 10px 0 10px; background-color: #fff; border-bottom-width: 0; color: #00813e; text-align: left; }
    .detail-table tbody td { padding: 0 10px 13px 10px; text-align: left; }
    form .detail-table .flex { flex-direction: column; }
    form .detail-table .flex .custom-control + .custom-control { margin-top: 5px; margin-left: 0; }
    form .detail-table .form-control, form .detail-table .btn { width: 100% !important; }
    form .detail-table .form-control + *:not(.hyphen) { margin-top: 7px; margin-left: 0 !important; }
    form .detail-table .form-control[class*="w-"] { width: 100% !important; }
    form .detail-table .addr .form-group { display: flex; flex-direction: column; }
    form .detail-table .email input { width: calc(100% / 2 - 12px) !important; }
    form .detail-table .email select { width: 100% !important; }   
    .table-scroll { overflow-x: auto; }
    .table-scroll .table { width: 900px; }
    .board-list .date { width: 160px; }
    .board-list .num:before { margin-right: 10px; content: "번호"; vertical-align: middle; }
    .board-list .subject:before { margin-right: 10px; content: "제목"; position: relative; top: -1px; }
    .board-list .date:before { margin-right: 10px; content: "작성일"; }
    .board-list .counter:before { margin-right: 10px; content: "조회수"; }
    .board-list .date:after, .board-list .counter:after { width: 1px; height: 13px; content: ""; background-color: #D9D9D9; display: inline-block; position: relative; top: 3px; right: -14px; }
    .board-list td:last-child:after, .board-list thead { display: none; }
    .board-list tbody tr { padding: 13px 10px; border-bottom: 1px solid #dedede; display: flex; flex-wrap: wrap; }
    .board-list tbody td { border-top-width: 0; border-bottom-width: 0; }
    .board-list td.num { width: 100%; margin-bottom: 6px; padding: 0; text-align: left; }
    .board-list td.subject { width: 100%; margin-bottom: 6px; padding: 0; display: flex; }
    .board-list .subject a strong { font-size: 1rem; font-weight: 500; }
    .board-list .num:before, .board-list .subject:before, .board-list .date:before, .board-list .counter:before { padding: 0; color: #767676; font-size: .875rem; }
    .board-list .date, .board-list .counter { padding: 0; font-size: .875rem; display: flex; }
    .board-view .head { padding: 20px 10px; }
    .board-view .head .subject { font-size: 1.5rem; }
    .board-view .head .info li { font-size: .875rem; }
    .board-view .head .info li:after { top: 1px; }
    .board-view .content { padding: 25px 10px; }
    .board-view .file { padding: 15px 10px; }
    .board-nextpost li strong { max-width: 65px; }
    .board-nextpost li a { padding: 0 10px; }
    .pagination .pc-num { display: none; }
    .pagination .m-num { display: block; }
    .action-btn-group + .pagination { margin-top: 15px; }
    .board-write .table, .board-write .table tbody, .board-write .table tr { display: block; }
    .board-write .table th, .board-write .table td { width: 100%; padding: 11px 0; display: block; }
    .board-write .table th { padding: 11px 0 0 0; border-right-width: 0; border-bottom-width: 0; text-align: left; }
    .board-write .table td { border-left-width: 0; border-top-width: 0; }
    .form-group { margin-bottom: 10px; }    
    .search-condition .tr .form-group { width: 100%; margin-right: 0; }
    .search-condition .tr .lable { width: auto !important; }
    .search-condition .tr .form-control.w-sm, .search-condition .tr .form-control.w-lg { width: 100% !important; min-width: auto !important; }
    .animals-list &gt; li { width: calc(100% / 2 - 26px); }
    .cboxPhoto { max-width: 750px !important; }
    .modal .modal-content { margin: 25px auto; }
    .tab &gt; ul:after { top: 48px; }
    .img-responsive img { width: 100%; }
}
@media screen and (max-width:768px) {
    h4, .h4 { font-size: 1.25rem; }
    h5, .h5 { font-size: 1.125rem; }
    h6, .h6 { font-size: .938rem; }
    .form-control { padding: 12px 10px; }
    .btn:not(.btn-sm, .btn-lg) { padding: 12px 20px; }
    .table-utility .left + .right { margin-top: 5px; }    
    .post-search .wrap { width: calc(100% - 100px); }
    .post-search .wrap .form-control { width: 100% !important; }    
    .action-btn-group .center, .action-btn-group .left, .action-btn-group .right { width: 100%; flex-direction: column; }
    .action-btn-group .btn { width: 100% !important; }
    .action-btn-group .btn + .btn { margin-top: 10px; margin-left: 0; }    
    .notice-box, .info-box { margin-bottom: 20px; }
    .notice-box .inner, .info-box .inner { padding: 72px 15px 15px 15px; background-position: 15px 18px; background-size: 50px auto; }
    .border-box { padding: 15px 20px; }
    .search-condition { padding: 20px; }
    .search-condition .tr { flex-direction: column; }    
    .search-condition .tr .form-group { width: 100%; flex-wrap: wrap; }
    .search-condition .tr .lable { width: 100% !important; margin-right: 0; margin-bottom: 5px; }
    .search-condition .tr .form-control { width: 100% !important; }
    .search-condition .tr .form-control + .form-control { margin-top: 7px; margin-left: 0; }
    .search-condition .tr .date .form-control[type="date"] { width: calc(100% / 2 - 13px) !important; min-width: auto; }
    .animals-list &gt; li { width: calc(100% - 26px); }
    .animals-list &gt; li a &gt; ol { padding: 20px; }
    .animals-detail .thum-list { margin: -8px; } 
    .animals-detail .thum-list &gt; li { margin: 8px; width: calc(100% / 3 - 16px); }
    .animals-detail .thum-list &gt; li a, .animals-detail .thum-list &gt; li a img { height: 300px; }
    .cboxPhoto { max-width: 320px !important; }
    .animals-detail .detail-table { margin-top: 30px; }
    .faq-list .question { padding: 20px 40px 20px 55px; }
    .faq-list .question:before { width: 30px; height: 30px; font-size: 1.125rem; top: calc(50% - 15px); left: 13px; }
    .faq-list .question:after { right: 13px; }
    .faq-list .answer { padding: 10px 20px 20px 55px; }
    .faq-list .answer:before { top: 6px; left: 13px; }
}
</pre></body></html>