@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 100;src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');}
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 300;src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');}
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 500;src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');}
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 700;src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');}

html, body {display: block; height: 100%; width: 100%; line-height: 1em; font-family:'Noto Sans', 'Malgun Gothic', sans-serif; font-weight: 300;-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing:antialiased; letter-spacing: -0.035em; word-break: keep-all;}
body, h1, h2, h3, h4, h5, h6, div, p, blockquote, pre, address, ul, ol, li, dl, dt, dd, table, caption, th, td, form, fieldset, legend, hr, label, button {margin:0; padding:0; font-size:15px; font-family:'Noto Sans', 'Malgun Gothic', sans-serif; color: #454753; line-height: 1em;}
ul, ol, dl {list-style:none;}
table {width:100%; margin:0; padding:0; border-spacing:0; border:0; border-collapse:collapse; }
img, button, fieldset, abbr, acronym {border:0}
address, caption, cite, code, dfn, em, var {}
q:before, q:after {content:'';}
body.no_scroll { position: fixed;}

/* 스크롤바 커스텀 */
html * {scrollbar-width: thin;}
html { scrollbar-width: thin; scrollbar-arrow-color: #efefef; scrollbar-Track-Color: #efefef; scrollbar-base-color: #dfdfdf; scrollbar-Face-Color: #dfdfdf; scrollbar-3dLight-Color: #dfdfdf; scrollbar-DarkShadow-Color: #dfdfdf; scrollbar-Highlight-Color: #dfdfdf; scrollbar-Shadow-Color: #dfdfdf; }


/* Chrome, Safari용 스크롤 바 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-button:start:decrement,

/*::-webkit-scrollbar-button:end:increment {display: none; width: 12px;height: 12px; background: url() rgba(0,0,0,.05);}*/
::-webkit-scrollbar-button:end:increment {display: none; width: 12px;height: 12px; background: rgba(0,0,0,.05);}

::-webkit-scrollbar-track { background: rgb(255,255,255); background: #ededed; }
::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(0,0,0,.2); }
:hover::-webkit-scrollbar-thumb {background: rgba(0,0,0,.3)}
​
::-webkit-input-placeholder {color:#b0b0b0}
:-moz-placeholder {color:#b0b0b0}
::-moz-placeholder {color:#b0b0b0}
:-ms-input-placeholder {color:#b0b0b0}

::-webkit-input-placeholder {color:#b0b0b0}
:-moz-placeholder {color:#b0b0b0}
::-moz-placeholder {color:#b0b0b0}
:-ms-input-placeholder {color:#b0b0b0}


/* input */
input[type=checkbox] {width:13px; height:13px}
input[type=radio] {width:13px; height:13px; margin-top:-1px}
label, button  {cursor: pointer; }

a {color:#333; text-decoration:none; transition: color 0.15s ease 0s, background-color 0.15s ease 0s;}
a:focus, a:hover, a:active {color:#000}

a.skip { position: fixed; left: -9999px; top: -9999px; display: block; line-height: 3em; background: #40b2cd; color: #000; text-align: center;z-index: 100;}
a.skip:hover,
a.skip:focus { position: static; left: 0; top: 0; }

.container { margin: 0 auto; position: relative; }
.container:after { display: block; content: ""; clear: both; }

/* commom */
.hidden,
.none { position: fixed; left: -9999px; }

.floatL { float: left }
.floatR { float: right }

/* table*/
div.table,
table.table {border-top: #515151 solid 1px;  clear: both;}
td,th { font-weight:300}
td a,th a { font-weight: 500}
.table caption {}
.table thead th { background: #f2f2f2;padding:14px 8px; border:#ccc solid 1px ; border-top:none; line-height: 1.3em ;text-align: center;}
.table .th { background: #f2f2f2; }
.table tbody th { background: #f5f5f5}
.table tbody th,
.table tbody td { border:#e1e1e0 solid 1px ; padding:6px 8px; background: #fff; line-height: 1.3em; border-top:none;}
.table tbody th,
.table tbody th label { background:#fafafa; color: #777}
.table tbody td[rowspan] {border-left:#e1e1e0 solid 1px}

/* 왼쪽 정렬인 테이블 */
.tableL tbody th,
.tableL tbody td,
.table td.title { text-align: left; }

/* 가운데 정렬인 테이블 */
.tableC tbody th,
.tableC tbody td { text-align: center;}


.textL{ text-align: left !important; }
.textR{ text-align: right !important; }
.textC{ text-align: center !important; }

.table th.check,
.table tbody td.check { width: 34px; padding-left:0; padding-right:0}

.pageNav { text-align: center; position: relative; min-height: 28px; padding: 16px 0; }
.pageNav .pageTotal { color: #aaa; line-height: 2em; position: absolute; left: 0; top: 0; }
.pageNav:after { display: block; content: ""; clear: both; }
.pageNav .paging { font-size: 0; display: inline-block; }
.pageNav .paging a, .pageNav .paging strong { display: inline-block; min-width: 24px; height: 25px; padding: 5px 0 0 0; font-size:15px; opacity: 0.6; color: #777; vertical-align:bottom; line-height: 1.2em; }
.pageNav .paging a.pageFirst, .pageNav .paging a.pageBefore, .pageNav .paging a.pageNext, .pageNav .paging a.pageLast, .pageNav .paging strong.pageFirst, .pageNav .paging strong.pageBefore, .pageNav .paging strong.pageNext, .pageNav .paging strong.pageLast { font-size: 0; background: url(/front/img/paging.png) no-repeat 3px center; }
.pageNav .paging a.pageBefore, .pageNav .paging strong.pageBefore { background-position: -39px center; }
.pageNav .paging a.pageNext, .pageNav .paging strong.pageNext { background-position: -74px center; }
.pageNav .paging a.pageLast, .pageNav .paging strong.pageLast { background-position: -107px center; }
.pageNav .paging a:hover, .pageNav .paging a:focus, .pageNav .paging a.on, .pageNav .paging strong { text-decoration: underline; opacity: 1; }





label.hiddenLabel {font-size: 0 !important}
input[type="checkbox"] + label.hiddenLabel:before { margin: 0 0 0 -20px}

/* select */



/* input */
input[type="button"] { cursor: pointer; }
input[type="text"], input[type="password"], select, .input, textarea {font-size: 15px; border: solid 1px #bcbcbc; border-radius: 2px; background: #fff; padding: 0 8px; margin: 2px; box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
input[type="text"], input[type="password"], select, .input { height: 30px; line-height: 1em; }
textarea {overflow:auto; padding:10px; line-height: 1.3em;font-family:'Noto Sans', 'Malgun Gothic',sans-serif; font-size:15px}
.js-elasticArea {transition: all 0.3s ease 0.0s}
input[type="text"], input[type="password"], select, .input, textarea
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	select {padding: 0  0 0 5px;}
}
select:hover,
select:focus { background-position: right -33px}
input[type="text"]:hover, input[type="password"]:hover, select:hover, .input:hover,
input[type="text"]:focus, input[type="password"]:focus, select:focus, .input:focus { border-color:#40b2cd; }

input[type="text"][readonly], input[type="password"][readonly], select[readonly], .input[readonly], textarea[readonly],
input[type="text"][disabled], input[type="password"][disabled], select[disabled], .input[disabled], textarea[disabled] { background-color:#ddd; color: #999; cursor: default; outline: 0 none}

.input02, .width02 { width: 2% }
.input03, .width03 { width: 3% }
.input04, .width04 { width: 4% }
.input05, .width05 { width: 5% }
.input06, .width06 { width: 6% }
.input07, .width07 { width: 7% }
.input08, .width08 { width: 8% }
.input09, .width09 { width: 9% }
.input10, .width10 { width: 10% }
.input15, .width15 { width: 15% }
.input17, .width17 { width: 17% }
.input20, .width20 { width: 20% }
.input25, .width25 { width: 25% }
.input30, .width30 { width: 30% }
.input35, .width35 { width: 35% }
.input40, .width40 { width: 40% }
.input45, .width45 { width: 45% }
.input50, .width50 { width: 50% }
.input55, .width55 { width: 55% }
.input60, .width60 { width: 60% }
.input65, .width65 { width: 65% }
.input70, .width70 { width: 70% }
.input75, .width75 { width: 75% }
.input80, .width80 { width: 80% }
.input85, .width85 { width: 85% }
.input86, .width86 { width: 86% }
.input87, .width87 { width: 87% }
.input88, .width88 { width: 88% }
.input89, .width89 { width: 89% }
.input90, .width90 { width: 90% }
.input92, .width92 { width: 92% }
.input94, .width94 { width: 94% }
.input95, .width95 { width: 95% }
.input97, .width97 { width: 97% }
.input98, .width98 { width: 98% }
.input99, .width99 { width: 99% }
.input100, .width100 { width: 100% }


.fr{float: right;}
.fl{float: left;}

/* 로딩 이미지 */
.loadingWrap { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.9); z-index: 1000; text-align: center;}
.loadingWrap p { margin-top: 14px; font-weight: 300; font-size:168px; opacity: .8; color: #fff; letter-spacing: 0;}
.loadingWrap #loading { margin-top: 800px;}
#loading { display: inline-block; width: 70px; height: 70px; border: 8px solid rgba(102, 169, 232, 0.534); border-radius: 50%; border-top-color: #fff; animation: spin 1s ease-in-out infinite; -webkit-animation: spin 1s ease-in-out infinite;}
#loading p { font-size:164px; font-weight: 500;}

@keyframes spin {
    to { -webkit-transform: rotate(360deg);}
}
@-webkit-keyframes spin {
    to {-webkit-transform: rotate(360deg);}
}
