@charset "utf-8";
html {scroll-behavior: smooth; /* 드래그 방지 */ -ms-user-select: none; -moz-user-select: -moz-none; -webkit-user-select: none; -khtml-user-select: none; user-select: none;}
#load{width: 100%;height: 100%; top: 0;left: 0; position: fixed;display: block;z-index: 999;text-align: center;}
#load>img{width: 120px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); z-index: 10000;}
button{cursor: pointer;}
#wrap {max-width: 1440px; margin: 0 auto;}
*, ::after, ::before {box-sizing: border-box;}
.sr-only {position: absolute; width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);white-space: nowrap;border-width: 0;}

/* color */
.color_bg_main{background: var(--main-color);}
.color_txt_main{color: var(--main-color);}
.color_bg_sub{background: var(--sub-color);}
.color_txt_sub{color: var(--sub-color);}

.scroll_lock{overflow: hidden;}
.shadow{box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);}
.transparent{opacity: 0;}
.pointer{cursor: pointer;}
 
.d-none{display: none;}
.d-block{display: block;}
.d-flex{display: flex;}
.d-grid{display: grid;} 
.flex-wrap{flex-wrap: wrap;}
.flex-direction-column{flex-direction: column;}
.justify-content-between{justify-content: space-between;}
.justify-content-center{justify-content: center;}
.justify-content-start{justify-content: start;}
.justify-content-end{justify-content: end;}
.align-items-center{align-items: center;}
.align-items-baseline{align-items:baseline;}
.align-items-end{align-items:end;}
.text-left{text-align: left;}
.text-center{text-align: center;}
.text-right{text-align: right;}
.position-relative{position: relative;}
.position-absolute{position: absolute;}
.visible {visibility: visible;}
.invisible {visibility: hidden;}

/* margin */
.m-0 {margin: 0;}
.mt-0,.my-0 {margin-top: 0;}
.mr-0,.mx-0 {margin-right: 0;}
.mb-0,.my-0 {margin-bottom: 0;}
.ml-0,.mx-0 {margin-left: 0;}

.m-1 {margin: 0.25rem;}
.mt-1,.my-1 {margin-top: 0.25rem;}
.mr-1,.mx-1 {margin-right: 0.25rem;}
.mb-1,.my-1 {margin-bottom: 0.25rem;}
.ml-1,.mx-1 {margin-left: 0.25rem;}

.m-2 {margin: 0.5rem;}
.mt-2,.my-2 {margin-top: 0.5rem;}
.mr-2,.mx-2 {margin-right: 0.5rem;}
.mb-2,.my-2 {margin-bottom: 0.5rem;}
.ml-2,.mx-2 {margin-left: 0.5rem;}

.m-3 {margin: 1rem;}
.mt-3,.my-3 {margin-top: 1rem;}
.mr-3,.mx-3 {margin-right: 1rem;}
.mb-3,.my-3 {margin-bottom: 1rem;}
.ml-3,.mx-3 {margin-left: 1rem;}

.m-4 {margin: 1.5rem;}
.mt-4,.my-4 {margin-top: 1.5rem;}
.mr-4,.mx-4 {margin-right: 1.5rem;}
.mb-4,.my-4 {margin-bottom: 1.5rem;}
.ml-4,.mx-4 {margin-left: 1.5rem;}

.m-5 {margin: 3rem;}
.mt-5,.my-5 {margin-top: 3rem;}
.mr-5,.mx-5 {margin-right: 3rem;}
.mb-5,.my-5 {margin-bottom: 3rem;}
.ml-5,.mx-5 {margin-left: 3rem;}

/* padding */
.p-0 {padding: 0;}
.pt-0,.py-0 {padding-top: 0;}
.pr-0,.px-0 {padding-right: 0;}
.pb-0,.py-0 {padding-bottom: 0;}
.pl-0,.px-0 {padding-left: 0;}

.p-1 {padding: 0.25rem;}
.pt-1,.py-1 {padding-top: 0.25rem;}
.pr-1,.px-1 {padding-right: 0.25rem;}
.pb-1,.py-1 {padding-bottom: 0.25rem;}
.pl-1,.px-1 {padding-left: 0.25rem;}

.p-2 {padding: 0.5rem;}
.pt-2,.py-2 {padding-top: 0.5rem;}
.pr-2,.px-2 {padding-right: 0.5rem;}
.pb-2,.py-2 {padding-bottom: 0.5rem;}
.pl-2,.px-2 {padding-left: 0.5rem;}

.p-3 {padding: 1rem;}
.pt-3,.py-3 {padding-top: 1rem;}
.pr-3,.px-3 {padding-right: 1rem;}
.pb-3,.py-3 {padding-bottom: 1rem;}
.pl-3,.px-3 {padding-left: 1rem;}

.p-4 {padding: 1.5rem;}
.pt-4,.py-4 {padding-top: 1.5rem;}
.pr-4,.px-4 {padding-right: 1.5rem;}
.pb-4,.py-4 {padding-bottom: 1.5rem;}
.pl-4,.px-4 {padding-left: 1.5rem;}

.p-5 {padding: 3rem;}
.pt-5,.py-5 {padding-top: 3rem;}
.pr-5,.px-5 {padding-right: 3rem;}
.pb-5,.py-5 {padding-bottom: 3rem;}
.pl-5,.px-5 {padding-left: 3rem;}

/* button */
.btn {padding: 10px 16px;}
.btn_main {background: var(--main-color); border: none; white-space: nowrap;}
.btn_sub {background: transparent; border: 1px solid var(--main-color); white-space: nowrap;}
.btn_w {display: flex; justify-content: center;} 

/* width & height */
.w_100 {width: 100%;}
.w_90 {width: 90%;}
.w_80 {width: 80%;}
.w_70 {width: 70%;}
.w_60 {width: 60%;}
.w_50 {width: 50%;}
.w_40 {width: 40%;}
.w_30 {width: 30%;}
.w_20 {width: 20%;}
.w_10 {width: 10%;}
.h_100{height: 100%;}

/* form_control */
.form_control {display: block; padding: 10px 16px;font-weight: 400; line-height: 1.5;color: var(--font-color);background-color: var(--white-color); border: 1px solid var(--grey-color);}
.form_control::placeholder {color: var(--grey-color);}

/* border-radius */
.border_1{border-radius: 0.25rem;}
.border_2{border-radius: 0.5rem;}
.border_3{border-radius: 1rem;}
.border_4{border-radius: 1.5rem;}
.border_5{border-radius: 2rem;}
.border_6{border-radius: 3rem;}

/* table */
.table {width: 100%;}
.table th,.table td {vertical-align: top; border-top: 1px solid var(--table-border-color);}
.table thead th {vertical-align: bottom; border-bottom: 2px solid var(--table-border-color);}
.table tbody + tbody {border-top: 2px solid var(--table-border-color);}
.table-border thead th,.table-border thead td {border-bottom-width: 2px;}
.table-borderless th,.table-borderless td,.table-borderless thead th,.table-borderless tbody + tbody {border: 0;}
.table-striped tbody tr:nth-of-type(odd) {background-color: rgba(0, 0, 0, 0.05);}
.table-hover tbody tr:hover {background: var(--table-hover-color);}

/* line-height */
.line-height-1dot5{line-height: 1.5;}
.line-height-2{line-height: 2;}


.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {position: relative;width: 100%;padding-right: 15px;padding-left: 15px;}

.row {display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px;}
.row-cols-1 > * {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
.row-cols-2 > * {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.row-cols-3 > * {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
.row-cols-4 > * {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.row-cols-5 > * {-ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
.row-cols-6 > * {-ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}

.col {-ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%;}
.col-1 {-ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%;}
.col-2 {-ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}
.col-3 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-4 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
.col-5 {-ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%;}
.col-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-7 {-ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%;}
.col-8 {-ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%;}
.col-9 {-ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}
.col-10 {-ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333%;}
.col-11 {-ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667%;}
.col-12 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}


@media (min-width: 576px) {
    .col-sm-1 {-ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%;}
    .col-sm-2 { -ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;}
    .col-sm-3 {-ms-flex: 0 0 25%; flex: 0 0 25%;max-width: 25%;}
    .col-sm-4 {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;}
    .col-sm-5 {-ms-flex: 0 0 41.666667%;flex: 0 0 41.666667%;max-width: 41.666667%;}
    .col-sm-6 {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;}
    .col-sm-7 {-ms-flex: 0 0 58.333333%;flex: 0 0 58.333333%; max-width: 58.333333%;}
    .col-sm-8 {-ms-flex: 0 0 66.666667%;flex: 0 0 66.666667%;max-width: 66.666667%;}
    .col-sm-9 {-ms-flex: 0 0 75%;flex: 0 0 75%; max-width: 75%;}
    .col-sm-10 {-ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333%;}
    .col-sm-11 {-ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667%;}
    .col-sm-12 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}

    .row-cols-sm-1 > * {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
    .row-cols-sm-2 > * {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
    .row-cols-sm-3 > * {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%; max-width: 33.333333%;}
    .row-cols-sm-4 > * {-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;}
    .row-cols-sm-5 > * {-ms-flex: 0 0 20%;flex: 0 0 20%;max-width: 20%;}
    .row-cols-sm-6 > * {-ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%;max-width: 16.666667%;}
}


@media (min-width: 768px){
    .d-md-block {display: block!important;}
    .d-md-none {display: none!important;}

    .col-md-1 {-ms-flex: 0 0 8.333333%;flex: 0 0 8.333333%;max-width: 8.333333%;}
    .col-md-2 {-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;}
    .col-md-3 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
    .col-md-4 {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%; max-width: 33.333333%;}
    .col-md-5 {-ms-flex: 0 0 41.666667%;flex: 0 0 41.666667%; max-width: 41.666667%;}
    .col-md-6 {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;}
    .col-md-7 {-ms-flex: 0 0 58.333333%;flex: 0 0 58.333333%;max-width: 58.333333%;}
    .col-md-8 {-ms-flex: 0 0 66.666667%;flex: 0 0 66.666667%;max-width: 66.666667%;}
    .col-md-9 {-ms-flex: 0 0 75%; flex: 0 0 75%;max-width: 75%;}
    .col-md-10 {-ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%;max-width: 83.333333%;}
    .col-md-11 {-ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%;max-width: 91.666667%;}
    .col-md-12 {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}

    .row-cols-md-1 > * {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
    .row-cols-md-2 > * {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;}
    .row-cols-md-3 > * {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;}
    .row-cols-md-4 > * {-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;}
    .row-cols-md-5 > * {-ms-flex: 0 0 20%;flex: 0 0 20%;max-width: 20%;}
    .row-cols-md-6 > * {-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%; max-width: 16.666667%;}
}


@media (min-width: 992px) {
    .col-lg-1 {-ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%;max-width: 8.333333%;}
    .col-lg-2 {-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%; max-width: 16.666667%;}
    .col-lg-3 {-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;}
    .col-lg-4 {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;}
    .col-lg-5 {-ms-flex: 0 0 41.666667%;flex: 0 0 41.666667%;max-width: 41.666667%;}
    .col-lg-6 {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;}
    .col-lg-7 {-ms-flex: 0 0 58.333333%;flex: 0 0 58.333333%;max-width: 58.333333%;}
    .col-lg-8 {-ms-flex: 0 0 66.666667%;flex: 0 0 66.666667%;max-width: 66.666667%;}
    .col-lg-9 {-ms-flex: 0 0 75%;flex: 0 0 75%;max-width: 75%;}
    .col-lg-10 {-ms-flex: 0 0 83.333333%;flex: 0 0 83.333333%;max-width: 83.333333%;}
    .col-lg-11 {-ms-flex: 0 0 91.666667%;flex: 0 0 91.666667%;max-width: 91.666667%;}
    .col-lg-12 {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}

    .row-cols-lg-1 > * {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
    .row-cols-lg-2 > * {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;}
    .row-cols-lg-3 > * {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;}
    .row-cols-lg-4 > * {-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;}
    .row-cols-lg-5 > * {-ms-flex: 0 0 20%;flex: 0 0 20%;max-width: 20%;}
    .row-cols-lg-6 > * {-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;}
}


@media (min-width: 1200px) {
    .col-xl-1 {-ms-flex: 0 0 8.333333%;flex: 0 0 8.333333%; max-width: 8.333333%;}
    .col-xl-2 {-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;}
    .col-xl-3 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
    .col-xl-4 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%;max-width: 33.333333%;}
    .col-xl-5 {-ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%;max-width: 41.666667%;}
    .col-xl-6 {-ms-flex: 0 0 50%;flex: 0 0 50%; max-width: 50%;}
    .col-xl-7 {-ms-flex: 0 0 58.333333%;flex: 0 0 58.333333%;max-width: 58.333333%;}
    .col-xl-8 {-ms-flex: 0 0 66.666667%;flex: 0 0 66.666667%;max-width: 66.666667%;}
    .col-xl-9 {-ms-flex: 0 0 75%;flex: 0 0 75%;max-width: 75%;}
    .col-xl-10 {-ms-flex: 0 0 83.333333%;flex: 0 0 83.333333%;max-width: 83.333333%;}
    .col-xl-11 {-ms-flex: 0 0 91.666667%;flex: 0 0 91.666667%;max-width: 91.666667%;}
    .col-xl-12 {-ms-flex: 0 0 100%; flex: 0 0 100%;max-width: 100%;}

    .row-cols-xl-1 > * {-ms-flex: 0 0 100%; flex: 0 0 100%;max-width: 100%;}
    .row-cols-xl-2 > * {-ms-flex: 0 0 50%;  flex: 0 0 50%; max-width: 50%;}
    .row-cols-xl-3 > * {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;}
    .row-cols-xl-4 > * {-ms-flex: 0 0 25%;flex: 0 0 25%; max-width: 25%;}
    .row-cols-xl-5 > * {-ms-flex: 0 0 20%;flex: 0 0 20%; max-width: 20%;}
    .row-cols-xl-6 > * {-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;}
}