@charset "utf-8";

/*
UI {DOSIRAK}
Ver : 3.0
Update : 2023.09.01
© openit Inc
*/

@import url('icon/icon.css');

/*//////////////////////////////// Reset ////////////////////////////////*/

html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
figure {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-family: 'Helvetica', 'Arial', sans-serif;
    letter-spacing: -0px;
    line-height: normal;
}
body {
    position: relative;
    -webkit-text-size-adjust: none;
    word-wrap: break-word;
    word-break: break-all;
}
a {
    text-decoration: none;
}
ul,
ol,
li {
    list-style-type: none;
}
input,
button {
    border: 0;
    outline: none;
}
button {
    padding: 0;
    cursor: pointer;
    outline: none;
}
legend {
    visibility: hidden;
    position: absolute;
    width: 0;
    height: 0;
    font-size: 0;
}
caption {
    visibility: hidden;
    overflow: hidden;
    width: 0;
    height: 0;
    font-size: 0;
    line-height: 0;
}
textarea {
    resize: none;
}
img {
    vertical-align: top;
    border: 0;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
em,
address {
    font-style: normal;
}
img {
    -ms-interpolation-mode: bicubic !important;
}
fieldset,
img,
input {
    border: 0;
    vertical-align: middle;
}
* {
    box-sizing: border-box;
}
input:focus {
    outline: none;
} /* outline 테두리 없애기 */
select:focus {
    outline: none;
} /* outline 테두리 없애기 */

/*//////////////////////////////// Typography  ////////////////////////////////*/

/* Font Title */
h1 {
    font-size: 38px;
}
h2 {
    font-size: 30px;
}
h3 {
    font-size: 24px;
}
h4 {
    font-size: 20px;
}
h5 {
    font-size: 16px;
}

.text-underline {
    text-decoration: underline;
}
.text-overline {
    text-decoration: overline;
}
.text-through {
    text-decoration: line-through;
}

/* Font Size */
.fs-100 {
    font-size: 100px !important;
}
.fs-95 {
    font-size: 95px !important;
}
.fs-90 {
    font-size: 90px !important;
}
.fs-85 {
    font-size: 85px !important;
}
.fs-80 {
    font-size: 80px !important;
}
.fs-75 {
    font-size: 75px !important;
}
.fs-70 {
    font-size: 70px !important;
}
.fs-65 {
    font-size: 65px !important;
}
.fs-60 {
    font-size: 60px !important;
}
.fs-55 {
    font-size: 55px !important;
}
.fs-50 {
    font-size: 50px !important;
}
.fs-45 {
    font-size: 45px !important;
}
.fs-40 {
    font-size: 40px !important;
}
.fs-39 {
    font-size: 39px !important;
}
.fs-38 {
    font-size: 38px !important;
}
.fs-37 {
    font-size: 37px !important;
}
.fs-36 {
    font-size: 36px !important;
}
.fs-35 {
    font-size: 35px !important;
}
.fs-34 {
    font-size: 34px !important;
}
.fs-33 {
    font-size: 33px !important;
}
.fs-32 {
    font-size: 32px !important;
}
.fs-31 {
    font-size: 31px !important;
}
.fs-30 {
    font-size: 30px !important;
}
.fs-29 {
    font-size: 29px !important;
}
.fs-28 {
    font-size: 28px !important;
}
.fs-27 {
    font-size: 27px !important;
}
.fs-26 {
    font-size: 26px !important;
}
.fs-25 {
    font-size: 25px !important;
}
.fs-24 {
    font-size: 24px !important;
}
.fs-23 {
    font-size: 23px !important;
}
.fs-22 {
    font-size: 22px !important;
}
.fs-21 {
    font-size: 21px !important;
}
.fs-20 {
    font-size: 20px !important;
}
.fs-19 {
    font-size: 19px !important;
}
.fs-18 {
    font-size: 18px !important;
}
.fs-17 {
    font-size: 17px !important;
}
.fs-16 {
    font-size: 16px !important;
}
.fs-15 {
    font-size: 15px !important;
}
.fs-14 {
    font-size: 14px !important;
}
.fs-13 {
    font-size: 13px !important;
}
.fs-12 {
    font-size: 12px !important;
}
.fs-11 {
    font-size: 11px !important;
}

/* Font weight */
.fw-l {
    font-weight: 100 !important;
}
.fw-r {
    font-weight: 400 !important;
}
.fw-b {
    font-weight: 600 !important;
}
.fw-e {
    font-weight: 900 !important;
}

/* Line height */
.lh-100 {
    line-height: 100px !important;
}
.lh-95 {
    line-height: 95px !important;
}
.lh-90 {
    line-height: 90px !important;
}
.lh-85 {
    line-height: 85px !important;
}
.lh-80 {
    line-height: 80px !important;
}
.lh-75 {
    line-height: 75px !important;
}
.lh-70 {
    line-height: 70px !important;
}
.lh-65 {
    line-height: 65px !important;
}
.lh-60 {
    line-height: 60px !important;
}
.lh-55 {
    line-height: 55px !important;
}
.lh-50 {
    line-height: 50px !important;
}
.lh-45 {
    line-height: 45px !important;
}
.lh-40 {
    line-height: 40px !important;
}
.lh-39 {
    line-height: 39px !important;
}
.lh-38 {
    line-height: 38px !important;
}
.lh-37 {
    line-height: 37px !important;
}
.lh-36 {
    line-height: 36px !important;
}
.lh-35 {
    line-height: 35px !important;
}
.lh-34 {
    line-height: 34px !important;
}
.lh-33 {
    line-height: 33px !important;
}
.lh-32 {
    line-height: 32px !important;
}
.lh-31 {
    line-height: 31px !important;
}
.lh-30 {
    line-height: 30px !important;
}
.lh-29 {
    line-height: 29px !important;
}
.lh-28 {
    line-height: 28px !important;
}
.lh-27 {
    line-height: 27px !important;
}
.lh-26 {
    line-height: 26px !important;
}
.lh-25 {
    line-height: 25px !important;
}
.lh-24 {
    line-height: 24px !important;
}
.lh-23 {
    line-height: 23px !important;
}
.lh-22 {
    line-height: 22px !important;
}
.lh-21 {
    line-height: 21px !important;
}
.lh-20 {
    line-height: 20px !important;
}
.lh-19 {
    line-height: 19px !important;
}
.lh-18 {
    line-height: 18px !important;
}
.lh-17 {
    line-height: 17px !important;
}
.lh-16 {
    line-height: 16px !important;
}
.lh-15 {
    line-height: 15px !important;
}
.lh-14 {
    line-height: 14px !important;
}
.lh-13 {
    line-height: 13px !important;
}
.lh-12 {
    line-height: 12px !important;
}
.lh-11 {
    line-height: 11px !important;
}

/*//////////////////////////////// COLOR ////////////////////////////////*/

/* BG COLOR */
.bg-none {
    background-color: none !important;
}
.bg-f4f4f4 {
    background-color: #f4f4f4 !important;
}
.bg-f5f5f5 {
    background-color: #f5f5f5 !important;
}
.bg-ccc {
    background-color: #ccc !important;
}
.bg-eee {
    background-color: #eee !important;
}
.bg-999 {
    background-color: #999999 !important;
}
.bg-666 {
    background-color: #666666 !important;
}
.bg-4a4a4a {
    background-color: #4a4a4a !important;
}
.bg-333 {
    background-color: #333 !important;
}

.bg-black {
    background-color: #000000 !important;
}
.bg-white {
    background-color: #ffffff !important;
}
.bg-red {
    background-color: #e02020 !important;
}
.bg-orange {
    background-color: #fa6400 !important;
}
.bg-yellow {
    background-color: #ffed00 !important;
}
.bg-green {
    background-color: #6dd400 !important;
}
.bg-sky {
    background-color: #0091ff !important;
}
.bg-blue {
    background-color: #1f266e !important;
}
.bg-purple {
    background-color: #6236ff !important;
}

/* Font COLOR */
.font-white {
    color: #ffffff !important;
}
.font-f4f4f4 {
    color: #f4f4f4 !important;
}
.font-eee {
    color: #eee !important;
}
.font-ccc {
    color: #ccc !important;
}
.font-999 {
    color: #999999 !important;
}
.font-666 {
    color: #666666 !important;
}
.font-4a4a4a {
    color: #4a4a4a !important;
}
.font-333 {
    color: #333 !important;
}
.font-black {
    color: #000000 !important;
}
.font-red {
    color: #e02020 !important;
}
.font-orange {
    color: #fa6400 !important;
}
.font-yellow {
    color: #ffed00 !important;
}
.font-green {
    color: #6dd400 !important;
}
.font-sky {
    color: #0091ff !important;
}
.font-blue {
    color: #1f266e !important;
}
.font-purple {
    color: #6236ff !important;
}

/* opacity */
.opc-0 {
    opacity: 0;
}
.opc-01 {
    opacity: 0.1;
}
.opc-02 {
    opacity: 0.2;
}
.opc-03 {
    opacity: 0.3;
}
.opc-04 {
    opacity: 0.4;
}
.opc-05 {
    opacity: 0.5;
}
.opc-06 {
    opacity: 0.6;
}
.opc-07 {
    opacity: 0.7;
}
.opc-08 {
    opacity: 0.8;
}
.opc-09 {
    opacity: 0.9;
}
.opc-1 {
    opacity: 1;
}

/* Boarder */
/* Border type */
.b-solid {
    border: solid !important;
}
.b-dotted {
    border: dotted !important;
}
.b-dashed {
    border: dashed !important;
}
.b-double {
    border: double !important;
}

.b-t-solid {
    border-top: solid !important;
}
.b-t-dotted {
    border-top: dotted !important;
}
.b-t-dashed {
    border-top: dashed !important;
}
.b-t-double {
    border-top: double !important;
}

.b-l-solid {
    border-left: solid !important;
}
.b-l-dotted {
    border-left: dotted !important;
}
.b-l-dashed {
    border-left: dashed !important;
}
.b-l-double {
    border-left: double !important;
}

.b-r-solid {
    border-right: solid !important;
}
.b-r-dotted {
    border-right: dotted !important;
}
.b-r-dashed {
    border-right: dashed !important;
}
.b-r-double {
    border-right: double !important;
}

.b-b-solid {
    border-bottom: solid !important;
}
.b-b-dotted {
    border-bottom: dotted !important;
}
.b-b-dashed {
    border-bottom: dashed !important;
}
.b-b-double {
    border-bottom: double !important;
}

/* Border width */
.bw-0 {
    border-width: 0px !important;
}
.bw-1 {
    border-width: 1px !important;
}
.bw-2 {
    border-width: 2px !important;
}
.bw-3 {
    border-width: 3px !important;
}
.bw-4 {
    border-width: 4px !important;
}
.bw-5 {
    border-width: 5px !important;
}

/* Border COLOR */
.bc-white {
    border-color: #ffffff !important;
}
.bc-f4f4f4 {
    border-color: #f4f4f4 !important;
}
.bc-eee {
    border-color: #eee !important;
}
.bc-ccc {
    border-color: #ccc !important;
}
.bc-999 {
    border-color: #999999 !important;
}
.bc-666 {
    border-color: #666666 !important;
}
.bc-4a4a4a {
    border-color: #4a4a4a !important;
}
.bc-333 {
    border-color: #333 !important;
}
.bc-black {
    border-color: #000000 !important;
}
.bc-red {
    border-color: #e02020 !important;
}
.bc-orange {
    border-color: #fa6400 !important;
}
.bc-yellow {
    border-color: #ffed00 !important;
}
.bc-green {
    border-color: #6dd400 !important;
}
.bc-sky {
    border-color: #0091ff !important;
}
.bc-blue {
    border-color: #1f266e !important;
}
.bc-purple {
    border-color: #6236ff !important;
}

/* border radius */
.br-0 {
    border-radius: 0 !important;
}
.br-1 {
    border-radius: 1px !important;
}
.br-2 {
    border-radius: 2px !important;
}
.br-3 {
    border-radius: 3px !important;
}
.br-4 {
    border-radius: 4px !important;
}
.br-5 {
    border-radius: 5px !important;
}
.br-6 {
    border-radius: 6px !important;
}
.br-7 {
    border-radius: 7px !important;
}
.br-8 {
    border-radius: 8px !important;
}
.br-9 {
    border-radius: 9px !important;
}
.br-10 {
    border-radius: 10px !important;
}
.br-11 {
    border-radius: 11px !important;
}
.br-12 {
    border-radius: 12px !important;
}
.br-13 {
    border-radius: 13px !important;
}
.br-14 {
    border-radius: 14px !important;
}
.br-15 {
    border-radius: 15px !important;
}
.br-16 {
    border-radius: 16px !important;
}
.br-17 {
    border-radius: 17px !important;
}
.br-18 {
    border-radius: 18px !important;
}
.br-19 {
    border-radius: 19px !important;
}
.br-20 {
    border-radius: 20px !important;
}
.br-50 {
    border-radius: 50% !important;
}
.br-100 {
    border-radius: 100% !important;
}

.br-tl-0 {
    border-top-left-radius: 0 !important;
}
.br-tl-1 {
    border-top-left-radius: 1px !important;
}
.br-tl-2 {
    border-top-left-radius: 2px !important;
}
.br-tl-3 {
    border-top-left-radius: 3px !important;
}
.br-tl-4 {
    border-top-left-radius: 4px !important;
}
.br-tl-5 {
    border-top-left-radius: 5px !important;
}
.br-tl-6 {
    border-top-left-radius: 6px !important;
}
.br-tl-7 {
    border-top-left-radius: 7px !important;
}
.br-tl-8 {
    border-top-left-radius: 8px !important;
}
.br-tl-9 {
    border-top-left-radius: 9px !important;
}
.br-tl-10 {
    border-top-left-radius: 10px !important;
}
.br-tl-11 {
    border-top-left-radius: 11px !important;
}
.br-tl-12 {
    border-top-left-radius: 12px !important;
}
.br-tl-13 {
    border-top-left-radius: 13px !important;
}
.br-tl-14 {
    border-top-left-radius: 14px !important;
}
.br-tl-15 {
    border-top-left-radius: 15px !important;
}
.br-tl-16 {
    border-top-left-radius: 16px !important;
}
.br-tl-17 {
    border-top-left-radius: 17px !important;
}
.br-tl-18 {
    border-top-left-radius: 18px !important;
}
.br-tl-19 {
    border-top-left-radius: 19px !important;
}
.br-tl-20 {
    border-top-left-radius: 20px !important;
}
.br-tl-50 {
    border-top-left-radius: 50% !important;
}
.br-tl-100 {
    border-top-left-radius: 100% !important;
}

.br-tr-0 {
    border-top-right-radius: 0 !important;
}
.br-tr-1 {
    border-top-right-radius: 1px !important;
}
.br-tr-2 {
    border-top-right-radius: 2px !important;
}
.br-tr-3 {
    border-top-right-radius: 3px !important;
}
.br-tr-4 {
    border-top-right-radius: 4px !important;
}
.br-tr-5 {
    border-top-right-radius: 5px !important;
}
.br-tr-6 {
    border-top-right-radius: 6px !important;
}
.br-tr-7 {
    border-top-right-radius: 7px !important;
}
.br-tr-8 {
    border-top-right-radius: 8px !important;
}
.br-tr-9 {
    border-top-right-radius: 9px !important;
}
.br-tr-10 {
    border-top-right-radius: 10px !important;
}
.br-tr-11 {
    border-top-right-radius: 11px !important;
}
.br-tr-12 {
    border-top-right-radius: 12px !important;
}
.br-tr-13 {
    border-top-right-radius: 13px !important;
}
.br-tr-14 {
    border-top-right-radius: 14px !important;
}
.br-tr-15 {
    border-top-right-radius: 15px !important;
}
.br-tr-16 {
    border-top-right-radius: 16px !important;
}
.br-tr-17 {
    border-top-right-radius: 17px !important;
}
.br-tr-18 {
    border-top-right-radius: 18px !important;
}
.br-tr-19 {
    border-top-right-radius: 19px !important;
}
.br-tr-20 {
    border-top-right-radius: 20px !important;
}
.br-tr-50 {
    border-top-right-radius: 50% !important;
}
.br-tr-100 {
    border-top-right-radius: 100% !important;
}

.br-bl-0 {
    border-bottom-left-radius: 0 !important;
}
.br-bl-1 {
    border-bottom-left-radius: 1px !important;
}
.br-bl-2 {
    border-bottom-left-radius: 2px !important;
}
.br-bl-3 {
    border-bottom-left-radius: 3px !important;
}
.br-bl-4 {
    border-bottom-left-radius: 4px !important;
}
.br-bl-5 {
    border-bottom-left-radius: 5px !important;
}
.br-bl-6 {
    border-bottom-left-radius: 6px !important;
}
.br-bl-7 {
    border-bottom-left-radius: 7px !important;
}
.br-bl-8 {
    border-bottom-left-radius: 8px !important;
}
.br-bl-9 {
    border-bottom-left-radius: 9px !important;
}
.br-bl-10 {
    border-bottom-left-radius: 10px !important;
}
.br-bl-11 {
    border-bottom-left-radius: 11px !important;
}
.br-bl-12 {
    border-bottom-left-radius: 12px !important;
}
.br-bl-13 {
    border-bottom-left-radius: 13px !important;
}
.br-bl-14 {
    border-bottom-left-radius: 14px !important;
}
.br-bl-15 {
    border-bottom-left-radius: 15px !important;
}
.br-bl-16 {
    border-bottom-left-radius: 16px !important;
}
.br-bl-17 {
    border-bottom-left-radius: 17px !important;
}
.br-bl-18 {
    border-bottom-left-radius: 18px !important;
}
.br-bl-19 {
    border-bottom-left-radius: 19px !important;
}
.br-bl-20 {
    border-bottom-left-radius: 20px !important;
}
.br-bl-50 {
    border-bottom-left-radius: 50% !important;
}
.br-bl-100 {
    border-bottom-left-radius: 100% !important;
}

.br-br-0 {
    border-bottom-right-radius: 0 !important;
}
.br-br-1 {
    border-bottom-right-radius: 1px !important;
}
.br-br-2 {
    border-bottom-right-radius: 2px !important;
}
.br-br-3 {
    border-bottom-right-radius: 3px !important;
}
.br-br-4 {
    border-bottom-right-radius: 4px !important;
}
.br-br-5 {
    border-bottom-right-radius: 5px !important;
}
.br-br-6 {
    border-bottom-right-radius: 6px !important;
}
.br-br-7 {
    border-bottom-right-radius: 7px !important;
}
.br-br-8 {
    border-bottom-right-radius: 8px !important;
}
.br-br-9 {
    border-bottom-right-radius: 9px !important;
}
.br-br-10 {
    border-bottom-right-radius: 10px !important;
}
.br-br-11 {
    border-bottom-right-radius: 11px !important;
}
.br-br-12 {
    border-bottom-right-radius: 12px !important;
}
.br-br-13 {
    border-bottom-right-radius: 13px !important;
}
.br-br-14 {
    border-bottom-right-radius: 14px !important;
}
.br-br-15 {
    border-bottom-right-radius: 15px !important;
}
.br-br-16 {
    border-bottom-right-radius: 16px !important;
}
.br-br-17 {
    border-bottom-right-radius: 17px !important;
}
.br-br-18 {
    border-bottom-right-radius: 18px !important;
}
.br-br-19 {
    border-bottom-right-radius: 19px !important;
}
.br-br-20 {
    border-bottom-right-radius: 20px !important;
}
.br-br-50 {
    border-bottom-right-radius: 50% !important;
}
.br-br-100 {
    border-bottom-right-radius: 100% !important;
}

/*//////////////////////////////// Space Style  ////////////////////////////////*/

/* margin */
.Margin-0 {
    margin: 0px !important;
}
.Margin-10 {
    margin: 10px !important;
}
.Margin-20 {
    margin: 20px !important;
}
.Margin-30 {
    margin: 30px !important;
}
.Margin-40 {
    margin: 40px !important;
}
.Margin-50 {
    margin: 50px !important;
}
.Margin-60 {
    margin: 60px !important;
}
.Margin-70 {
    margin: 70px !important;
}
.Margin-80 {
    margin: 80px !important;
}
.Margin-90 {
    margin: 90px !important;
}
.Margin-100 {
    margin: 100px !important;
}
.Margin-auto {
    margin: auto !important;
}

.mt-0 {
    margin-top: 0px !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;
}
.mt-25 {
    margin-top: 25px !important;
}
.mt-30 {
    margin-top: 30px !important;
}
.mt-35 {
    margin-top: 35px !important;
}
.mt-40 {
    margin-top: 40px !important;
}
.mt-45 {
    margin-top: 45px !important;
}
.mt-50 {
    margin-top: 50px !important;
}
.mt-60 {
    margin-top: 60px !important;
}
.mt-70 {
    margin-top: 70px !important;
}
.mt-80 {
    margin-top: 80px !important;
}
.mt-90 {
    margin-top: 90px !important;
}
.mt-100 {
    margin-top: 100px !important;
}
.mt-150 {
    margin-top: 150px !important;
}
.mt-200 {
    margin-top: 200px !important;
}

.ml-0 {
    margin-left: 0px !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;
}
.ml-25 {
    margin-left: 25px !important;
}
.ml-30 {
    margin-left: 30px !important;
}
.ml-35 {
    margin-left: 35px !important;
}
.ml-35 {
    margin-left: 35px !important;
}
.ml-40 {
    margin-left: 40px !important;
}
.ml-45 {
    margin-left: 45px !important;
}
.ml-50 {
    margin-left: 50px !important;
}
.ml-55 {
    margin-left: 55px !important;
}
.ml-60 {
    margin-left: 60px !important;
}
.ml-65 {
    margin-left: 65px !important;
}
.ml-70 {
    margin-left: 70px !important;
}
.ml-75 {
    margin-left: 75px !important;
}
.ml-80 {
    margin-left: 80px !important;
}
.ml-85 {
    margin-left: 85px !important;
}
.ml-90 {
    margin-left: 90px !important;
}
.ml-100 {
    margin-left: 100px !important;
}
.ml-150 {
    margin-left: 150px !important;
}
.ml-200 {
    margin-left: 200px !important;
}

.mr-0 {
    margin-right: 0px !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;
}
.mr-25 {
    margin-right: 25px !important;
}
.mr-30 {
    margin-right: 30px !important;
}
.mr-35 {
    margin-right: 35px !important;
}
.mr-35 {
    margin-right: 35px !important;
}
.mr-40 {
    margin-right: 40px !important;
}
.mr-45 {
    margin-right: 45px !important;
}
.mr-50 {
    margin-right: 50px !important;
}
.mr-55 {
    margin-right: 55px !important;
}
.mr-60 {
    margin-right: 60px !important;
}
.mr-65 {
    margin-right: 65px !important;
}
.mr-70 {
    margin-right: 70px !important;
}
.mr-75 {
    margin-right: 75px !important;
}
.mr-80 {
    margin-right: 80px !important;
}
.mr-85 {
    margin-right: 85px !important;
}
.mr-90 {
    margin-right: 90px !important;
}
.mr-100 {
    margin-right: 100px !important;
}
.mr-150 {
    margin-right: 150px !important;
}
.mr-200 {
    margin-right: 200px !important;
}

.mb-0 {
    margin-bottom: 0px !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-25 {
    margin-bottom: 25px !important;
}
.mb-30 {
    margin-bottom: 30px !important;
}
.mb-35 {
    margin-bottom: 35px !important;
}
.mb-35 {
    margin-bottom: 35px !important;
}
.mb-40 {
    margin-bottom: 40px !important;
}
.mb-45 {
    margin-bottom: 45px !important;
}
.mb-50 {
    margin-bottom: 50px !important;
}
.mb-55 {
    margin-bottom: 55px !important;
}
.mb-60 {
    margin-bottom: 60px !important;
}
.mb-65 {
    margin-bottom: 65px !important;
}
.mb-70 {
    margin-bottom: 70px !important;
}
.mb-75 {
    margin-bottom: 75px !important;
}
.mb-80 {
    margin-bottom: 80px !important;
}
.mb-85 {
    margin-bottom: 85px !important;
}
.mb-90 {
    margin-bottom: 90px !important;
}
.mb-100 {
    margin-bottom: 100px !important;
}
.mb-150 {
    margin-bottom: 150px !important;
}
.mb-200 {
    margin-bottom: 200px !important;
}

/* padding */
.Padding-0 {
    padding: 0px !important;
}
.Padding-10 {
    padding: 10px !important;
}
.Padding-20 {
    padding: 20px !important;
}
.Padding-30 {
    padding: 30px !important;
}
.Padding-40 {
    padding: 40px !important;
}
.Padding-50 {
    padding: 50px !important;
}
.Padding-60 {
    padding: 60px !important;
}
.Padding-70 {
    padding: 70px !important;
}
.Padding-80 {
    padding: 80px !important;
}
.Padding-90 {
    padding: 90px !important;
}
.Padding-100 {
    padding: 100px !important;
}

.pt-0 {
    padding-top: 0px !important;
}
.pt-5 {
    padding-top: 5px !important;
}
.pt-10 {
    padding-top: 10px !important;
}
.pt-15 {
    padding-top: 15px !important;
}
.pt-20 {
    padding-top: 20px !important;
}
.pt-25 {
    padding-top: 25px !important;
}
.pt-30 {
    padding-top: 30px !important;
}
.pt-35 {
    padding-top: 35px !important;
}
.pt-40 {
    padding-top: 40px !important;
}
.pt-45 {
    padding-top: 45px !important;
}
.pt-50 {
    padding-top: 50px !important;
}
.pt-60 {
    padding-top: 60px !important;
}
.pt-70 {
    padding-top: 70px !important;
}
.pt-80 {
    padding-top: 80px !important;
}
.pt-90 {
    padding-top: 90px !important;
}
.pt-100 {
    padding-top: 100px !important;
}
.pt-150 {
    padding-top: 150px !important;
}
.pt-200 {
    padding-top: 200px !important;
}

.pl-0 {
    padding-left: 0px !important;
}
.pl-5 {
    padding-left: 5px !important;
}
.pl-10 {
    padding-left: 10px !important;
}
.pl-15 {
    padding-left: 15px !important;
}
.pl-20 {
    padding-left: 20px !important;
}
.pl-25 {
    padding-left: 25px !important;
}
.pl-30 {
    padding-left: 30px !important;
}
.pl-35 {
    padding-left: 35px !important;
}
.pl-35 {
    padding-left: 35px !important;
}
.pl-40 {
    padding-left: 40px !important;
}
.pl-45 {
    padding-left: 45px !important;
}
.pl-50 {
    padding-left: 50px !important;
}
.pl-55 {
    padding-left: 55px !important;
}
.pl-60 {
    padding-left: 60px !important;
}
.pl-65 {
    padding-left: 65px !important;
}
.pl-70 {
    padding-left: 70px !important;
}
.pl-75 {
    padding-left: 75px !important;
}
.pl-80 {
    padding-left: 80px !important;
}
.pl-85 {
    padding-left: 85px !important;
}
.pl-90 {
    padding-left: 90px !important;
}
.pl-100 {
    padding-left: 100px !important;
}
.pl-150 {
    padding-left: 150px !important;
}
.pl-200 {
    padding-left: 200px !important;
}

.pr-0 {
    padding-right: 0px !important;
}
.pr-5 {
    padding-right: 5px !important;
}
.pr-10 {
    padding-right: 10px !important;
}
.pr-15 {
    padding-right: 15px !important;
}
.pr-20 {
    padding-right: 20px !important;
}
.pr-25 {
    padding-right: 25px !important;
}
.pr-30 {
    padding-right: 30px !important;
}
.pr-35 {
    padding-right: 35px !important;
}
.pr-35 {
    padding-right: 35px !important;
}
.pr-40 {
    padding-right: 40px !important;
}
.pr-45 {
    padding-right: 45px !important;
}
.pr-50 {
    padding-right: 50px !important;
}
.pr-55 {
    padding-right: 55px !important;
}
.pr-60 {
    padding-right: 60px !important;
}
.pr-65 {
    padding-right: 65px !important;
}
.pr-70 {
    padding-right: 70px !important;
}
.pr-75 {
    padding-right: 75px !important;
}
.pr-80 {
    padding-right: 80px !important;
}
.pr-85 {
    padding-right: 85px !important;
}
.pr-90 {
    padding-right: 90px !important;
}
.pr-100 {
    padding-right: 100px !important;
}
.pr-150 {
    padding-right: 150px !important;
}
.pr-200 {
    padding-right: 200px !important;
}

.pb-0 {
    padding-bottom: 0px !important;
}
.pb-5 {
    padding-bottom: 5px !important;
}
.pb-10 {
    padding-bottom: 10px !important;
}
.pb-15 {
    padding-bottom: 15px !important;
}
.pb-20 {
    padding-bottom: 20px !important;
}
.pb-25 {
    padding-bottom: 25px !important;
}
.pb-30 {
    padding-bottom: 30px !important;
}
.pb-35 {
    padding-bottom: 35px !important;
}
.pb-35 {
    padding-bottom: 35px !important;
}
.pb-40 {
    padding-bottom: 40px !important;
}
.pb-45 {
    padding-bottom: 45px !important;
}
.pb-50 {
    padding-bottom: 50px !important;
}
.pb-55 {
    padding-bottom: 55px !important;
}
.pb-60 {
    padding-bottom: 60px !important;
}
.pb-65 {
    padding-bottom: 65px !important;
}
.pb-70 {
    padding-bottom: 70px !important;
}
.pb-75 {
    padding-bottom: 75px !important;
}
.pb-80 {
    padding-bottom: 80px !important;
}
.pb-85 {
    padding-bottom: 85px !important;
}
.pb-90 {
    padding-bottom: 90px !important;
}
.pb-100 {
    padding-bottom: 100px !important;
}
.pb-150 {
    padding-bottom: 150px !important;
}
.pb-200 {
    padding-bottom: 200px !important;
}

/*//////////////////////////////// Layout  ////////////////////////////////*/

/* Width */
.Width-100 {
    width: 100% !important;
}
.Width-95 {
    width: 95% !important;
}
.Width-90 {
    width: 90% !important;
}
.Width-85 {
    width: 85% !important;
}
.Width-80 {
    width: 80% !important;
}
.Width-75 {
    width: 75% !important;
}
.Width-70 {
    width: 70% !important;
}
.Width-65 {
    width: 65% !important;
}
.Width-60 {
    width: 60% !important;
}
.Width-55 {
    width: 55% !important;
}
.Width-50 {
    width: 50% !important;
}
.Width-45 {
    width: 45% !important;
}
.Width-40 {
    width: 40% !important;
}
.Width-35 {
    width: 35% !important;
}
.Width-30 {
    width: 30% !important;
}
.Width-333 {
    width: 33.333% !important;
}
.Width-25 {
    width: 25% !important;
}
.Width-20 {
    width: 20% !important;
}
.Width-15 {
    width: 15% !important;
}
.Width-10 {
    width: 10% !important;
}
.Width-5 {
    width: 5% !important;
}
.Width-auto {
    width: auto !important;
}
.Width-max {
    width: min-content !important;
}

/* Width pixel */
.w-1 {
    width: 1px !important;
}
.w-2 {
    width: 2px !important;
}
.w-3 {
    width: 3px !important;
}
.w-4 {
    width: 4px !important;
}
.w-5 {
    width: 5px !important;
}
.w-6 {
    width: 6px !important;
}
.w-7 {
    width: 7px !important;
}
.w-8 {
    width: 8px !important;
}
.w-9 {
    width: 9px !important;
}
.w-10 {
    width: 10px !important;
}
.w-11 {
    width: 11px !important;
}
.w-12 {
    width: 12px !important;
}
.w-13 {
    width: 13px !important;
}
.w-14 {
    width: 14px !important;
}
.w-15 {
    width: 15px !important;
}
.w-16 {
    width: 16px !important;
}
.w-17 {
    width: 17px !important;
}
.w-18 {
    width: 18px !important;
}
.w-19 {
    width: 19px !important;
}
.w-20 {
    width: 20px !important;
}
.w-21 {
    width: 21px !important;
}
.w-22 {
    width: 22px !important;
}
.w-23 {
    width: 23px !important;
}
.w-24 {
    width: 24px !important;
}
.w-25 {
    width: 25px !important;
}
.w-26 {
    width: 26px !important;
}
.w-27 {
    width: 27px !important;
}
.w-28 {
    width: 28px !important;
}
.w-29 {
    width: 29px !important;
}
.w-30 {
    width: 30px !important;
}
.w-31 {
    width: 31px !important;
}
.w-32 {
    width: 32px !important;
}
.w-33 {
    width: 33px !important;
}
.w-34 {
    width: 34px !important;
}
.w-35 {
    width: 35px !important;
}
.w-36 {
    width: 36px !important;
}
.w-37 {
    width: 37px !important;
}
.w-38 {
    width: 38px !important;
}
.w-39 {
    width: 39px !important;
}
.w-40 {
    width: 40px !important;
}
.w-41 {
    width: 41px !important;
}
.w-42 {
    width: 42px !important;
}
.w-43 {
    width: 43px !important;
}
.w-44 {
    width: 44px !important;
}
.w-45 {
    width: 45px !important;
}
.w-46 {
    width: 46px !important;
}
.w-47 {
    width: 47px !important;
}
.w-48 {
    width: 48px !important;
}
.w-49 {
    width: 49px !important;
}
.w-50 {
    width: 50px !important;
}
.w-51 {
    width: 51px !important;
}
.w-52 {
    width: 52px !important;
}
.w-53 {
    width: 53px !important;
}
.w-54 {
    width: 54px !important;
}
.w-55 {
    width: 55px !important;
}
.w-56 {
    width: 56px !important;
}
.w-57 {
    width: 57px !important;
}
.w-58 {
    width: 58px !important;
}
.w-59 {
    width: 59px !important;
}
.w-60 {
    width: 60px !important;
}
.w-61 {
    width: 61px !important;
}
.w-62 {
    width: 62px !important;
}
.w-63 {
    width: 63px !important;
}
.w-64 {
    width: 64px !important;
}
.w-65 {
    width: 65px !important;
}
.w-66 {
    width: 66px !important;
}
.w-67 {
    width: 67px !important;
}
.w-68 {
    width: 68px !important;
}
.w-69 {
    width: 69px !important;
}
.w-70 {
    width: 70px !important;
}
.w-71 {
    width: 71px !important;
}
.w-72 {
    width: 72px !important;
}
.w-73 {
    width: 73px !important;
}
.w-74 {
    width: 74px !important;
}
.w-75 {
    width: 75px !important;
}
.w-76 {
    width: 76px !important;
}
.w-77 {
    width: 77px !important;
}
.w-78 {
    width: 78px !important;
}
.w-79 {
    width: 79px !important;
}
.w-80 {
    width: 80px !important;
}
.w-81 {
    width: 81px !important;
}
.w-82 {
    width: 82px !important;
}
.w-83 {
    width: 83px !important;
}
.w-84 {
    width: 84px !important;
}
.w-85 {
    width: 85px !important;
}
.w-86 {
    width: 86px !important;
}
.w-87 {
    width: 87px !important;
}
.w-88 {
    width: 88px !important;
}
.w-89 {
    width: 89px !important;
}
.w-90 {
    width: 90px !important;
}
.w-91 {
    width: 91px !important;
}
.w-92 {
    width: 92px !important;
}
.w-93 {
    width: 93px !important;
}
.w-94 {
    width: 94px !important;
}
.w-95 {
    width: 95px !important;
}
.w-96 {
    width: 96px !important;
}
.w-97 {
    width: 97px !important;
}
.w-98 {
    width: 98px !important;
}
.w-99 {
    width: 99px !important;
}
.w-100 {
    width: 100px !important;
}
.w-110 {
    width: 110px !important;
}
.w-120 {
    width: 120px !important;
}
.w-130 {
    width: 130px !important;
}
.w-140 {
    width: 140px !important;
}
.w-150 {
    width: 150px !important;
}
.w-160 {
    width: 160px !important;
}
.w-170 {
    width: 170px !important;
}
.w-180 {
    width: 180px !important;
}
.w-190 {
    width: 190px !important;
}
.w-200 {
    width: 200px !important;
}
.w-250 {
    width: 250px !important;
}
.w-300 {
    width: 300px !important;
}
.w-400 {
    width: 400px !important;
}
.w-500 {
    width: 500px !important;
}
.w-600 {
    width: 600px !important;
}
.w-700 {
    width: 700px !important;
}
.w-800 {
    width: 800px !important;
}
.w-900 {
    width: 900px !important;
}
.w-1000 {
    width: 1000px !important;
}

/* Height pixel */
.Height-100 {
    height: 100% !important;
}
.Height-100vh {
    height: 100vh !important;
}
.h-1 {
    height: 1px !important;
}
.h-2 {
    height: 2px !important;
}
.h-3 {
    height: 3px !important;
}
.h-4 {
    height: 4px !important;
}
.h-5 {
    height: 5px !important;
}
.h-6 {
    height: 6px !important;
}
.h-7 {
    height: 7px !important;
}
.h-8 {
    height: 8px !important;
}
.h-9 {
    height: 9px !important;
}
.h-10 {
    height: 10px !important;
}
.h-11 {
    height: 11px !important;
}
.h-12 {
    height: 12px !important;
}
.h-13 {
    height: 13px !important;
}
.h-14 {
    height: 14px !important;
}
.h-15 {
    height: 15px !important;
}
.h-16 {
    height: 16px !important;
}
.h-17 {
    height: 17px !important;
}
.h-18 {
    height: 18px !important;
}
.h-19 {
    height: 19px !important;
}
.h-20 {
    height: 20px !important;
}
.h-21 {
    height: 21px !important;
}
.h-22 {
    height: 22px !important;
}
.h-23 {
    height: 23px !important;
}
.h-24 {
    height: 24px !important;
}
.h-25 {
    height: 25px !important;
}
.h-26 {
    height: 26px !important;
}
.h-27 {
    height: 27px !important;
}
.h-28 {
    height: 28px !important;
}
.h-29 {
    height: 29px !important;
}
.h-30 {
    height: 30px !important;
}
.h-31 {
    height: 31px !important;
}
.h-32 {
    height: 32px !important;
}
.h-33 {
    height: 33px !important;
}
.h-34 {
    height: 34px !important;
}
.h-35 {
    height: 35px !important;
}
.h-36 {
    height: 36px !important;
}
.h-37 {
    height: 37px !important;
}
.h-38 {
    height: 38px !important;
}
.h-39 {
    height: 39px !important;
}
.h-40 {
    height: 40px !important;
}
.h-41 {
    height: 41px !important;
}
.h-42 {
    height: 42px !important;
}
.h-43 {
    height: 43px !important;
}
.h-44 {
    height: 44px !important;
}
.h-45 {
    height: 45px !important;
}
.h-46 {
    height: 46px !important;
}
.h-47 {
    height: 47px !important;
}
.h-48 {
    height: 48px !important;
}
.h-49 {
    height: 49px !important;
}
.h-50 {
    height: 50px !important;
}
.h-51 {
    height: 51px !important;
}
.h-52 {
    height: 52px !important;
}
.h-53 {
    height: 53px !important;
}
.h-54 {
    height: 54px !important;
}
.h-55 {
    height: 55px !important;
}
.h-56 {
    height: 56px !important;
}
.h-57 {
    height: 57px !important;
}
.h-58 {
    height: 58px !important;
}
.h-59 {
    height: 59px !important;
}
.h-60 {
    height: 60px !important;
}
.h-61 {
    height: 61px !important;
}
.h-62 {
    height: 62px !important;
}
.h-63 {
    height: 63px !important;
}
.h-64 {
    height: 64px !important;
}
.h-65 {
    height: 65px !important;
}
.h-66 {
    height: 66px !important;
}
.h-67 {
    height: 67px !important;
}
.h-68 {
    height: 68px !important;
}
.h-69 {
    height: 69px !important;
}
.h-70 {
    height: 70px !important;
}
.h-71 {
    height: 71px !important;
}
.h-72 {
    height: 72px !important;
}
.h-73 {
    height: 73px !important;
}
.h-74 {
    height: 74px !important;
}
.h-75 {
    height: 75px !important;
}
.h-76 {
    height: 76px !important;
}
.h-77 {
    height: 77px !important;
}
.h-78 {
    height: 78px !important;
}
.h-79 {
    height: 79px !important;
}
.h-80 {
    height: 80px !important;
}
.h-81 {
    height: 81px !important;
}
.h-82 {
    height: 82px !important;
}
.h-83 {
    height: 83px !important;
}
.h-84 {
    height: 84px !important;
}
.h-85 {
    height: 85px !important;
}
.h-86 {
    height: 86px !important;
}
.h-87 {
    height: 87px !important;
}
.h-88 {
    height: 88px !important;
}
.h-89 {
    height: 89px !important;
}
.h-90 {
    height: 90px !important;
}
.h-91 {
    height: 91px !important;
}
.h-92 {
    height: 92px !important;
}
.h-93 {
    height: 93px !important;
}
.h-94 {
    height: 94px !important;
}
.h-95 {
    height: 95px !important;
}
.h-96 {
    height: 96px !important;
}
.h-97 {
    height: 97px !important;
}
.h-98 {
    height: 98px !important;
}
.h-99 {
    height: 99px !important;
}
.h-100 {
    height: 100px !important;
}
.h-110 {
    height: 110px !important;
}
.h-120 {
    height: 120px !important;
}
.h-130 {
    height: 130px !important;
}
.h-140 {
    height: 140px !important;
}
.h-150 {
    height: 150px !important;
}
.h-160 {
    height: 160px !important;
}
.h-170 {
    height: 170px !important;
}
.h-180 {
    height: 180px !important;
}
.h-190 {
    height: 190px !important;
}
.h-200 {
    height: 200px !important;
}
.h-250 {
    height: 250px !important;
}
.h-300 {
    height: 300px !important;
}
.h-350 {
    height: 300px !important;
}
.h-400 {
    height: 400px !important;
}
.h-500 {
    height: 500px !important;
}
.h-550 {
    height: 550px !important;
}
.h-600 {
    height: 600px !important;
}
.h-700 {
    height: 700px !important;
}
.h-800 {
    height: 800px !important;
}
.h-900 {
    height: 900px !important;
}
.h-1000 {
    height: 1000px !important;
}

/*텍스트 정렬*/
.align-r {
    text-align: right !important;
}
.align-c {
    text-align: center !important;
}
.align-l {
    text-align: left !important;
}

/* display */
.dsp-ib {
    display: inline-block !important;
}
.dsp-b {
    display: block !important;
}
.dsp-n {
    display: none !important;
}

/* vertical */
.valign-t {
    vertical-align: top !important;
}
.valign-m {
    vertical-align: middle !important;
}
.valign-b {
    vertical-align: bottom !important;
}

/* position */
.position-a {
    position: absolute !important;
}
.position-r {
    position: relative !important;
}
.position-f {
    position: fixed !important;
}

.top-0 {
    top: 0;
}
.top-100 {
    top: 100;
}
.right-0 {
    right: 0;
}
.right-50 {
    right: 50;
}
.left-0 {
    left: 0;
}
.bottom-0 {
    bottom: 0;
}

/* box-sizing */
.box_b {
    box-sizing: border-box;
}
.box_c {
    box-sizing: content-box;
}

/* list style */
.list-dot li {
    list-style: disc inside;
}
.list-circle li {
    list-style: circle inside;
}
.list-decimal li {
    list-style: decimal inside;
}

/*//////////////////////////////// Button ////////////////////////////////*/

.button {
    display: inline-block;
    min-width: 100px;
    text-align: center;
    color: #000;
    background-color: #fff;
    font-size: 16px;
    border: solid 1px #ccc;
    border-radius: 4px;
    padding: 7px 23px;
    cursor: pointer;
}
.button.pill {
    border-radius: calc(100vh - 50%);
}

.button:hover {
    background-color: #f8f8f8;
}

.button.small {
    font-size: 14px !important;
    padding: 3px 23px;
}

.button.big {
    font-size: 20px !important;
    padding: 15px 23px;
}

/* Scroll */
.scroll-y {
    overflow-y: scroll;
}

/* .input_search { padding-right:30px !important;  }
.btn_search { margin-left:-25px; }*/

/*//////////////////////////////// Input ////////////////////////////////*/
/* input,textarea {-webkit-appearance:none;border: 0;outline:none; } */
/* input[type='checkbox']{-webkit-appearance:none;margin:0px; }
input[type='radio']{-webkit-appearance:none} */

input[type='text'],
input[type='number'],
input[type='password'],
input[type='date'],
input[type='time'] {
    font-size: 16px;
    border: solid 1px #ccc;
    height: 38px;
    line-height: 38px;
    padding: 0 15px;
    outline: 0;
    border-radius: 4px;
    vertical-align: middle;
}
input[type='text'].pill,
input[type='number'].pill,
input[type='password'].pill,
input[type='date'].pill,
input[type='time'].pill {
    border-radius: calc(100vh - 10%);
}

input[type='date']::-webkit-calendar-picker-indicator,
input[type='time']::-webkit-calendar-picker-indicator,
input[type='month']::-webkit-calendar-picker-indicator,
input[type='week']::-webkit-calendar-picker-indicator,
input[type='datetime-local']::-webkit-calendar-picker-indicator {
    display: none;
}

/* Search,date,time */
input[type='text'].search + i,
input[type='date'] + i,
input[type='time'] + i {
    height: 38px;
    margin-left: -38px;
    vertical-align: middle;
}

input[type='text']:focus,
input[type='number']:focus,
input[type='password']:focus,
textarea:focus,
input[type='date']:focus,
input[type='time']:focus {
    border: solid 1px #aaa;
}
input[type='text']:focus,
input[type='password']:focus,
textarea:focus {
    border: solid 1px #aaa;
}
input:-ms-input-placeholder {
    color: #ccc;
}
input::-webkit-input-placeholder {
    color: #ccc;
}
input::-moz-placeholder {
    color: #ccc;
}
input::-moz-placeholder {
    color: #ccc;
}

/* textarea */
textarea {
    width: 100%;
    min-height: 67px;
    font-size: 16px;
    border: solid 1px #cecece;
    padding: 10px;
    box-sizing: border-box;
    outline: 0;
    border-radius: 2px;
}
textarea:-ms-input-placeholder {
    color: #ccc;
}
textarea::-webkit-input-placeholder {
    color: #ccc;
}
textarea::-moz-placeholder {
    color: #ccc;
}
textarea::-moz-placeholder {
    color: #ccc;
}

/*  Checkbox */
input[type='checkbox'] {
    -webkit-appearance: none;
    margin: 0px;
}
input[type='checkbox'] {
    display: none;
}
input[type='checkbox'] {
    position: relative;
    display: inline-block;
    width: 25px;
    height: 25px;
    border: 1px solid #999;
    border-radius: 4px;
    cursor: pointer;
    vertical-align: middle;
    margin: 0;
    background-color: #fff;
}
input[type='checkbox']:after {
    font-family: 'remixicon' !important;
    font-style: normal;
    font-size: 25px;
    content: '\EB7B';
    color: #999;
}
input[type='checkbox']:checked {
    background-color: #009bf2;
    border-color: #009bf2;
}
input[type='checkbox']:checked:after {
    font-family: 'remixicon' !important;
    font-style: normal;
    font-size: 25px;
    content: '\EB7B';
    color: #fff;
}
input[type='checkbox'] + label {
    margin-left: 5px;
    color: #666;
}
input[type='checkbox']:checked + label {
    color: #333;
    font-weight: bold;
}
input[type='checkbox']:disabled {
    background-color: #f1f1f1;
}
input[type='checkbox']:disabled:after {
    color: #ccc;
}
input[type='checkbox']:disabled + label {
    color: #ccc;
}

/* select box */
.select {
    position: relative;
    display: inline-block;
    margin-bottom: 15px;
    width: 100%;
}
.select select {
    display: inline-block;
    width: 100%;
    cursor: pointer;
    padding: 10px 15px;
    outline: 0;
    border: 1px solid #cccccc;
    border-radius: 4px;
    background: #ffffff;
    font-size: 16px;
    color: #333333;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.select select::-ms-expand {
    display: none;
}
.select select:hover,
.select select:focus {
    color: #000000;
    background: #f4f4f4;
}
.select select:disabled {
    opacity: 1;
    pointer-events: none;
}
.select_arrow {
    position: absolute;
    top: 12px;
    right: 19px;
    width: 0px;
    height: 0px;
    border: solid #7b7b7b;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.select select:hover ~ .select_arrow,
.select select:focus ~ .select_arrow {
    border-color: #000000;
}
.select select:disabled ~ .select_arrow {
    border-top-color: #cccccc;
}

/* UI Checkbox */
.ui-checkbox {
    position: relative;
    padding: 10px 15px 10px 40px;
    font-size: 16px;
    color: #999;
    border-radius: 8px;
    background-color: #fff;
    border: solid 1px #ccc;
}
.ui-checkbox:before {
    position: absolute;
    left: 10px;
    font-family: 'remixicon' !important;
    font-style: normal;
    font-size: 25px;
    content: '\EB7B';
    color: #999;
}
.ui-checkbox.disabled {
    color: #ccc;
    font-weight: bold;
    background-color: #f1f1f1;
}
.ui-checkbox.disabled:before {
    color: #ccc;
}
.ui-checkbox.checked {
    color: #fff;
    font-weight: bold;
    background-color: #009bf2;
    border-color: #009bf2;
}
.ui-checkbox.checked:before {
    color: #fff;
}

/*  Radio */
input[type='radio'] {
    -webkit-appearance: none;
    margin: 0px;
}
input[type='radio'] {
    display: none;
}
input[type='radio'] {
    position: relative;
    display: inline-block;
    width: 25px;
    height: 25px;
    border: 1px solid #999;
    border-radius: 100%;
    cursor: pointer;
    vertical-align: middle;
    margin: 0;
    background-color: #fff;
    text-align: center;
}

input[type='radio']:checked {
    background-color: #009bf2;
    border-color: #009bf2;
}
input[type='radio']:checked:after {
    font-family: 'remixicon' !important;
    font-style: normal;
    font-size: 16px;
    content: '\F3C1';
    color: #fff;
    line-height: 24px;
}
input[type='radio'] + label {
    margin-left: 5px;
    color: #666;
}
input[type='radio']:checked + label {
    color: #333;
    font-weight: bold;
}
input[type='radio']:disabled {
    background-color: #f1f1f1;
}
input[type='radio']:disabled:after {
    color: #ccc;
}
input[type='radio']:disabled + label {
    color: #ccc;
}

/* UI Radio */
.ui-radio {
    position: relative;
    padding: 10px 15px 10px 40px;
    font-size: 16px;
    color: #999;
    border-radius: 8px;
    background-color: #fff;
    border: solid 1px #ccc;
}
.ui-radio:before {
    position: absolute;
    top: 8px;
    left: 10px;
    font-family: 'remixicon' !important;
    font-style: normal;
    font-size: 20px;
    content: '\F050';
    color: #999;
}
.ui-radio.disabled {
    color: #ccc;
    font-weight: bold;
    background-color: #f1f1f1;
}
.ui-radio.disabled:before {
    color: #ccc;
}
.ui-radio.checked {
    color: #fff;
    font-weight: bold;
    background-color: #009bf2;
    border-color: #009bf2;
}
.ui-radio.checked:before {
    color: #fff;
}

/*//////////////////////////////// Flex ////////////////////////////////*/
.flex {
    display: flex !important;
}
/* 줄넘김 */
.flex.wrap {
    flex-wrap: wrap;
} /* 줄넘김 함 */
.flex.nowrap {
    flex-wrap: nowrap;
} /* 줄넘김 안함 */
.flex.wrap_re {
    flex-wrap: wrap-reverse;
} /* 줄넘김 역순으로 함 */
/* 방향 */
.flex.row {
    flex-direction: row;
} /* 가로 방향 */
.flex.row_re {
    flex-direction: row-reverse;
} /* 가로 역순 방향 */
.flex.colum {
    flex-direction: column;
} /*세로 방향 */
.flex.colum_re {
    flex-direction: column-reverse;
} /* 세로 역순 방향 */
/* 가로 정렬 */
.flex.jc_start {
    justify-content: flex-start;
} /* 시작점으로 정렬 */
.flex.jc_end {
    justify-content: flex-end;
} /* 끝점으로 정렬 */
.flex.jc_center {
    justify-content: center;
} /* 가운데 정렬 */
.flex.jc_between {
    justify-content: space-between;
} /* 사이에 균일한 간격 */
.flex.jc_around {
    justify-content: space-around;
} /* 둘레에 균일한 간격 */
.flex.jc_evenly {
    justify-content: space-evenly;
} /* 양끝 균일한 간격 */
/* 수직 정렬 */
.flex.ai_stretch {
    align-items: stretch;
} /* 수직 방향 끝까지 늘어남 */
.flex.ai_start {
    align-items: flex-start;
} /* 수직 방향 시작점 */
.flex.ai_end {
    align-items: flex-end;
} /* 수직 방향 시작점 */
.flex.ai_center {
    align-items: center;
} /* 수직 방향 가운데 정렬 */
.flex.ai_baseline {
    align-items: baseline;
} /* 베이스라인 기준 가운데 정렬 */
/* 행 정렬 */
.flex.ac_stretch {
    align-content: stretch;
} /* 수직 방향 끝까지 늘어나면서 정렬 */
.flex.ac_start {
    align-content: flex-start;
} /* 시작점으로 정렬 */
.flex.ac_end {
    align-content: flex-end;
} /* 끝점으로 정렬 */
.flex.ac_center {
    align-content: center;
} /* 가운데 정렬 */
.flex.ac_between {
    align-content: space-between;
} /* 사이에 균일한 간격 */
.flex.ac_around {
    align-content: space-around;
} /* 둘레에 균일한 간격 */
.flex.ac_evenly {
    align-content: space-evenly;
} /* 양끝 균일한 간격 */
/* 크기설정 */
.flex .fb_auto {
    flex-basis: auto;
} /* 사이즈 없음 */
.flex .fg_0 {
    flex-grow: 0;
} /* 사이즈 없음 */
.flex .fg_1 {
    flex-grow: 1;
} /* 사이즈 1 */
.flex .fg_2 {
    flex-grow: 2;
} /* 사이즈 2 */
.flex .fg_3 {
    flex-grow: 3;
} /* 사이즈 3 */
.flex .fg_4 {
    flex-grow: 4;
} /* 사이즈 4 */
.flex .fg_5 {
    flex-grow: 5;
} /* 사이즈 5 */
.flex .fg_6 {
    flex-grow: 6;
} /* 사이즈 6 */
.flex .fg_7 {
    flex-grow: 7;
} /* 사이즈 7 */
.flex .fg_8 {
    flex-grow: 8;
} /* 사이즈 8 */
.flex .fg_9 {
    flex-grow: 9;
} /* 사이즈 9 */

/*//////////////////////////////// Tooltip ////////////////////////////////*/

[data-tooltip] {
    position: relative;
    cursor: pointer;
}
[data-tooltip]:before,
[data-tooltip]:after {
    line-height: 1;
    font-size: 14px;
    pointer-events: none;
    position: absolute;
    box-sizing: border-box;
    display: none;
    opacity: 0;
}
[data-tooltip]:before {
    content: '';
    border: 5px solid transparent;
    z-index: 100;
}
[data-tooltip]:after {
    content: attr(data-tooltip);
    text-align: center;
    min-width: 120px;
    /* max-width: 250px; */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 6px 10px;
    border-radius: 4px;
    background: #0091ff;
    color: #ffffff;
    z-index: 99;
}
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
    display: block;
    opacity: 1;
}

/* 방향 */

[data-tooltip]:not([data-flow])::before,
[data-tooltip][data-flow='top']::before {
    bottom: 100%;
    border-bottom-width: 0;
    border-top-color: #0091ff;
}
[data-tooltip]:not([data-flow])::after,
[data-tooltip][data-flow='top']::after {
    bottom: calc(100% + 5px);
}
[data-tooltip]:not([data-flow])::before,
[tooltip]:not([data-flow])::after,
[data-tooltip][data-flow='top']::before,
[data-tooltip][data-flow='top']::after {
    left: 50%;
    -webkit-transform: translate(-50%, -4px);
    transform: translate(-50%, -4px);
}
[data-tooltip][data-flow='bottom']::before {
    top: 100%;
    border-top-width: 0;
    border-bottom-color: #0091ff;
}
[data-tooltip][data-flow='bottom']::after {
    top: calc(100% + 5px);
}
[data-tooltip][data-flow='bottom']::before,
[data-tooltip][data-flow='bottom']::after {
    left: 50%;
    -webkit-transform: translate(-50%, 8px);
    transform: translate(-50%, 8px);
}
[data-tooltip][data-flow='left']::before {
    top: 50%;
    border-right-width: 0;
    border-left-color: #0091ff;
    left: calc(0em - 5px);
    -webkit-transform: translate(-8px, -50%);
    transform: translate(-8px, -50%);
}
[data-tooltip][data-flow='left']::after {
    top: 50%;
    right: calc(100% + 5px);
    -webkit-transform: translate(-8px, -50%);
    transform: translate(-8px, -50%);
}
[data-tooltip][data-flow='right']::before {
    top: 50%;
    border-left-width: 0;
    border-right-color: #0091ff;
    right: calc(0em - 5px);
    -webkit-transform: translate(8px, -50%);
    transform: translate(8px, -50%);
}
[data-tooltip][data-flow='right']::after {
    top: 50%;
    left: calc(100% + 5px);
    -webkit-transform: translate(8px, -50%);
    transform: translate(8px, -50%);
}
[data-tooltip='']::after,
[data-tooltip='']::before {
    display: none !important;
}

/*//////////////////////////////// box-shadow ////////////////////////////////*/

.shadow-center {
    box-shadow: 0px 0px 12px 2px rgba(0, 0, 0, 0.2);
}
.shadow-top {
    box-shadow: 0px -8px 12px 2px rgba(0, 0, 0, 0.2);
}
.shadow-right {
    box-shadow: 8px 0px 12px 2px rgba(0, 0, 0, 0.2);
}
.shadow-bottom {
    box-shadow: 0px 8px 12px 2px rgba(0, 0, 0, 0.2);
}
.shadow-left {
    box-shadow: -8px 0px 12px 2px rgba(0, 0, 0, 0.2);
}

.pagenation {
    text-align: center;
    margin-top: 30px;
}

.pagenation .page {
    width: 35px;
    display: inline-block;
    line-height: 35px;
    border: solid 1px #ddd;
    margin: 0 5px;
    border-radius: 4px;
}

.pagenation .page.on {
    border: solid 1px #295baa;
    color: #fff;
    background: #295baa;
}

.pagenation .first,
.pagenation .prev,
.pagenation .next,
.pagenation .last {
    font-size: 32px;
    color: #666;
    vertical-align: middle;
}

.ri-router-fill {
    font-size: 1.5em;
}

/* 상태별 색상 정의 */
.icon-on {
    color: green;
}

.icon-off {
    color: red;
}

.icon-caution {
    color: orange;
}

.icon-default {
    color: grey;
}

.ui-checkbox_small {
    position: relative;
    font-size: 13px;
    color: #999;
    border-radius: 3px;
    background-color: #fff;
    border: solid 1px #ccc;
    display: flex; /* Ensure it's a flex container */
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
}
.ui-checkbox_small:before {
    position: absolute;
    left: 1px;
    font-family: 'remixicon' !important;
    font-style: normal;
    font-size: 10px;
    content: '\EB7B';
    color: #999;
}

.ui-checkbox_small.disabled {
    color: #ccc;
    font-weight: bold;
    background-color: #f1f1f1;
}
.ui-checkbox_small.disabled:before {
    color: #ccc;
}
.ui-checkbox_smallx.checked {
    color: #fff;
    font-weight: bold;
    background-color: #009bf2;
    border-color: #009bf2;
}
.ui-checkbox.checked:before {
    color: #fff;
}