@charset "UTF-8";

/*font*/
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap');
@font-face {
    font-family: "Pretendard";
    font-weight: 300;
    font-style: normal;
    src: url("../fonts/Pretendard-Light.eot");
    src: url("../fonts/Pretendard-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/Pretendard-Light.woff2") format("woff2"), url("../fonts/Pretendard/Pretendard-Light.woff") format("woff"), url("../fonts/Pretendard-Light.ttf") format("truetype");
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    font-weight: 400;
    font-style: normal;
    src: url("../fonts/Pretendard-Regular.eot");
    src: url("../fonts/Pretendard-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Pretendard-Regular.woff2") format("woff2"), url("../fonts/Pretendard-Regular.woff") format("woff"), url("../fonts/Pretendard-Regular.ttf") format("truetype");
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    font-weight: 500;
    font-style: normal;
    src: url("../fonts//Pretendard-Medium.eot");
    src: url("../fonts/Pretendard-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/Pretendard-Medium.woff2") format("woff2"), url("../fonts/Pretendard-Medium.woff") format("woff"), url("../fonts/Pretendard-Medium.ttf") format("truetype");
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    font-weight: 600;
    font-style: normal;
    src: url("../fonts/Pretendard-SemiBold.eot");
    src: url("../fonts/Pretendard-SemiBold.eot?#iefix") format("embedded-opentype"), url("../fonts/Pretendard-SemiBold.woff2") format("woff2"), url("../fonts/Pretendard-SemiBold.woff") format("woff"), url("../fonts/Pretendard-SemiBold.ttf") format("truetype");
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    font-weight: 700;
    font-style: normal;
    src: url("../fonts/Pretendard-Bold.eot");
    src: url("../fonts/Pretendard-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Pretendard-Bold.woff2") format("woff2"), url("../fonts/Pretendard-Bold.woff") format("woff"), url("../fonts/Pretendard-Bold.ttf") format("truetype");
    font-display: swap;
}

:root {
    /*color*/
    --main-1: #0a70d3;
    --main-2: #0046a5;
    --main-3: #011d3f;
    --main-4: #009bd5;
    --sub-1: #da2576;
    --sub-2: #2c3448;
    --sub-3: #fffcf4;
    --sub-4: #f6f6f6;
    --sub-5: #f4f7fc;

    --red: #da2576;
    --error: #da2576;

    --white: #fff;
    --black: #333;
    --grey-222: #222;
    --grey-333: #333;
    --grey-666: #666;
    --grey-999: #999;
    --grey-000: #000;
    --grey-ccc: #ccc;
    --grey-ddd: #ddd;
    --grey-eee: #eee;

    /*width*/
    --minWidth: 1200px;
    --lg-widt: 960px;

    /*popup size*/
    --popup-width: 640px;
    --popup-sm-width: 440px;
    --popup-lg-width: 800px;
    --popup-xl-width: 1000px;
}

/*base*/
* {margin: 0; padding: 0; box-sizing: border-box; font-family:'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
html {line-height: 1.15; -webkit-text-size-adjust: 100%;}
body {margin: 0; color: var(--black)}
main {display: block;}
h1 {font-size: 2em; margin: 0.67em 0;}
hr {height: 0; overflow: visible;}
pre {font-family: monospace, monospace; font-size: 1em;}
a {background-color: transparent;}
abbr[title] {border-bottom: none; text-decoration: underline;}
b, strong {font-weight: bolder;}
code, kbd, samp {font-family: monospace, monospace; font-size: 1em;}
small {font-size: 80%;}
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sub {bottom: -0.25em;}
sup {top: -0.5em;}
img {border-style: none;}
button, input, optgroup, select, textarea {font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0;}
button, input {overflow: visible;}
button, select {text-transform: none;}
button, [type="button"], [type="reset"], [type="submit"] {-webkit-appearance: button;}
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {border-style: none; padding: 0;}
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}
fieldset {padding: 0.35em 0.75em 0.625em;}
legend {box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal;}
progress {vertical-align: baseline;}
textarea {overflow: auto;}
[type="checkbox"], [type="radio"] {box-sizing: border-box; padding: 0;}
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height: auto;}
[type="search"] {-webkit-appearance: textfield; outline-offset: -2px;}
[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
::-webkit-file-upload-button {-webkit-appearance: button; font: inherit;}
details {display: block;}
summary {display: list-item;}
template {display: none;}
[hidden] {display: none;}
ul, ol {margin: 0;padding: 0;}
li {list-style: none;}
a, button {color: inherit; background-color: transparent;}
body.scrOff {overflow: hidden;}
em, i, address {font-style: normal;}
h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0;}

@media all and (max-width: 1280px) {
    body {touch-action: pan-y; }
}

/*bage*/
.badge-wrap {display: flex; align-items: center; flex-wrap: wrap; gap: 5px;}
.badge { display: inline-flex; justify-content: center; gap: 3px; align-items: center; height: 21px; line-height: 19px; border-radius: 2px; font-size: 13px; font-weight: 500; text-align: center; padding: 0 5px; letter-spacing: -.65px; border: 1px solid #009bd5; background-color: #009bd5; color: var(--white);}
.badge.badge-blue {border-color: #009bd5; background-color: #009bd5; color: #fff;}
.badg.badge-green {border-color: #56b454; background-color: #56b454; color: var(--white);}
.badg.badge-green2 {border-color: #b4e2c1; background-color: #f0fff6; color: #0c7f3a;}
.badg.badge-purple {border-color: #ccc7e9; background-color: #edeaff; color: #4a3a9d;}
.badg.badge-purple2 {border-color: #f1c6ef; background-color: #ffe8fe; color: #8e228c;}
.badg.badge-pink {border-color: #edc8d9; background-color: #ffeef6; color: #d11e6e;}
.badg.badge-skyblue {border-color: #badee7; background-color: #dcf5fb; color: #027293;}
.badg.badge-red {border-color: #edc8d9; background-color: #ffeef6; color: #d11e6e;}
.badg.badge-hotpink {border-color: #df4e69; background-color: #df4e69; color: #fff;}
.badg.badge-neonpink {border-color: #fa4ea4; background-color: #fa4ea4; color: #fff;}
.badg.badge-magenta {border-color: var(--red); background-color: var(--red); color: var(--white);}
.badg.badge-navy {border-color: #cad8f5; background-color: #f0f5ff; color: #2852a0;}
.badg.badge-brown {border-color: #f5cad7; background-color: #ffecf2; color: #9c2348;}
.badg.badge-black {border-color: var(--grey-333); background-color: var(--grey-333); color: var(--white);}
.badg.badge-sm {height: 17px; line-height: 15px; font-size: 12px; padding: 0 5px;}
.badg.badge-lightgreen {background-color: #f0fff6; border-color: #b4e2c1; color: #0c7f3a;}
.badg.badge-grey {background-color: #eeeeee; border-color: #eeeeee; color: #666666;}
.badg.badge-circle {border-radius: 10.5px; padding: 0 10px; min-width: 50px;}
.badg.badge-yellow {border-color: #f5c95d; background-color: #fdf3d6; color: #a76b00;}
.badg.badge-yellow2 {border-color: #d7d296; background-color: #fffbcb; color: #776e00;}

/*breadcrumb*/
.breadcrumb ul {display: flex; justify-content: flex-end; word-break: keep-all;}
.breadcrumb .item {position: relative;}
.breadcrumb .item a {display: inline-block; vertical-align: middle; font-size: 14px; line-height: 20px; letter-spacing: -0.7px; color: var(--grey-666); text-transform: uppercase;}
.breadcrumb .item + .item {margin-left: 28px;}
.breadcrumb .item + .item::before {content: ''; position: absolute; left: -17px; top: 6px; display: inline-block; width: 5px; height: 9px; background-image: url(../images/common/breadcrumb.png);background-size: cover;}

/*button*/
a, button {text-decoration: none; border: 0; cursor: pointer;}
.btn {position: relative; display: inline-block; min-width: 80px; text-align: center; vertical-align: middle; height: 40px;line-height: 38px; font-size: 16px; font-weight: 500; letter-spacing: -0.75px; color: var(--white); overflow: hidden; border-radius: 3px; border: 1px solid var(--main-1); background-color: var(--main-1); padding: 0 15px; transition: background-color .3s; white-space: nowrap; text-decoration: none !important; cursor: pointer;}
.btn:hover {background-color: #085cb1;}
.btn:disabled { cursor: default !important; color: var(--grey-666) !important; background-color: var(--grey-eee) !important;border: 1px solid var(--grey-ccc) !important;}
.btn.with-icon {display: inline-flex; align-items: center; justify-content: center; gap: 3px; padding: 0 15px;}
.btn.btn-lg {min-width: 150px; padding: 0 30px; height: 54px; line-height: 52px; font-size: 18px;}
.btn.btn-sm {min-width: 60px; height: 28px; line-height: 26px; font-size: 14px; padding: 0 12px;}
.btn.btn-black {background-color: #454545; border-color: #454545;}
.btn.btn-black:hover {background-color: #2f2f2f;}
.btn.btn-red {background-color: var(--red); border-color: var(--red);}
.btn.btn-red:hover {background-color: var(--red);}
.btn.btn-border-point {background-color: var(--white); color: var(--main-2);}
.btn.btn-border-point:hover {background-color: #e8f2ff;}
.btn.btn-light-blue {background-color: #eff1f7; color: var(--main-2); border-color: #eff1f7;}
.btn.btn-border-black {border-color: #454545; background-color: var(--white); color: #454545;}
.btn.btn-border-black:hover {background-color: #ebebeb;}
.btn.btn-block {display: block; width: 100%;}
.button-group {display: flex; gap: 10px; justify-content: center; align-items: center;}
.button-group.button-column-group {flex-direction: column;}
.btn-file {display: flex; align-items: center;}
.btn-file .ico {margin-right: 5px;}
.btn-like {display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; background-color: rgba(0, 0, 0, .3); border-radius: 100%;}
.btn-favorite {display: flex; align-items: center; width: 100%; justify-content: center; gap: 10px;}
.btn-check {display: inline-flex; color: var(--white);}
.btn-check .form-check {padding: 0 10px 0 35px; height: 28px; border-radius: 4px; background-color: var(--main-1);}
.btn-check .form-check input + span {font-size: 14px; font-weight: 500; line-height: 28px; letter-spacing: -0.35px;}
.btn-check .form-check input + span::before {top: 4px; left: 10px; background-color: var(--white); border-color: var(--main-2);}
.btn-check .form-check input + span::after {top: 8px; left: 11px;}
.btn-dropdown-box {position: relative;}
.btn-dropdown-box .btn-dropdown {position: relative; display: inline-block; text-align: center; vertical-align: middle; font-weight: 500; letter-spacing: -0.75px; color: #fff; overflow: hidden; border-radius: 3px; border: 1px solid #0a70d3; background-color: #0a70d3; transition: background-color 0.3s; white-space: nowrap; text-decoration: none !important; cursor: pointer; align-items: center; justify-content: center; gap: 3px; min-width: 150px; padding: 0 30px; height: 48px; line-height: 46px; font-size: 18px;}
.btn-dropdown-box .btn-dropdown::after {content: ''; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 12.5px; height: 7.5px; background-size: cover; transition: .2s; background-image: url(../../images/front/sub/ico-arrow-down-white.png);}
.btn-dropdown-box.open .btn-dropdown::after {transform: rotate(180deg) translateY(calc(-50% + 7.5px));}
.btn-dropdown-box .dropdown-list {display: none; position: absolute; left: 0; top: 100%; width: 100%; z-index: 10; background-color: rgba(65, 72, 90, 0.95); border: 1px solid #252f4a; border-top: 1px dashed #4a5e79; border-radius: 0 0 3px 3px;}
.btn-dropdown-box .dropdown-item a {display: block; width: 100%; height: 45px; line-height: 45px; font-size: 18px; letter-spacing: -0.9px; white-space: nowrap; padding: 0 10px; text-align: center; transition: 0.2s; color: #fff;}
.btn-dropdown-box .dropdown-item + .dropdown-item {border-top: 1px dashed #676d7b;}

/*form*/
.form-group {position: relative;}
.form-group .label {display: block; font-size: 15px; line-height: 18px; font-weight: 500; letter-spacing: -0.75px; margin-bottom: 8px;}
.form-group .label .required {color: var(--red);}
.form-group + .form-group {margin-top: 20px;}
.form-group .txt-limit {display: block; font-size: 13px; text-align: right; color: var(--grey-999); margin-top: 5px;}
.form-group .txt-limit .value {color: var(--grey-999);}
.form-group .tip {font-size: 14px; line-height: 20px; letter-spacing: -0.7px; color: #666;}
.form-group .validation {font-size: 14px; line-height: 20px; letter-spacing: -0.75px; color: var(--main-1);}
.form-group .caution {font-size: 14px; line-height: 20px; letter-spacing: -0.75px; color: var(--red);text-align: left;}
.form-group .btn-hide {position: absolute; width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; right: 15px; top: 50%; transform: translateY(-50%);}
.form-group.pw .form-input {padding: 0 40px 0 15px;}
.form-group .pw {width: 100%;}
.form-group .pw .form-input {width: 100%; padding: 0 40px 0 15px;}
.form-input {width: 100%; height: 40px; line-height: 38px; border: 1px solid var(--grey-ccc); letter-spacing: -.75px; border-radius: 3px; background-color: var(--white); color: var(--black); font-size: 15px; padding: 0 15px; -webkit-appearance: none; background-size: 16px; background-position: right 13px center; background-repeat: no-repeat;}
.form-input::placeholder {color: var(--grey-666);}
.form-input.form-input-sm {height: 28px;line-height: 26px;}
.form-input.form-input-lg {border-radius: 4px; height: 54px; line-height: 52px;}
.form-input:disabled {cursor: default; color: var(--grey-222); background-color: #e2e2e2;}
.form-input::-webkit-calendar-picker-indicator {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: transparent; color: transparent; cursor: pointer;}
textarea.form-input {height: 60px; padding: 10px; line-height: 20px; resize: none;}
.form-select {width: 100%; height: 40px; border: 1px solid var(--grey-ccc); letter-spacing: -.75px; border-radius: 3px; background-color: var(--white); color: var(--black); font-size: 15px; padding: 0 25px 0 15px; -webkit-appearance: none; -moz-appearance: none; text-indent: 1px; background-size: 12px 8px; background-position: right 11px center; background-repeat: no-repeat; background-image: url(../images/common/i-dropdown.svg); cursor: pointer;}
.form-select.form-select-sm {height: 28px; line-height: 26px; border-color: var(--grey-ccc); padding: 0 20px 0 10px; background-size: 7.5px 4.5px; background-image: url(../../images/front/common/ico-select-sm.png);}
.form-select.form-select-lg {height: 54px; line-height: 52px;}
.form-select:disabled {cursor: default; color: var(--grey-222);background-color: #e2e2e2;}
.form-radio {position: relative; display: flex; padding-left: 28px; cursor: pointer;}
.form-radio input {position: absolute; left: -9999px;}
.form-radio input:checked + span::after {content: ''; position: absolute; top: 0; left: 0; width: 20px; height: 20px; background-image: url(../images/common/checked.png); background-size: cover; background-repeat: no-repeat; background-color: transparent; border-radius: 100%; z-index: 1; opacity: 1;}
.form-radio input:disabled + span::before {background-color: var(--grey-eee);}
.form-radio input:disabled + span::after {background-image: url(../../images/front/common/checked-disabled.png);}
.form-radio input + span {font-size: 15px; line-height: 20px; letter-spacing: -.75px;}
.form-radio input + span a {text-decoration: underline;}
.form-radio input + span::before {content: ''; position: absolute; top: 0; left: 0; border: 1px solid var(--grey-ccc); border-radius: 100%; width: 20px; height: 20px; background-repeat: no-repeat; background-size: cover; box-sizing: border-box;}
.form-radio input + span::after {opacity: 0;}
.form-check {position: relative; display: flex; padding-left: 28px; cursor: pointer;}
.form-check input {position: absolute; left: -9999px;}
.form-check input:checked + span::after {background-image: url(../images/common/ico-check.svg);}
.form-check input:disabled + span::before {background-color: var(--grey-eee);}
.form-check input:disabled + span::after {opacity: .5;}
.form-check input + span {font-size: 15px; line-height: 20px; letter-spacing: -.75px;}
.form-check input + span a {text-decoration: underline;}
.form-check input + span::before { content: ''; position: absolute; top: 0; left: 0; border-radius: 2px; border: 1px solid var(--grey-ccc); background-color: var(--white);  width: 20px; height: 20px; background-repeat: no-repeat; background-size: cover; box-sizing: border-box;}
.form-check input + span::after {content: ''; position: absolute; top: 4px; left: 2px; width: 16px; height: 11px; background-repeat: no-repeat; background-size: cover; box-sizing: border-box;}
.form-file {display: flex; align-items: center; gap: 5px;}
.form-file .input-file {position: absolute; width: 0; height: 0; font-size: 0; left: -999999px;}
.form-file .form-input {flex: 1;}
.form-file .form-input::file-selector-button {display: none;}
.form-file.disabled .form-input {background-color: var(--grey-eee); cursor: default; color: var(--grey-ccc);}
.form-file.disabled .btn {background-color: #f9f9f9; color: var(--grey-ccc); border-color: var(--grey-ccc); cursor: default;}
.form-file-list .input-file {position: absolute; width: 0; height: 0; font-size: 0;left: -999999px;}
.form-file-list .file-list {margin-top: 10px; display: flex; flex-wrap: wrap; gap: 5px;}
.form-file-list .file-list.file-list-vertical {width: 100%; flex-direction: column;}
.form-file-list .file-list.file-list-vertical .item {width: 100%;}
.form-file-list .file-list .item {display: inline-flex; align-items: center; word-break: break-word; gap: 5px;}
.form-file-list .file-list .item .ico-file {flex-shrink: 0;}
.form-file-list .file-list .item .file {font-size: 15px; line-height: 17px;}
.form-file-list .file-list .item .name {font-size: 16px; line-height: 17px; letter-spacing: -0.38px;}
.form-file-list .file-list .item .btn-delete {display: flex; align-items: center; justify-content: center; width: 17px; height: 17px;}
.form-file-list .file-row {display: flex; align-items: center;}
.form-file-list .file-row > * + * {margin-left: 10px;}
.form-file-list .file-row + .file-list .item {padding-left: 10px;}
.form-file-list .form-input::file-selector-button {display: none;}
.form-file-list.disabled .form-input {cursor: default; background-color: #e2e2e2; color: var(--grey-222);}
.form-file-list.disabled .btn {cursor: default; color: var(--grey-ccc); border-color: var(--grey-ccc); background-color:#e2e2e2;}
.form-date, .form-time {position: relative; width: 100%;}
.form-date::after, .form-time::after {content: ''; position: absolute; width: 16px; height: 16px; background-size: cover; right: 16px; top: 50%; transform: translateY(-50%);}
.form-date::after {background-image: url(../images/common/i-date.png);}
.form-time::after {background-image: url(../../images/front/common/ico-time.svg);}
.form-search {position: relative;}
.form-search .btn-search {position: absolute; display: flex; align-items: center; justify-content: center; right: 13px; top: 50%; width: 24px; height: 24px; transform: translateY(-50%);}
.form-search .btn-search .ico {width: 16px; height: 16px;}
.form-unit {position: relative; display: flex; flex-wrap: wrap; align-items: stretch; width: 100%;}
.form-unit .form-input {flex: 1 1 auto; width: 1%; min-width: 0; border-radius: 3px 0 0 3px; border-right: 0;}
.form-unit .unit { display: flex; align-items: center; border-right: 1px solid var(--grey-ccc); border-top: 1px solid var(--grey-ccc); border-bottom: 1px solid var(--grey-ccc); border-radius: 0 3px 3px 0; padding: 0 10px; font-size: 15px; line-height: 38px;}
.form-keyword {position: relative; display: flex; flex-wrap: wrap; align-items: stretch; width: 100%;}
.form-keyword .form-select {position: relative; z-index: 2; border-radius: 2px 0 0 2px; border-right: 0; width: auto;}
.form-keyword .form-input {position: relative; flex: 1 1 auto; width: 1%; min-width: 0;}
.form-inline-group {display: flex; flex-wrap: wrap; align-items: center; gap: 20px;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
input[type=number] {-moz-appearance: textfield;}
input::-ms-clear, input::-ms-reveal {display: none; width: 0; height: 0;}
input::-webkit-search-decoration, input::-webkit-search-cancel-button, input::-webkit-search-results-button, input::-webkit-search-results-decoration {display: none;}
.form-switch {cursor: pointer; display: inline-flex;}
.form-switch .switch-checkbox {position: absolute; visibility: hidden;}
.form-switch .switch-checkbox:checked + .switch-toggle {background-color: var(--main-1); border: 1px solid var(--main-1);}
.form-switch .switch-checkbox:checked + .switch-toggle:before {left: 13px; border-color: var(--main-1);}
.form-switch .switch-toggle {display: inline-block; background-color: rgb(255, 255, 255); border: 1px solid var(--grey-ccc); box-shadow: rgb(223, 223, 223) 0 0 0 0 inset; border-radius: 20px; height: 22px;  width: 35px; position: relative; vertical-align: middle; transition: 0.2s;}
.form-switch .switch-toggle:before, .form-switch .switch-toggle:after {content: '';}
.form-switch .switch-toggle:before {display: block; position: absolute; width: 20px; height: 20px; top: 0; left: 1px; background: var(--white); border-radius: 100%; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); transition: left 0.25s;}
.form-switch .switch-label {position: relative; font-size: 15px; letter-spacing: -.75px; top: 2px; margin-left: 5px;}

@media all and (max-width: 1280px) {
    .form-input {padding: 0 10px;}
    .form-select {padding: 0 25px 0 10px;}
}

.form-range-group {display: flex; gap: 10px; align-items: center;}
.form-range-group .form-input.date {background-image: url(../../images/front/common/ico-cal.png); background-size: 16px; background-position: right 13px center; background-repeat: no-repeat; padding: 0 35px 0 13px;}

@media all and (max-width: 576px) {
    .form-range-group {gap: 5px;}
    .form-range-group .form-input.date {background-position: right 10px center; padding: 0 30px 0 10px;}
}

/*pagination*/
.pagination {display: flex; justify-content: center; gap: 8px;}
.pagination .page-item .page-link {display: flex; justify-content: center; align-items: center; min-width: 30px; height: 30px; text-align: center; font-size: 15px; line-height: 30px; letter-spacing: -0.75px; color: var(--grey-666); padding: 0 11px; border: 1px solid transparent; border-radius: 3px; transition: .3s var(--grey-666);}
.pagination .page-item .page-link:hover {border-color: var(--grey-ccc);}
.pagination .page-item .page-link:focus-visible {outline-offset: 2px;}
.pagination .page-item.active .page-link {font-weight: bold; color: var(--white); background-color: #454545; border-color: #454545;}
.pagination .page-item.disabled {opacity: .7;}
.pagination .page-item.disable .page-link {cursor: default; border-color: transparent;}
.pagination .page-item.disable .ico {opacity: .5;}
.pagination .page-item.prev .page-link, .pagination .page-item.first .page-link, .pagination .page-item.last .page-link, .pagination .page-item.next .page-link {width: 30px; padding: 0;}
.pagination .page-item.prev.disabled .page-link:hover, .pagination .page-item.first.disabled .page-link:hover, .pagination .page-item.last.disabled .page-link:hover, .pagination .page-item.next.disabled .page-link:hover {background-color: transparent;}

/*popup*/
.dim {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.3; transition: opacity .2s; z-index: 100; background-color: rgba(0,0,0,.6);}
.popup {position: fixed; width: var(--popup-width); top: 50%; left: 50%; transform: translate(-50%, -50%); display: none; z-index: 105; background-color: var(--white); padding: 20px 30px 30px; border-radius: 5px; box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.1);}
.popup .popup-head {position: relative; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--grey-eee); padding-bottom: 10px;}
.popup .popup-head .title {font-size: 20px; line-height: 24px; font-weight: bold; letter-spacing: -1px; color: var(--grey-000);}
.popup .popup-head .btn-popup-close {display: flex; width: 40px; height: 40px; align-items: center; padding-right: 9px; justify-content: flex-end;}
.popup .popup-body {overflow-y: auto; overflow-x: hidden; max-height: calc(100dvh - 300px); padding: 20px 0;}
.popup .popup-body .content {min-height: 322px; font-size: 15px; line-height: 24px;}
.popup .popup-body .contents-info {margin-bottom: 20px;}
.popup .popup-body .form-group + .form-group {margin-top: 20px;}
.popup .popup-body .form-group .number-group {display: flex; align-items: center;}
.popup .popup-body .form-group .number-group .dash {margin: 0 10px;}
.popup .popup-body .table + .button-group {margin-top: 20px;}
.popup .popup-body .table-container .table {min-width: 600px;}
.popup .popup-body .button-group + .table-container {margin-top: 20px;}
.popup .popup-footer {display: flex; justify-content: center; align-items: center; gap: 10px; margin: 10px 0 0;}
.popup.popup-sm {width: var(--popup-sm-width);}
.popup.popup-lg {width: var(--popup-lg-width);}
.popup.popup-xl {width: var(--popup-xl-width);}
.popup.popup-terms .form-group {margin-bottom: 20px;}
.popup.popup-terms .form-group .form-select {width: 50%;}
.popup.popup-terms .popup-body {padding-top: 20px;}
.popup.popup-terms .popup-content {line-height: normal;}
.popup.popup-terms .popup-content .content {display: none; padding-right: 10px;}
.popup.popup-terms .popup-content .content.active {display: block;}
.popup.popup-terms .popup-content .content + .form-group {margin-top: 100px;}
.popup.popup-terms .popup-content .title {display: flex; align-items: center; font-size: 18px; font-weight: 500; line-height: 20px; letter-spacing: -0.9px;}
.popup.popup-terms .popup-content .title img {display: inline-block; width: 35px; height: auto; margin-right: 5px;}
.popup.popup-terms .popup-content .title + .bullet {margin-top: 13px;}
.popup.popup-terms .popup-content .desc {font-size: 15px; line-height: 24px; letter-spacing: -0.75px; margin-top: 13px; margin-bottom: 10px;}
.popup.popup-terms .popup-content .desc + .title {margin-top: 20px;}
.popup.popup-terms .popup-content .desc:last-child {margin-bottom: 0;}
.popup.popup-terms .popup-content .bullet {position: relative; font-size: 15px; line-height: 24px; letter-spacing: -0.75px; padding-left: 20px; color: var(--grey-666);}
.popup.popup-terms .popup-content .bullet.with-btn {display: flex; align-items: center; line-height: 30px;}
.popup.popup-terms .popup-content .bullet.with-btn::before {top: 14px;}
.popup.popup-terms .popup-content .bullet.with-btn + .bullet {margin-top: 10px;}
.popup.popup-terms .popup-content .bullet + .title {margin-top: 20px;}
.popup.popup-terms .popup-content .bullet::before {content: ''; position: absolute; top: 10px; left: 10px; width: 3px; height: 3px; border-radius: 100%; background-color: var(--grey-666);}
.popup.popup-terms .popup-content .btn-sm {margin-left: 10px;}
.popup.popup-terms .table {margin-bottom: 20px;}
.popup.popup-terms .table.v-middle td {vertical-align: middle;}
.popup.popup-terms .table td {vertical-align: top;}
.popup.popup-terms .table .tit {font-weight: 500;}
.popup.popup-terms .table .img {display: block; text-align: center;}
.popup.popup-terms .table .img img {display: inline-block;}
.popup.popup-terms .table .des {display: block; line-height: 20px; color: #5669C8;}
.popup.popup-terms .table small {display: block; font-size: 12px; color: #5669C8;}
.popup.popup-terms .table.table-type-2 td {border-right: 0;}
.popup.popup-terms .table.table-type-2 td .link {display: flex; align-items: center; text-align: left; font-size: 14px;}
.popup.popup-terms .table.table-type-2 td .link img {width: 35px; height: auto; margin-right: 5px;}
.popup.popup-terms .table.table-type-2 td:last-child {border-right: 1px solid var(--grey-eee);}
.popup.popup-service-pause {width: var(--popup-sm-width); height: auto; padding: 40px 30px 50px;}
.popup.popup-service-pause .popup-head {margin-bottom: 0;}
.popup.popup-service-pause .popup-head .btn-popup-close {position: absolute; top: -22px; right: -9px; width: 20px; height: 20px; padding: 0;}
.popup.popup-form .login-contents {padding-top: 0;}
.popup-service-pause {width: 100%; height: calc(100dvh - 40px); padding: 30px; overflow-y: auto;}
.popup-service-pause .popup-head {display: flex; justify-content: center; border-bottom: 1px solid var(--grey-eee); padding-bottom: 10px; margin-bottom: 20px;}
.popup-service-pause .popup-head .title {font-size: 24px; line-height: 24px; font-weight: bold; letter-spacing: -1.2px; text-align: center;}
.popup-service-pause .popup-body .error-content .txt {font-size: 15px; line-height: 24px; letter-spacing: -0.75px; text-align: center; color: var(--grey-666); margin-bottom: 16px;}
.popup-service-pause .popup-body .error-content .img {width: 47px; margin: 0 auto 18px;}
.popup-service-pause .popup-body .error-content .img img {width: 100%; height: auto; object-fit: cover;}
.popup-service-pause .popup-body .error-content .info {padding: 20px 20px 15px; border-radius: 3px; border: solid 1px #ddd; background-color: #f6f6f6; margin-bottom: 20px; text-align: center;}
.popup-service-pause .popup-body .error-content .info .tit {font-size: 16px; font-weight: bold; line-height: 16px; letter-spacing: -0.8px; text-align: center; color: var(--grey-000);margin-bottom: 10px;}
.popup-service-pause .popup-body .error-content .info .date { font-size: 18px; font-weight: 500; line-height: 24px; letter-spacing: -0.9px; color: var(--main-1);}
.popup-service-pause .popup-body .error-content .txt-bottom {font-size: 15px; line-height: 15px; letter-spacing: -0.75px; text-align: center; color: var(--grey-666);}
.popup-service-pause .popup-body .error-content .img-box {text-align: center;}
.popup-service-pause .popup-body .error-content .img-box img {display: inline-block; margin: 0 auto; max-width: 100%; height: auto;}
.popup-service-pause .popup-foot {position: fixed; bottom: 0; width: 100%; left: 0;}
.popup-service-pause .error-content-bottom {display: flex; align-items: center; justify-content: space-between; width: 100%; background-color: #333; padding: 10px 20px; color: var(--white);}
.popup-service-pause .error-content-bottom .form-check input + span::before {background-color: var(--white); border-radius: 3px;}
.popup-service-pause .error-content-bottom .btn-close {display: flex; align-items: center; color: var(--grey-eee); font-size: 13px; letter-spacing: -0.65px; text-align: right; gap: 5px;}
.popup-service-pause .error-info {padding: 30px; border-radius: 3px; border: solid 1px #e4e8ee; background-color: #fff; min-height: 280px;}
.popup-service-pause .error-info .text {font-size: 15px; line-height: 24px; letter-spacing: -0.75px; color: var(--grey-666);}
.popup-service-pause.popup-service-info {background-color: #f4f7fc;}
.popup-service-pause.popup-service-info .popup-head {border-bottom: 0; padding-bottom: 0;}
/*추가 (1/21)*/
.noti-pop.popup {top: 400px;}
.noti-pop.popup .popup-head .title {width: 100%; text-align: center;}
@media all and (max-width: 960px) {
    .noti-pop.popup {top: 50%;}
}

@media all and (max-width: 1280px) {
    .popup.popup-lg { width: calc(100% - 40px);}
    .popup.popup-xl {width: calc(100% - 40px);}
    .popup.popup-terms .form-group .form-select {width: 100%;}
}
@media all and (max-width: 960) {
    .noti-pop.popup {top: 50%;}
}

@media all and (max-width: 768px) {
    .popup {width: calc(100% - 40px);}
}

@media all and (max-width: 540px) {
    .popup {padding: 20px 20px 30px;}
    .popup.popup-sm {width: calc(100% - 40px);}
    .popup.popup-motp .popup-text br {display: none;}
}

/*table*/
caption {position: absolute; overflow: hidden; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; clip: rect(0, 0, 0, 0);}
table {width: 100%; table-layout: fixed; border-collapse: collapse;}
.table-head {display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;}
.table-head .title {position: relative; font-size: 18px; line-height: 24px; font-weight: bold; padding-left: 9px;}
.table-head .title::before {content: ''; position: absolute; top: 10px; left: 0; width: 4px; height: 4px; border-radius: 100%; background-color: var(--grey-333);}
.table-head .desc {width: 100%; margin-bottom: 30px; font-size: 16px; line-height: 20px; margin-top: 20px;}
.table-head .tip {font-size: 14px; letter-spacing: -0.35px; text-align: right; color: var(--grey-666);}
.table-head .btn-wrap {margin-left: auto;}
.table-caption {font-size: 16px; line-height: 20px; margin-bottom: 10px; font-weight: bold; padding-left: 10px;}
.table-caption::before {content: '- ';}
.table-foot {display: flex; justify-content: flex-end; margin-top: 10px; gap: 10px;}
.table {position: relative; width: 100%; border-top: 1px solid #6f6f6f; color: var(--grey-333);}
.table .btn-table-desc {margin-left: 5px;}
.table tr.highlight td, .table tr.highlight th {background-color: #fffcf4;}
.table tr.with-btn-row td .button-group {flex-direction: column; gap: 2px;}
.table td, .table th {text-align: center; vertical-align: middle; line-height: 22px; padding: 12px 20px; letter-spacing: -1px;}
.table th {font-size: 16px; font-weight: bold; background-color: #f6f6f6; border-bottom: 1px solid var(--grey-ddd); white-space: nowrap;}
.table.table-blue {border-top: 2px solid #1157cb;}
.table.table-blue th, .table.table-blue td {border-right: 1px solid var(--grey-ddd);}
.table.table-blue th:last-child, .table.table-blue td:last-child {border-right: 0;}
.table.table-blue th {background-color: #e8f2ff;}
.table td {border-bottom: 1px solid var(--grey-ddd); font-size: 15px;}
.table td .btn-file {display: flex; align-items: center; height: 28px;}
.table a:hover {text-decoration: underline;}
.table .ellipse {white-space: nowrap;}
.table .ellipse-target {max-width: 100%; display: inline-block; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.table .ellipse-target + .ico {vertical-align: middle; margin-left: 4px;}
.table.v-table {border-top: 1px solid #6f6f6f;}
.table.v-table th, .table.v-table td {border-top: 1px solid  var(--grey-eee); border-right: 0;}
.table.v-table th:first-chil, .table.v-table td:first-child {border-left: 0;}
.table.v-table th:last-child, .table.v-table td:last-child {border-right: 0;}
.table.v-table th {background-color: #f6f6f6; font-size: 15px; color: var(--grey-666); font-weight: 400;}
.table.v-table tr:first-child th, .table.v-table tr:first-child td {border-top: 0;}
.table.v-table.v-table-input {border-top-color: var(--grey-333);}
.table.v-table.v-table-input .form-control, .table.v-table.v-table-input .form-select {width: 100%;}
.table.v-table.v-table-input th, .table.v-table.v-table-input td {padding: 9.5px 20px;}
.table.v-table.v-table-input th:first-child, .table.v-table.v-table-input td:first-child {border-left: 0;}
.table.v-table.v-table-input th:last-child, .table.v-table.v-table-input td:last-child {border-right: 0;}
.table.v-table.v-table-input th .txt:only-child, .table.v-table.v-table-input td .txt:only-child {line-height: 40px;}
.table.v-table.v-table-input .form-file {margin-bottom: 20px;}
.table.v-table.v-table-input .file-list {margin-bottom: 20px;}
.table.v-table.v-table-input .file-list:only-child {margin-bottom: 0;}
.table.v-table.v-border-table th, .table.v-table.v-border-table td {border-right: 1px solid  var(--grey-eee);}
.table.v-table.v-border-table th:first-child, .table.v-table.v-border-table td:first-child {border-left: 1px solid  var(--grey-eee);}
.table.v-table.v-border-table th:last-child, .table.v-table.v-border-table td:last-child {border-right: 1px solid  var(--grey-eee);}
.table + .table-head {margin-top: 40px;}
.table .caution {font-size: 15px; line-height: 18px; letter-spacing: -0.75px; text-align: left; color: #dd175d; padding-left: 22px; background-size: 16px 17px; background-position: left top; background-repeat: no-repeat; background-image: url(../../images/front/common/ico-caution.svg); margin-top: 5px;}
.table .btn-tip {width: 16px; height: 16px; display: inline-block; vertical-align: text-top;}
.table .program .txt {color: #000; text-decoration: underline; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis;}
.table.table-border-grey td, .table.table-border-grey th {border-right: 1px solid var(--grey-ddd);}
.table.table-border-grey td:last-child, .table.table-border-grey th:last-child {border-right: 0;}
.table .empty {padding: 20px 0 !important; color: var(--grey-666); text-align: center; font-size: 15px;}
.table .empty > span {display: block; padding: 130px 0; background-color: #f6f6f6; text-align: center;}
.table.table-hover tbody tr:hover td {background-color: #f4f7fc !important;}
.table .mo-empty {display: none;}

@media all and (max-width: 1050px) {
    .table td, .table th {padding: 12px 12px; line-height: unset;}
    .table.v-table td, .table.v-table th {padding: 11px 9px;}
    .table.v-table.v-table-input {border-top: 0; border-bottom: 0;}
    .table.v-table.v-table-input table {display: block;}
    .table.v-table.v-table-input table thead, .table.v-table.v-table-input table tbody, .table.v-table.v-table-input table tr, .table.v-table.v-table-input table td, .table.v-table.v-table-input table th {display: block; padding: 0; border: 0;}
    .table.v-table.v-table-input table thead > span, .table.v-table.v-table-input table tbody > span, .table.v-table.v-table-input table tr > span, .table.v-table.v-table-input table td > span, .table.v-table.v-table-input table th > span {line-height: initial;}
    .table.v-table.v-table-input table tr + tr {margin-top: 20px;}
    .table.v-table.v-table-input table .col-title {background-color: transparent; text-align: left; margin-bottom: 2px;}
}

.table-container {overflow-x: auto;}
.table-container .table {min-width: 1200px;}

@media all and (max-width: 1280px) {
    .table .mo-empty {display: table-row;}
    .table .pc-empty {display: none;}
}

@media all and (max-width: 576px) {
    .table-head .title {font-size: 17px;}
}

/*tabs*/
.tab-container .tabs-box {margin-bottom: 20px;}
.tab-container .tabs-box .tabs {display: flex; gap: 6px;}
.tab-container .tabs-box .tabs .item {position: relative; flex: 1; height: 53px; background-color: var(--white); transition: .3s;}
.tab-container .tabs-box .tabs .item::before {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: #c4cfd7;}
.tab-container .tabs-box .tabs .item::after {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background-color: var(--main-1); transition: .3s; opacity: 0;}
.tab-container .tabs-box .tabs .item.on a, .tab-container .tabs-box .tabs .item:hover a {font-weight: bold; color: var(--main-1);}
.tab-container .tabs-box .tabs .item.on::before, .tab-container .tabs-box .tabs .item:hover::before {content: none;}
.tab-container .tabs-box .tabs .item.on::after, .tab-container .tabs-box .tabs .item:hover::after {opacity: 1;}
.tab-container .tabs-box .tabs .item a {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 18px; font-weight: 500; letter-spacing: -0.45px; color: var(--grey-666); padding: 0 10px; text-align: center; transition: .3s;}
.tab-container .tabs-box .tabs .item.disabled {display: none;}
.tab-container .tabs-box .balloon-tabs {display: flex; flex-wrap: wrap; gap: 6px;}
.tab-container .tabs-box .balloon-tabs .item a {position: relative; display: inline-block; height: 48px; line-height: 48px; min-width: 80px; padding: 0 19px; border-radius: 8px; background-color: #6f7074; font-size: 18px; font-weight: 500; letter-spacing: -0.9px; text-align: center; color: var(--white);}
.tab-container .tabs-box .balloon-tabs .item.on a {font-weight: bold; background-color: var(--main-1);}
.tab-container .tabs-box .balloon-tabs .item.on a::after {content: ''; position: absolute; width: 10px; height: 5px; left: 50%; bottom: -5px; background-image: url(../../images/front/common/ico-tab-tip@2x.png); background-size: cover;}
.tab-container .tabs-box .balloon-tabs.balloon-tabs-point {gap: 10px;}
.tab-container .tabs-box .balloon-tabs.balloon-tabs-point .item a {height: 30px; line-height: 30px; min-width: auto; padding: 0 11px; border-radius: 5px;}
.tab-container .tabs-box .balloon-tabs.balloon-tabs-point .item.on a {background-color: var(--main-1);}
.tab-container .tabs-box .balloon-tabs.balloon-tabs-point .item.on a::after {left: 50%; transform: translateX(-50%); background-image: url(../../images/front/common/ico-balloon-tab-tip@2x.png);}
.tab-container .tabs-box .pills-tabs {display: flex; flex-wrap: wrap; gap: 28px;}
.tab-container .tabs-box .pills-tabs .item {position: relative;}
.tab-container .tabs-box .pills-tabs .item a {display: flex; height: 46px; line-height: 46px; padding: 0 23px; border-radius: 23px; background-color: #e6e9ec; font-size: 18px; font-weight: 500; text-align: center; color: var(--grey-666);}
.tab-container .tabs-box .pills-tabs .item + .item::before {content: ''; position: absolute; width: 4px; height: 4px; border-radius: 100%; background-color: #e6e9ec; left: -15px; top: 50%; transform: translateY(-50%);}
.tab-container .tabs-box .pills-tabs .item.on a {color: var(--white); background-color: var(--main-1);}
.tab-container .tab-content .tab-panel {display: none;}
.tab-container .tab-content .tab-panel.on {display: block;}
.tab-container .tab-inner-content .tab-inner-panel {display: none;}
.tab-container .tab-inner-content .tab-inner-panel.on {display: block;}

@media all and (max-width: 576px) {
    .tab-container .tabs-box .tabs {flex-direction: column; gap: 0;}
    .tab-container .tabs-box .tabs .item {border-left: 1px solid #c4cfd7; border-right: 1px solid #c4cfd7; border-bottom: 1px solid #c4cfd7;}
    .tab-container .tabs-box .tabs .item a {height: 50px; padding: 0 10px; line-height: 50px; color: var(--grey-666); font-weight: 500;}
    .tab-container .tabs-box .tabs .item:first-child {border-top: 1px solid #c4cfd7; border-radius: 5px 5px 0 0;}
    .tab-container .tabs-box .tabs .item:last-child {border-top: 0; border-radius: 0 0 5px 5px;}
    .tab-container .tabs-box .tabs .item::before {content: none;}
    .tab-container .tabs-box .tabs .item:hover a {color: var(--grey-666); font-weight: 500;}
    .tab-container .tabs-box .tabs .item:hover::after {content: none;}
    .tab-container .tabs-box .tabs .item + .item.on::before {content: ''; position: absolute; top: -1px; left: 0; width: 100%; height: 1px; background-color: var(--main-1); z-index: 1;}
    .tab-container .tabs-box .tabs .item::after {content: none;}
    .tab-container .tabs-box .tabs .item.on {border-color: var(--main-1);}
    .tab-container .tabs-box .tabs .item.on a {background-color: var(--main-1); color: var(--white);}
    .tab-container .tabs-box .tabs .item.on::after {content: none;}
}

/*tooltip*/
.tooltip {background: #fffbe5; padding: 10px; border: 1px solid #dcca99; font-size: 13px; border-radius: 4px; display: none; line-height: 16px; letter-spacing: -0.65px; text-align: left; color: #934c00;}
.tooltip[data-show] {display: block;}
.arrow, .arrow::before {position: absolute; width: 7px; height: 4px; background-image: url(../images/common/tool-tip.png); background-size: cover;}
.arrow {visibility: hidden;}
.arrow::before {visibility: visible; content: ''; transform: rotate(0);}
.tooltip[data-popper-placement^='top'] > .arrow {bottom: -4px;}
.tooltip[data-popper-placement^='top'] > .arrow::before {transform: rotate(180deg);}
.tooltip[data-popper-placement^='bottom'] > .arrow {top: -4px;}
.tooltip[data-popper-placement^='bottom'] > .arrow::before {transform: rotate(0);}
.tooltip[data-popper-placement^='left'] > .arrow {right: -4px;}
.tooltip[data-popper-placement^='left'] > .arrow::before {transform: rotate(90deg);}
.tooltip[data-popper-placement^='right'] > .arrow {left: -4px;}
.tooltip[data-popper-placement^='right'] > .arrow::before {transform: rotate(270deg);}

/*icon*/
.ico {display: inline-block; background-size: cover; background-repeat: no-repeat;}
.ico-tip {width: 16px; height: 16px; background-image: url(../images/common/i-tip.png);}
.ico-remote {width: 16px; height: 16px; background-image: url(../images/common/i_remote.png); background-size: 16px;}
.ico-link {width: 18px; height: 18px; background-image: url(../images/common/i-link.png); background-size: 18px;}
.ico-more {width: 20px; height: 20px; background-image: url(../images/common/i-more.png);}
/*수정 (1/13)*/
.ico-stop {width: 14px; height: 14px; background-image: url(../images/common/i-stop.png);}
.ico-stop2 {width: 14px; height: 14px; background-image: url(../images/common/i-stop2.png);}
.ico-play {width: 14px; height: 14px; background-image: url(../images/common/i-play.png);}

.ico-step-1 {width: 20px; height: 20px; background-image: url(../images/common/i-steap-1.png);}
.ico-step-2 {width: 20px; height: 20px; background-image: url(../images/common/i-steap-2.png);}
.ico-step-3 {width: 20px; height: 20px; background-image: url(../images/common/i-steap-3.png);}
.active .ico-step-1 {background-image: url(../images/common/i-steap-1-on.png);}
.active .ico-step-2 {background-image: url(../images/common/i-steap-2-on.png);}
.active .ico-step-3 {background-image: url(../images/common/i-steap-3-on.png);}
.ico-visibility { width: 16px; height: 11px; background-image: url(../images/common/i-eye-on.svg);}
.off .ico-visibility { width: 16px; height: 14px; background-image: url(../images/common/i-eye-off.svg);}
.ico-popup-close {width: 17px; height: 17px; background-image: url(../images/common/i-close.png);}
.ico-search {width: 16px; height: 16px; background-image: url(../images/common/i-search.png);}
.ico-paging-first {width: 11px; height: 11px; background-image: url(../images/common/i-paging-first.png);}
.ico-paging-prev {width: 6px; height: 11px; background-image: url(../images/common/i-paging-prev.png);}
.ico-paging-last {width: 11px; height: 11px; background-image: url(../images/common/i-paging-last.png);}
.ico-paging-next {width: 6px; height: 11px; background-image: url(../images/common/i-paging-next.png);}
.ico-arrow-right {width: 6px; height: 10px; background-image: url(../images/common/i-arrow-right.png);}
.ico-check-bg {width: 16px; height: 16px; background-image: url(../images/common/i-check-bg.svg);}