@charset "utf-8";
@font-face {
    font-family:'Samsung Sharp Sans';
    font-style:normal;
    font-weight:normal;
    src:url('../fonts/SamsungSharpSans-regular.TTF') format("truetype"),
        url('../fonts/SamsungSharpSans-regular.TTF') format("embedded-opentype");
}
@font-face {
    font-family:'Samsung Sharp Sans';
    font-style:normal;
    font-weight:bold;
    src:url('../fonts/SamsungSharpSans-Bold.eot');
    src:url('../fonts/SamsungSharpSans-Bold.eot?#iefix') format("embedded-opentype"),
        url('../fonts/SamsungSharpSans-Bold.woff2') format("woff2"),
        url('../fonts/SamsungSharpSans-Bold.woff') format("woff"),
        url('../fonts/SamsungSharpSans-Bold.ttf') format("truetype");
}


@font-face {
    font-family:'SamsungOneKorean';
    font-style:normal;
    font-weight:normal;
    src:url('../fonts/SamsungOneKorean-400.eot');
    src:url('../fonts/SamsungOneKorean-400.eot?#iefix') format("embedded-opentype"),
        url('../fonts/SamsungOneKorean-400.woff2') format("woff2"),
        url('../fonts/SamsungOneKorean-400.woff') format("woff"),
        url('../fonts/SamsungOneKorean-400.ttf') format("truetype");
}
@font-face {
    font-family:'SamsungOneKorean';
    font-style:normal;
    font-weight:bold;
    src:url('../fonts/SamsungOneKorean-700.eot');
    src:url('../fonts/SamsungOneKorean-700.eot?#iefix') format("embedded-opentype"),
        url('../fonts/SamsungOneKorean-700.woff2') format("woff2"),
        url('../fonts/SamsungOneKorean-700.woff') format("woff"),
        url('../fonts/SamsungOneKorean-700.ttf') format("truetype");
}


/* common */
*, ::after, ::before { box-sizing:border-box; }
html,body { width:100%; height:100%; margin:0; padding:0; font-size:16px; font-family: 'SamsungOneKorean'}
html, body, div, h1, h2, h3, h4, h5, h6, span, object, iframe,
 p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i, a,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, input, textarea, select,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary, button,
time, mark, audio, video {
    margin:0; padding:0; border:0; outline:0; letter-spacing:-0.02em;
	font-family: 'SamsungOneKorean', Dotum, '돋움', sans-serif;
    vertical-align:baseline; background:transparent;box-sizing: border-box;word-break: normal;
}
.h1, h1 { font-size: 2.5rem;}
.h2, h2 { font-size: 2rem; }
.h3, h3 { font-size: 1.75rem; }
.h4, h4 { font-size: 1.5rem; }
.h5, h5 { font-size: 1.25rem; }
.h6, h6 { font-size: 1.2rem; }

    @media (max-width: 1280px){
        .h1, h1 { font-size: 2.5rem;}
        .h2, h2 { font-size: 2rem; }
        .h3, h3 { font-size: 1.75rem; }
        .h4, h4 { font-size: 1.5rem; }
        .h5, h5 { font-size: 1.25rem; }
        .h6, h6 { font-size: 1.2rem; }
    }

p, dl, ol, ul { margin-top:0px; margin-bottom:1rem; }
ul { list-style: none; margin:0;padding:0;}
ul li, ol li { margin-bottom:5px; }


a { color: #444; text-decoration: none; }
a:hover { color: #007bff; text-decoration: none;}
a, a:hover, a:focus {outline:none; text-decoration: none; cursor: pointer;}


button, input { overflow:visible;}
/*button {margin:0 1px;}*/
textarea { overflow: auto; resize: vertical; }
fieldset { min-width:0; padding:0; margin:0; border:0;}

[type=button],
[type=reset],
[type=submit],
button { -webkit-appearance: button; cursor:pointer;}

[type=button]:disabled,
[type=reset]:disabled,
[type=submit]:disabled,
button:disabled { cursor: not-allowed; pointer-events: none; opacity: 0.6; background:#ccc; border-color:#666; color:#666;}

[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled),
button:not(:disabled) { cursor: pointer; }

input[type=checkbox],
input[type=radio] {box-sizing: border-box; padding: 0; margin:-4px 0 0; margin-top:1px \9; line-height:normal; width:16px; height:16px; vertical-align: middle;}
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: thin solid #0075ff;;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

select[multiple] {height: auto;}

/* file attach */
.input-file { display:inline-block;}
.input-file label { position:relative; cursor:pointer; display:inline-block; vertical-align:middle; overflow:hidden; padding:4px 8px; background:#939393;color:#fff;text-align:center; border-radius:4px; font-size:.85rem; border:1px solid #7e7e7e; line-height:1.5;}
.input-file label:hover {background-color: #7e7e7e; border: 1px solid #666666;}
.input-file label input { position:absolute; width:0; height:0; overflow:hidden;}
.input-file input[type=text], .input-file input[type=file] { vertical-align:middle; display:inline-block;  padding:0; border:none; outline:none; cursor: default; background-color: transparent;}




.checkbox label, .radio label { vertical-align: middle; padding-right:10px;}

img, a img, td input,td select,td img{vertical-align:middle; }

table { border-collapse: collapse; }
table th { white-space: nowrap; }
table th, table td { font-size:14px;}
caption { display:none;}

hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(0, 0, 0, .1); }

b, .b, strong { font-weight: 600;}
label { display:inline-block; }
mark {font-weight: 600; color: inherit; background:0 0;}


/* col size */
.row {display: flex; flex-wrap:wrap; margin-right:-10px; margin-left:-10px;}
[class*="col-"] {position: relative; min-height:1px; float:left; padding-right:10px; padding-left:10px;}
[class*="col-"] .card {margin-bottom:20px;}

/*
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {  position:relative; width:100%; }
.col,
.col-1,
.col-10,
.col-11,
.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-auto { position: relative; float:left; min-height:1px; padding-right: 15px;  padding-left: 15px; }
.col { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; }
.col-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; 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%; }
*/

/*
.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; }
*/

.col {
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%; }

.col-auto {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: auto;
  max-width: 100%; }

.col-1 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 8.33333%;
  flex: 0 0 8.33333%;
  max-width: 8.33333%; }

.col-2 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 16.66667%;
  flex: 0 0 16.66667%;
  max-width: 16.66667%; }

.col-3 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%; }

.col-4 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 33.33333%;
  flex: 0 0 33.33333%;
  max-width: 33.33333%; }

.col-5 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 41.66667%;
  flex: 0 0 41.66667%;
  max-width: 41.66667%; }

.col-6 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%; }

.col-7 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 58.33333%;
  flex: 0 0 58.33333%;
  max-width: 58.33333%; }

.col-8 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 66.66667%;
  flex: 0 0 66.66667%;
  max-width: 66.66667%; }

.col-9 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%; }

.col-10 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 83.33333%;
  flex: 0 0 83.33333%;
  max-width: 83.33333%; }

.col-11 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 91.66667%;
  flex: 0 0 91.66667%;
  max-width: 91.66667%; }

.col-12 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%; }

.order-first {
  -webkit-box-ordinal-group: 0;
  -ms-flex-order: -1;
  order: -1; }

.order-last {
  -webkit-box-ordinal-group: 14;
  -ms-flex-order: 13;
  order: 13; }

.order-0 {
  -webkit-box-ordinal-group: 1;
  -ms-flex-order: 0;
  order: 0; }

.order-1 {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1; }

.order-2 {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2; }

.order-3 {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3; }

.order-4 {
  -webkit-box-ordinal-group: 5;
  -ms-flex-order: 4;
  order: 4; }

.order-5 {
  -webkit-box-ordinal-group: 6;
  -ms-flex-order: 5;
  order: 5; }

.order-6 {
  -webkit-box-ordinal-group: 7;
  -ms-flex-order: 6;
  order: 6; }

.order-7 {
  -webkit-box-ordinal-group: 8;
  -ms-flex-order: 7;
  order: 7; }

.order-8 {
  -webkit-box-ordinal-group: 9;
  -ms-flex-order: 8;
  order: 8; }

.order-9 {
  -webkit-box-ordinal-group: 10;
  -ms-flex-order: 9;
  order: 9; }

.order-10 {
  -webkit-box-ordinal-group: 11;
  -ms-flex-order: 10;
  order: 10; }

.order-11 {
  -webkit-box-ordinal-group: 12;
  -ms-flex-order: 11;
  order: 11; }

.order-12 {
  -webkit-box-ordinal-group: 13;
  -ms-flex-order: 12;
  order: 12; }

.offset-1 {
  margin-left: 8.33333%; }

.offset-2 {
  margin-left: 16.66667%; }

.offset-3 {
  margin-left: 25%; }

.offset-4 {
  margin-left: 33.33333%; }

.offset-5 {
  margin-left: 41.66667%; }

.offset-6 {
  margin-left: 50%; }

.offset-7 {
  margin-left: 58.33333%; }

.offset-8 {
  margin-left: 66.66667%; }

.offset-9 {
  margin-left: 75%; }

.offset-10 {
  margin-left: 83.33333%; }

.offset-11 {
  margin-left: 91.66667%; }

@media (min-width: 576px) {
  .col-sm {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%; }
  .col-sm-auto {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%; }
  .col-sm-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%; }
  .col-sm-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%; }
  .col-sm-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
  .col-sm-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%; }
  .col-sm-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    max-width: 41.66667%; }
  .col-sm-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .col-sm-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    max-width: 58.33333%; }
  .col-sm-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    max-width: 66.66667%; }
  .col-sm-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%; }
  .col-sm-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    max-width: 83.33333%; }
  .col-sm-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    max-width: 91.66667%; }
  .col-sm-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
  .order-sm-first {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1; }
  .order-sm-last {
    -webkit-box-ordinal-group: 14;
    -ms-flex-order: 13;
    order: 13; }
  .order-sm-0 {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0; }
  .order-sm-1 {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1; }
  .order-sm-2 {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2; }
  .order-sm-3 {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3; }
  .order-sm-4 {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4; }
  .order-sm-5 {
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5; }
  .order-sm-6 {
    -webkit-box-ordinal-group: 7;
    -ms-flex-order: 6;
    order: 6; }
  .order-sm-7 {
    -webkit-box-ordinal-group: 8;
    -ms-flex-order: 7;
    order: 7; }
  .order-sm-8 {
    -webkit-box-ordinal-group: 9;
    -ms-flex-order: 8;
    order: 8; }
  .order-sm-9 {
    -webkit-box-ordinal-group: 10;
    -ms-flex-order: 9;
    order: 9; }
  .order-sm-10 {
    -webkit-box-ordinal-group: 11;
    -ms-flex-order: 10;
    order: 10; }
  .order-sm-11 {
    -webkit-box-ordinal-group: 12;
    -ms-flex-order: 11;
    order: 11; }
  .order-sm-12 {
    -webkit-box-ordinal-group: 13;
    -ms-flex-order: 12;
    order: 12; }
  .offset-sm-0 {
    margin-left: 0; }
  .offset-sm-1 {
    margin-left: 8.33333%; }
  .offset-sm-2 {
    margin-left: 16.66667%; }
  .offset-sm-3 {
    margin-left: 25%; }
  .offset-sm-4 {
    margin-left: 33.33333%; }
  .offset-sm-5 {
    margin-left: 41.66667%; }
  .offset-sm-6 {
    margin-left: 50%; }
  .offset-sm-7 {
    margin-left: 58.33333%; }
  .offset-sm-8 {
    margin-left: 66.66667%; }
  .offset-sm-9 {
    margin-left: 75%; }
  .offset-sm-10 {
    margin-left: 83.33333%; }
  .offset-sm-11 {
    margin-left: 91.66667%; } }

@media (min-width: 768px) {
  .col-md {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%; }
  .col-md-auto {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%; }
  .col-md-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%; }
  .col-md-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%; }
  .col-md-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
  .col-md-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%; }
  .col-md-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    max-width: 41.66667%; }
  .col-md-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .col-md-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    max-width: 58.33333%; }
  .col-md-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    max-width: 66.66667%; }
  .col-md-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%; }
  .col-md-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    max-width: 83.33333%; }
  .col-md-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    max-width: 91.66667%; }
  .col-md-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
  .order-md-first {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1; }
  .order-md-last {
    -webkit-box-ordinal-group: 14;
    -ms-flex-order: 13;
    order: 13; }
  .order-md-0 {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0; }
  .order-md-1 {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1; }
  .order-md-2 {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2; }
  .order-md-3 {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3; }
  .order-md-4 {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4; }
  .order-md-5 {
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5; }
  .order-md-6 {
    -webkit-box-ordinal-group: 7;
    -ms-flex-order: 6;
    order: 6; }
  .order-md-7 {
    -webkit-box-ordinal-group: 8;
    -ms-flex-order: 7;
    order: 7; }
  .order-md-8 {
    -webkit-box-ordinal-group: 9;
    -ms-flex-order: 8;
    order: 8; }
  .order-md-9 {
    -webkit-box-ordinal-group: 10;
    -ms-flex-order: 9;
    order: 9; }
  .order-md-10 {
    -webkit-box-ordinal-group: 11;
    -ms-flex-order: 10;
    order: 10; }
  .order-md-11 {
    -webkit-box-ordinal-group: 12;
    -ms-flex-order: 11;
    order: 11; }
  .order-md-12 {
    -webkit-box-ordinal-group: 13;
    -ms-flex-order: 12;
    order: 12; }
  .offset-md-0 {
    margin-left: 0; }
  .offset-md-1 {
    margin-left: 8.33333%; }
  .offset-md-2 {
    margin-left: 16.66667%; }
  .offset-md-3 {
    margin-left: 25%; }
  .offset-md-4 {
    margin-left: 33.33333%; }
  .offset-md-5 {
    margin-left: 41.66667%; }
  .offset-md-6 {
    margin-left: 50%; }
  .offset-md-7 {
    margin-left: 58.33333%; }
  .offset-md-8 {
    margin-left: 66.66667%; }
  .offset-md-9 {
    margin-left: 75%; }
  .offset-md-10 {
    margin-left: 83.33333%; }
  .offset-md-11 {
    margin-left: 91.66667%; } }

@media (min-width: 768px) {
  .col-lg {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%; }
  .col-lg-auto {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%; }
  .col-lg-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%; }
  .col-lg-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%; }
  .col-lg-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
  .col-lg-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%; }
  .col-lg-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    max-width: 41.66667%; }
  .col-lg-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .col-lg-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    max-width: 58.33333%; }
  .col-lg-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    max-width: 66.66667%; }
  .col-lg-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%; }
  .col-lg-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    max-width: 83.33333%; }
  .col-lg-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    max-width: 91.66667%; }
  .col-lg-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
  .order-lg-first {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1; }
  .order-lg-last {
    -webkit-box-ordinal-group: 14;
    -ms-flex-order: 13;
    order: 13; }
  .order-lg-0 {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0; }
  .order-lg-1 {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1; }
  .order-lg-2 {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2; }
  .order-lg-3 {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3; }
  .order-lg-4 {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4; }
  .order-lg-5 {
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5; }
  .order-lg-6 {
    -webkit-box-ordinal-group: 7;
    -ms-flex-order: 6;
    order: 6; }
  .order-lg-7 {
    -webkit-box-ordinal-group: 8;
    -ms-flex-order: 7;
    order: 7; }
  .order-lg-8 {
    -webkit-box-ordinal-group: 9;
    -ms-flex-order: 8;
    order: 8; }
  .order-lg-9 {
    -webkit-box-ordinal-group: 10;
    -ms-flex-order: 9;
    order: 9; }
  .order-lg-10 {
    -webkit-box-ordinal-group: 11;
    -ms-flex-order: 10;
    order: 10; }
  .order-lg-11 {
    -webkit-box-ordinal-group: 12;
    -ms-flex-order: 11;
    order: 11; }
  .order-lg-12 {
    -webkit-box-ordinal-group: 13;
    -ms-flex-order: 12;
    order: 12; }
  .offset-lg-0 {
    margin-left: 0; }
  .offset-lg-1 {
    margin-left: 8.33333%; }
  .offset-lg-2 {
    margin-left: 16.66667%; }
  .offset-lg-3 {
    margin-left: 25%; }
  .offset-lg-4 {
    margin-left: 33.33333%; }
  .offset-lg-5 {
    margin-left: 41.66667%; }
  .offset-lg-6 {
    margin-left: 50%; }
  .offset-lg-7 {
    margin-left: 58.33333%; }
  .offset-lg-8 {
    margin-left: 66.66667%; }
  .offset-lg-9 {
    margin-left: 75%; }
  .offset-lg-10 {
    margin-left: 83.33333%; }
  .offset-lg-11 {
    margin-left: 91.66667%; } }

@media (min-width: 1024px) {
  .col-xl {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%; }
  .col-xl-auto {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%; }
  .col-xl-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%; }
  .col-xl-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%; }
  .col-xl-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
  .col-xl-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%; }
  .col-xl-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    max-width: 41.66667%; }
  .col-xl-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .col-xl-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    max-width: 58.33333%; }
  .col-xl-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    max-width: 66.66667%; }
  .col-xl-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%; }
  .col-xl-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    max-width: 83.33333%; }
  .col-xl-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    max-width: 91.66667%; }
  .col-xl-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
  .order-xl-first {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1; }
  .order-xl-last {
    -webkit-box-ordinal-group: 14;
    -ms-flex-order: 13;
    order: 13; }
  .order-xl-0 {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0; }
  .order-xl-1 {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1; }
  .order-xl-2 {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2; }
  .order-xl-3 {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3; }
  .order-xl-4 {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4; }
  .order-xl-5 {
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5; }
  .order-xl-6 {
    -webkit-box-ordinal-group: 7;
    -ms-flex-order: 6;
    order: 6; }
  .order-xl-7 {
    -webkit-box-ordinal-group: 8;
    -ms-flex-order: 7;
    order: 7; }
  .order-xl-8 {
    -webkit-box-ordinal-group: 9;
    -ms-flex-order: 8;
    order: 8; }
  .order-xl-9 {
    -webkit-box-ordinal-group: 10;
    -ms-flex-order: 9;
    order: 9; }
  .order-xl-10 {
    -webkit-box-ordinal-group: 11;
    -ms-flex-order: 10;
    order: 10; }
  .order-xl-11 {
    -webkit-box-ordinal-group: 12;
    -ms-flex-order: 11;
    order: 11; }
  .order-xl-12 {
    -webkit-box-ordinal-group: 13;
    -ms-flex-order: 12;
    order: 12; }
  .offset-xl-0 {
    margin-left: 0; }
  .offset-xl-1 {
    margin-left: 8.33333%; }
  .offset-xl-2 {
    margin-left: 16.66667%; }
  .offset-xl-3 {
    margin-left: 25%; }
  .offset-xl-4 {
    margin-left: 33.33333%; }
  .offset-xl-5 {
    margin-left: 41.66667%; }
  .offset-xl-6 {
    margin-left: 50%; }
  .offset-xl-7 {
    margin-left: 58.33333%; }
  .offset-xl-8 {
    margin-left: 66.66667%; }
  .offset-xl-9 {
    margin-left: 75%; }
  .offset-xl-10 {
    margin-left: 83.33333%; }
  .offset-xl-11 {
    margin-left: 91.66667%; } }

.show-grid [class^="col-"] { padding-top: 10px; padding-bottom: 10px; border: 1px solid #ddd; background-color: #f7f7f7 !important;}

/* space */
.mx-auto { margin:0 auto !important;}
.ml-auto { margin-left:auto !important; }
.mr-auto { margin-right:auto !important;}
.ml-auto::after, .mr-auto::after { content: ""; display:block;}

.space-s { margin-top:5px;}
.space-m { margin-top:15px;}
.space-l { margin-top:20px;}
.space-xl { margin-top:30px;}

/* padding */
.p-t-s { padding-top:5px!important;}
.p-b-s { padding-bottom:5px!important;}
.p-r-s { padding-right:5px!important;}
.p-l-s { padding-left:5px!important;}

.p-t-m { padding-top:10px!important;}
.p-b-m { padding-bottom:10px!important;}
.p-r-m { padding-right:10px!important;}
.p-l-m { padding-left:10px!important;}

.p-t-l { padding-top:15px!important;}
.p-b-l { padding-bottom:15px!important;}
.p-r-l { padding-right:15px!important;}
.p-l-l { padding-left:15px!important;}

.p-b-xl { padding-bottom:20px!important;}

.p-all-s { padding:5px !important;}
.p-all-m { padding:10px !important;}
.p-all-l { padding:15px !important;}
.p-all-xl { padding:20px !important;}

.m-r-xs { margin-right:6px!important;}
.m-r-s { margin-right:10px!important;}
.m-r-m { margin-right:15px!important;}
.m-r-l { margin-right:20px!important;}

.m-l-xs { margin-left:6px!important;}
.m-l-s { margin-left:10px!important;}
.m-l-m { margin-left:15px!important;}
.m-l-l { margin-left:20px!important;}

.m-t-s { margin-top:5px!important;}
.m-t-m { margin-top:10px!important;}
.m-t-l { margin-top:15px!important;}

.m-b-xs { margin-bottom:3px!important;}
.m-b-s { margin-bottom:5px!important;}
.m-b-m { margin-bottom:10px!important;}
.m-b-l { margin-bottom:15px!important;}


.no-margin { margin:0px !important;}
.no-padding { padding:0px !important;}
.no-border { border:none !important;}
.no-wrap { white-space:nowrap !important;}
.no-resize {resize:none !important;}
.w-100 { width:100% !important;}
.h-100 { height:100% !important;}
.max-w-100 {max-width:100%;}

/* block */
.dp-flex { display:flex !important; display: -ms-flexbox !important; display: -webkit-flex !important;  align-items: center;}
.dp-inflex {display: inline-flex;}
.dp-block { display:block !important;}
.dp-inline { display:inline !important;}
.dp-inblock { display:inline-block !important;}
.dp-table { display:table !important;}

.dp-flex h6 { padding-top:7px;} /* sub title */

/*float*/
.f-right{float: right;}
.f-left{float: left;}

/* overflow */
.overflow-auto{overflow: auto;}
.overflow-auto-x{overflow-x: auto; overflow-y:hidden;}
.overflow-auto-y{overflow-y: auto; overflow-x:hidden;}

/* align */
.align-left { text-align:left !important;}
.align-center { text-align:center !important;}
.align-right { text-align:right !important;}

.vertical-top {vertical-align: top !important; align-items: flex-start !important;}
.vertical-ttop {vertical-align: text-top!important; align-items: flex-start !important;}
.vertical-center {vertical-align: middle !important; align-items: center !important;}
.vertical-bottom {vertical-align: bottom !important; align-items: flex-end !important;}

.flex-column {flex-direction: column;}
.flex-around {justify-content: space-around;}
.flex-between {justify-content: space-between;}

/* GNB 퀵메뉴관리팝업에서 쓰임 */
.flex-equal {display: flex; align-items: stretch; justify-content: space-around; width:100%;}
.flex-equal > div:last-child {margin-right:0;}

/* flex-align */
.flex-center {justify-content: center !important;}
.flex-end {justify-content: flex-end;}

/* flex-rate */
.no-flex {flex:none !important;}
.flex-1 {flex:1 !important;}
.flex-1_5 {flex:1.5 !important;}
.flex-2 {flex:2 !important;}
.flex-2_5 {flex:2.5 !important;}
.flex-3 {flex:3 !important;}

/* flex-shrink */
.flex-shrink-0 {flex-shrink: 0;}

/* font style */
.ft-red { color:#d92550;}
.ft-realred { color : red; }
.ft-blue { color:#2d99fb;}
.ft-darkblue { color:#000e68;}
.ft-darkblue_ver2 {
    color: #000E68;
    font-size: 25px;
    margin-bottom: 20px;
    font-weight:bold;
}
.ft-green { color:#00a126;}
.ft-purple { color:#6a4ff6;}
.ft-gray { color:#939393;}
.ft-darkgray { color:#666666;}
.ft-feela { color:#d32e5e;}
.ft-black { color:#000;}
.ft-orange {color:orange;}
.ft-yellow {color:yellow;}
.ft-lightgreen {color:#3ee2ba;}
.ft-white {color:#fff !important;}
.ft-pink{ color:#fe7998;}
.ft-navy{ color:#1a0dab;}


/* font family */
.ft-notosans {font-family:'Noto Sans KR', sans-serif, 'segoe UI', 'malgun gothic', sans-serif, '돋움','dotum','굴림';}

b.ft-notosans, .b.ft-notosans, strong.ft-notosans { font-weight:500; }

.h1.ft-notosans, h1.ft-notosans { font-weight:500; }
.h2.ft-notosans, h2.ft-notosans { font-weight:500; }
.h3.ft-notosans, h3.ft-notosans { font-weight:500; }
.h4.ft-notosans, h4.ft-notosans { font-weight:500; }
.h5.ft-notosans, h5.ft-notosans { font-weight:500; }
.h6.ft-notosans, h6.ft-notosans { font-weight:500; }

/* font weight */
.ft-100 {font-weight:100;}
.ft-200 {font-weight:200;}
.ft-300 {font-weight:300;}
.ft-400 {font-weight:400;}
.ft-500 {font-weight:500;} /* 노토산스 볼드 ex) b.ft-notosans */
.ft-600 {font-weight:600;} /* 기본폰트 볼드 ex) b */
.ft-700 {font-weight:700;}
.ft-800 {font-weight:800;}
.ft-900 {font-weight:900;}


/* font size */
.ft-basic { font-size:1rem;}

.ft-xs { font-size:.7rem;}
.ft-s { font-size:.8rem;}
.ft-m { font-size:.9rem;}
.ft-l { font-size:1.1rem;}
.ft-xl{font-size: 2rem;}
.new { display:inline-block;color:red; font-weight:700; font-size:13px; }

.bg-red { background: rgba(252,96,127,0.2); color: #fb607f;}
.bg-blue { background: rgba(45,153,241,0.2); color: #2d99fb;}
.bg-skyblue { background: #4ccaff; color: #fff;}
.bg-green { background: rgba(35,214,146,0.2); color: #00a126;}
.bg-purple { background: rgba(217,210,250,0.2); color: #6a4ff6;}
.bg-gray { background: rgba(225,225,225,0.2); color: #939393;}
.bg-darkgray { background: rgba(0,0,0,0.25); color: #fff;}
.bg-yellow { background: rgba(255,162,0,0.2); color: #ffa200;}
.bg-white {background:#fff !important;}
.bg-pattern {background: repeating-linear-gradient(-45deg, #f3f3f3, #f3f3f3 2px, #fff 0, #fff 7px) !important;}
.bg-transparent {background:transparent !important;}

.bdr-all {
    border-width: 1px 1px 1px 1px;
    border-style: solid;
}
.bdr-all-cursor {border-width:1px 1px 1px 1px; border-style:solid;cursor:pointer; }
.bdr-top {border-width:1px 0 0 0; border-style:solid;}
.bdr-bottom {border-width:0 0 1px 0; border-style:solid;}
.bdr-topbottom {border-width:1px 0 1px 0; border-style:solid;}
.bdr-gray {border-color:#ddd;}
.bdr-darkgray {border-color:#bbb;}
.bdr-blue {border-color:#2d99fb;}
.bdr-lightblue {border-color:rgba(45,153,241,0.4);}

.radius-100 {border-radius:100px;}
.radius-10 {border-radius:10px;}
.radius-4 {border-radius:4px;}

/* bg box */
[class*="box-"] { padding:10px;}
.box-blue { background:#f1f6fc; }
.box-green { background:#eef8f6; }
.box-purple { background:#f7f6fe; }
.box-gray { background:#f7f7f7 !important;}
.box-red {
    background: #def2fd;
}
.box-outline { border:1px solid #ddd;}
.box-feela { background:rgba(210,56,108,1); color:#fff !important; border-radius:10px 0;  }

/* letter-space */
.letter-space-m {letter-spacing: 1px;}

/* list style */
.circle { list-style:circle; }
.square { list-style:square;}
ol.lower {list-style-type: lower-alpha;}

/* ui - ellipsis */
.ellipsis {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap;
}

.ellipsis {
    table-layout: fixed;
}

    .ellipsis td {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

/* modal */
.modal {position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgb(0,0,0); background-color:rgba(0,0,0,0.4); z-index:99999; }
.scroll-disabled {height:100%; min-height:100%; overflow:hidden !important; touch-action:none;}

/* modal-inline */
.modal-wrap {display:table; table-layout: fixed; width:100%; height:100%; }
.modal-inner {  table-layout: fixed; display:table-cell; vertical-align: middle; text-align:center; }
.modal-content {position:relative; display:inline-block; background-color:#fff; padding:20px; border-radius: 5px; }

/* modal-flex */
.modal-flex { display:flex; display: -ms-flexbox; display: -webkit-flex; height:100vh; justify-content: center; align-items: center; }
.modal-flex-content { background:#fff; padding:20px; border-radius: 5px; max-width:90%; max-height:90vh; overflow:auto;}
.modal span>i { font-size:18px;}


/* snackbar */
.snackbar {position: fixed; left:0; bottom:40px; width: 100%; display:flex; display: -ms-flexbox; display: -webkit-flex; justify-content: center; align-items: center;}

.snackbar {
    animation: snack-fadeout 2s;
    -moz-animation: snack-fadeout 2s; /* Firefox */
    -webkit-animation: snack-fadeout 2s; /* Safari and Chrome */
    -o-animation: snack-fadeout 2s; /* Opera */
    animation-fill-mode: forwards;
}

@keyframes snack-fadeout {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    75% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.snackbar .inner {background:rgba(0,0,0,.5); border-radius:100px; padding:10px 25px; display:flex; display: -ms-flexbox; display: -webkit-flex; justify-content: center; align-items: center; z-index:999;}


/* gnbNav */
#gnbNav{ position:fixed; top:0; width:100%; z-index:1;  }
#gnbNav nav { padding:.5rem 2rem;}
#nav-top { flex-grow:1; align-items: center;}
.navbar { position:relative; display:flex; align-items:center; flex-grow:1; background:rgba(255,255,255,0.85) }
.navbar .nav-logo { display:inline-block; margin-right:1rem; font-size:1.25rem; font-weight:500;}
.navbar-nav { display:flex; display:-ms-flexbox; -ms-flex-direction: row; flex-direction: row; padding-left: 0; margin-bottom: 0; font-size:1.2rem;}
.navbar-nav li .nav-link { display:block;  padding:.5rem 1rem; }
#gnbNav-placeholder { height:70px;}


/* ux-guide 관련 CSS - 프로젝트시는 삭제 */
/* ux-preview */
.ux-preview { padding:30px;}
.ux-item { flex:1 1 auto; display:inline-block; min-width:400px; width:auto;  cursor:pointer; padding:10px; margin:10px; border:1px solid #ddd; vertical-align: top;}
.ux-item-preview {  padding:10px;  }
.ux-preview  .name, .ux-item .name { display:inline-block; padding:8px;font-size:1.3rem; overflow:hidden; width:100%; background:#f7f7f7; white-space:nowrap; text-overflow:ellipsis; margin-top:10px; text-align: center;}
.ux-preview  .name:hover, .ux-item .name:hover { background:#ccc; color:#fff; text-decoration: none;}
.ux-preview>.box-blue>ul { padding-left:40px;}
.pt-50 { padding-top:50px;}
.pd-20 { padding:20px;}

#pop-preview { padding:10px;}
#pop-preview span { display:block;position:absolute; right:0; background:rgba(0,0,0,0.3);  color:#fff; border-radius: 3px; margin:10px; padding:0.5em 1em; line-height:1em; font-size:0.875em; font-weight:500; margin-bottom:30px; }
#pop-preview textarea { font-family:sans-serif; font-size:1.2rem; width:100%; border:none; display:block; padding:10px; border-bottom:1px solid #ddd !important; overflow:auto; resize: vertical;}

/* error page */
.wrapper-error h1 { font-weight:600; color:#3853d8; font-size:48px;}
.wrapper-error h2 { font-size:48px;  color:#8c8c8c;}
.wrapper-error .error-content { font-weight:100; padding-top:10px;    color:#8c8c8c;   font-size:24px;}
.wrapper-error > div{  box-sizing:border-box; text-align:center;}
[class*='error-bg'] { color:#525252; display:flex; height:100vh; flex-direction: column; justify-content: center;  background-size:contain;    width:auto;}
.error-bg-401 { background:url('../images/401.png')50% 30% no-repeat; }
.error-bg-403 { background:url('../images/403.png')50% 30% no-repeat; }
.error-bg-404 { background:url('../images/404.png')50% 30% no-repeat; }
.error-bg-500 { background:url('../images/500.png')50% 30% no-repeat; }


.icon-list { margin:0; padding:10px; font-size:1.5rem;}
.icon-list li { display:inline-block; margin-right:40px; margin-bottom:40px; width:300px;}
.icon-list li span { margin-left:20px; font-weight:300;}

/* display media query */
@media (max-width: 1280px){
    .display-tablet {display: block;}
    .part-weather .display-tablet {display: none;}
    .display-pc {display:none;}
    
}
@media (min-width: 1281px){
    .display-tablet {display: none;}
    .display-pc {display:block;}
    
}