@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Arimo:wght@400;700&family=Montserrat:wght@100;200;300;400;500;600;700;800;900&family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&family=Barlow:wght@100;400;600;700;800&display=swap');


html {overflow-x:hidden; width:100%; height:100% }
body { font-family:'Barlow', sans-serif; font-size:100%;letter-spacing:0 }
label { cursor:pointer}
a:link, a:visited { text-decoration:none;}
a:hover, a:focus, a:active { text-decoration:underline}

a, abbr, acronym, address, applet, article, aside, audio,
b, blockquote, big, body,
center, canvas, caption, cite, code, command,
datalist, dd, del, details, dfn, dl, div, dt, 
em, embed,
fieldset, figcaption, figure, font, footer, form, 
h1, h2, h3, h4, h5, h6, header, hgroup, html,
i, iframe, img, ins,
kbd, 
keygen,
label, legend, li, 
meter,
nav, menu,
object, ol, output,
p, pre, progress,
q, 
s, samp, section, small, span, source, strike, strong, sub, sup,
table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul, 
var { margin:0; padding:0}

h1, h2, h3, h4, h5, h6, th, td, table, input, button, select, textarea, sub{ font-size:1em}
body, input, button, select, textarea, sub{}
em, cite, address, optgroup { font-style:normal}
kbd, samp, code { font-family:monospace}


img, input, button, select, textarea { vertical-align:middle}
ul, ol { list-style:none}
img, fieldset { border:0}
abbr, acronym { cursor:help; border-bottom:1px dotted black}
table {	width:100%;  border-spacing:0}/* border-collapse: collapse; ff에서 border="0" 인 경우 문제 발생 */

legend, hr { overflow:hidden; position:absolute; top:0; left:0}
legend, hr, caption { visibility:hidden; font-size:0; width:0; height:0; line-height:0}

* {box-sizing:border-box; font-family:'Barlow', sans-serif; word-break: keep-all;}

/* Html5 Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block}
mark, rp, rt, ruby, summary, time{ display: inline }
 
A:link {text-decoration:none;color: #666;font-size: 12px;letter-spacing:0;font-weight: normal;}
A:visited {text-decoration:none;color: #666;font-size: 12px;letter-spacing:0;font-weight: normal;}
A:active {text-decoration:none;color: #222;font-size: 12px;letter-spacing:0;font-weight: normal;}
A:hover {text-decoration:none;color: #222;font-size: 12px;letter-spacing:0;font-weight: normal;}

a.accessibility01 {position:absolute; display:block; width:100%; left:0; text-align:center; top:-10000px; z-index:500; font-size:1.3em}
a.accessibility01:hover, a.accessibility01:focus, a.accessibility01:active {position: absolute; top:0; padding: 15px 0; font-weight:bold; color:#fff; background:#1d60a7; z-index:500}

/* skip navi */
.accessibility02 { position:absolute; top:0; display:block; left:0; width:199px; z-index:1; visibility:hidden; }
.accessibility02 a { display:block; height:19px; text-indent:-5000px; overflow:hidden}


/* hidden */
.hidden, #contents .hidden { visibility:hidden; position:absolute; font-size:0; width:0; height:0; line-height:0; margin:0; padding:0; background:none }

/* input */
.inp_st1 { border:1px solid #d7d7d7; background:#fff; padding:7px 11px 8px 10px; color:#555; font-size:1.05em }
.inp_st2 { border:1px solid #eaeaea; background:#fff; padding:5px 10px 7px 8px; color:#555; font-size:1.0em }
.inp_st3 { border:1px solid #d7d7d7; background:#fff; padding:7px 10px 8px 8px; color:#888; font-size:1.1em }
.sel_st1 { padding:5px 5px 7px 5px; border:1px solid #4a4b4f }
.sel_st2 { padding:5px 5px 7px 5px; border:1px solid #d7d7d7 }

/* with */
.w_40{ width:40px!important;}
.w_45{ width:45px!important;}
.w_60{ width:60px!important;}
.w_63{ width:63px!important;}
.w_80{ width:80px!important;}
.w_90{ width:88px!important;}
.w_110{ width:110px!important;}
.w_124{ width:120px!important;}
.w_142{ width:142px!important;}
.w_150{ width:156px!important;}
.w_164{ width:164px!important;}
.w_180{ width:180px!important;}
.w_240{ width:220px!important;}
.w_400{ width:400px!important;}
.w_500{ width:494px!important;}
.w_550{ width:550px!important;}
.w_700{ width:700px!important;}
.w_31_3p{ width:31.3333333%!important;}
.w_28p{ width:28%!important;}
.w_48p{ width:48%!important;}
.w_49p{ width:49%!important;}
.w_70p{ width:70%!important;}
.w_100p{ width:100%!important;}
.h_50{ height:50px!important;}
.h_70{ height:70px!important;}
.h_100{ height:100px!important;}
.h_200{ height:200px!important;}
.h_250{ height:250px!important;}
.h_350{ height:350px!important;}

/* align */
.t_alc { text-align:center }
.t_alr { text-align:right }

/* margin */
.mt_0 { margin-top:0px!important; }
.mt_3 { margin-top:3px }
.mt_5 { margin-top:5px }
.mt_7 { margin-top:7px }
.mt_10 { margin-top:10px }
.mt_12 { margin-top:12px }
.mt_15 { margin-top:15px }
.mt_17 { margin-top:17px }
.mt_20 { margin-top:20px!important; }
.mt_21 { margin-top:21px!important; }
.mt_24 { margin-top:24px }
.mt_25 { margin-top:25px }
.mt_30 { margin-top:30px }
.mt_35 { margin-top:35px }
.mt_37 { margin-top:37px }
.mt_40 { margin-top:40px }
.mt_44 { margin-top:44px }
.mt_50 { margin-top:50px }
.mt_55 { margin-top:55px }
.mt_70 { margin-top:70px }
.mt_80 { margin-top:80px }
.mt_2p{ margin-top:2% }
.mt_100 { margin-top:100px }
.mt_410 { margin-top:410px }
.mr_5 { margin-right:5px }
.mr_21 { margin-right:21px }
.mr_38 { margin-right:38px }
.mr_2p { margin-right:2% }
.ml2 { margin-left:2px }
.ml4 { margin-left:4px }
.ml10 { margin-left:10px }
.ml20 { margin-left:20px }
.ml_50 { margin-left:50px }
.ml_57 { margin-left:57px }
.mrl_26 { margin-right:26px; margin-left:26px }
.mrl_50 { margin-right:50px; margin-left:50px }
.mb_20 { margin-bottom:20px!important; }
.pt_69 { padding-top:69px!important; }

 

@font-face {
    font-family: 'notokr-black';
    src: url('/font/notokr-black.eot');
    src: url('/font/notokr-black.eot?#iefix') format('embedded-opentype'),
         url('/font/notokr-black.woff2') format('woff2'),
         url('/font/notokr-black.woff') format('woff'),
         url('/font/notokr-black.ttf') format('truetype'),
         url('/font/notokr-black.svg#notokr-black') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'notokr-bold';
    src: url('/font/notokr-bold.eot');
    src: url('/font/notokr-bold.eot?#iefix') format('embedded-opentype'),
         url('/font/notokr-bold.woff2') format('woff2'),
         url('/font/notokr-bold.woff') format('woff'),
         url('/font/notokr-bold.ttf') format('truetype'),
         url('/font/notokr-bold.svg#notokr-bold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'notokr-medium';
    src: url('/font/notokr-medium.eot');
    src: url('/font/notokr-medium.eot?#iefix') format('embedded-opentype'),
         url('/font/notokr-medium.woff2') format('woff2'),
         url('/font/notokr-medium.woff') format('woff'),
         url('/font/notokr-medium.ttf') format('truetype'),
         url('/font/notokr-medium.svg#notokr-medium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'notokr-regular';
    src: url('/font/notokr-regular.eot');
    src: url('/font/notokr-regular.eot?#iefix') format('embedded-opentype'),
         url('/font/notokr-regular.woff2') format('woff2'),
         url('/font/notokr-regular.woff') format('woff'),
         url('/font/notokr-regular.ttf') format('truetype'),
         url('/font/notokr-regular.svg#notokr-regular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'notokr-demilight';
    src: url('/font/notokr-demilight.eot');
    src: url('/font/notokr-demilight.eot?#iefix') format('embedded-opentype'),
         url('/font/notokr-demilight.woff2') format('woff2'),
         url('/font/notokr-demilight.woff') format('woff'),
         url('/font/notokr-demilight.ttf') format('truetype'),
         url('/font/notokr-demilight.svg#notokr-demilight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'notokr-light';
    src: url('/font/notokr-light.eot');
    src: url('/font/notokr-light.eot?#iefix') format('embedded-opentype'),
         url('/font/notokr-light.woff2') format('woff2'),
         url('/font/notokr-light.woff') format('woff'),
         url('/font/notokr-light.ttf') format('truetype'),
         url('/font/notokr-light.svg#notokr-light') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'notokr-thin';
    src: url('/font/notokr-thin.eot');
    src: url('/font/notokr-thin.eot?#iefix') format('embedded-opentype'),
         url('/font/notokr-thin.woff2') format('woff2'),
         url('/font/notokr-thin.woff') format('woff'),
         url('/font/notokr-thin.ttf') format('truetype'),
         url('/font/notokr-thin.svg#notokr-thin') format('svg');
    font-weight: normal;
    font-style: normal;

}

