@charset "utf-8";



/* @-ms-viewport {width: device-width;}

@-o-viewport {width: device-width;}

@viewport {width: device-width;} */





*, *:before, *:after {

    -webkit-print-color-adjust: exact;

    /* font-family: 'Nanum Gothic','NanumGothic','나눔고딕','나눔 고딕','맑은고딕','맑은 고딕','MalgunGothic','Malgun Gothic','Apple Gothic','Apple SD Gothic Neo','돋움','Dotum','바탕','Batang','sans-serif' */

}



html, body {/* height: 100%; */ background: #e9ecec;}

body {-webkit-text-size-adjust: none; color: #222222; position: relative; font-size: 16px; line-height: 22px;}



html, body, p, img, div, input, textarea, select, button, ul, header, footer, mark, article, ul li, dl, dl dt, dl dd, form, legend, caption, h1, h2, h3, h4, h5, fieldset, label, ol, ol li, xmp {margin: 0; padding: 0; border: 0; list-style-type: none; font-family: 'Nanum Gothic','NanumGothic','나눔고딕','나눔 고딕','맑은고딕','맑은 고딕','MalgunGothic','Malgun Gothic','Apple Gothic','Apple SD Gothic Neo','돋움','Dotum','바탕','Batang','sans-serif';}



a {color: #333333; text-decoration: none;}

a:hover, a:focus {color: #000000;}









html, body {min-width: 320px;}

body {-webkit-font-smoothing: antialiased;}

img {-ms-interpolation-mode: bicubic;} /* IE6,7에서 이미지 작게 보여줄때 생기는 계단현상 해소방법 (nearest-neighbor) */

img, embed, object, video, audio {max-width: 100%;}

th {background: transparent;} /* 크롬에서 노란색 배경으로 나오는걸 막기 위해. 2014.11.19. */

textarea {resize: vertical;/*none*/}



button, input[type=button], input[type=submit], input[type=reset] {overflow: visible;}

table {width: 100%; border-collapse: collapse; border-spacing: 0;}



/* 아이폰용 리셋 */

textarea, button, input[type=button], input[type=submit],

input:not([type]), input[type='text'], input[type='password'], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input

{/*background: url('../img/blank.gif') transparent no-repeat;*/ -webkit-appearance: none; -moz-appearance: none; appearance: none;}

input, textarea, button, /*input[type=button], input[type=submit],*/ select {-webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; border-radius: 0;}

/*select {-webkit-appearance: menu-item; /* menulist-button * / -moz-appearance: menu-item; appearance: menu-item;}*/



/* firefox button 내부 여백 리셋 */

button::-moz-focus-inner,

input[type='reset']::-moz-focus-inner,

input[type='button']::-moz-focus-inner,

input[type='submit']::-moz-focus-inner,

input[type='file'] > input[type='button']::-moz-focus-inner

{padding: 0; border: 0; cursor: pointer;}



/*

input:not([type]), input[type="email" i], input[type="number" i], input[type="password" i], input[type="tel" i], input[type="url" i], input[type="text" i] {

    padding: 1px 0px;

}

input[type="checkbox" i] {

    margin: 3px 3px 3px 4px;

}

input[type="checkbox" i] {

    -webkit-appearance: checkbox;

    box-sizing: border-box;

}

input[type="radio" i], input[type="checkbox" i] {

    margin: 3px 0.5ex;

    padding: initial;

    background-color: initial;

    border: initial;

}

input {

    -webkit-appearance: textfield;

    padding: 1px;

    background-color: white;

    border: 2px inset;

    border-image-source: initial;

    border-image-slice: initial;

    border-image-width: initial;

    border-image-outset: initial;

    border-image-repeat: initial;

    -webkit-rtl-ordering: logical;

    -webkit-user-select: text;

    cursor: auto;

}

input, textarea, keygen, select, button {

    margin: 0em;

    font: 13.3333px Arial;

    text-rendering: auto;

    color: initial;

    letter-spacing: normal;

    word-spacing: normal;

    text-transform: none;

    text-indent: 0px;

    text-shadow: none;

    display: inline-block;

    text-align: start;

}

input, textarea, keygen, select, button, meter, progress {

    -webkit-writing-mode: horizontal-tb;

}

*/





.auto-width {width: auto !important;}

.auto-height {height: auto !important;}

.empty {height: 0 !important; margin: 0 !important; padding: 0 !important;}



/* --Clearfix */

.cf:before,

.cf:after {content: ''; display: table;}

.cf:after {clear: both;}

.cf {zoom: 1;}



.disabled {cursor: not-allowed;}

.full-width {width: 100%;}

.full-width-i {width: 100% !important;}

.full-height {height: 100vh; display: block;}

.full-height-i {height: 100vh !important; display: block !important;}

.clear-both, .new-line, .newline, .nl, .clear {clear: both;}

.display-none, .hide {display: none;}

.display-none-i, .hide-i {display: none !important;}

.hidden {visibility: hidden;}

.block {display: block;}

.block-i {display: block !important;}

.inline {display: inline; zoom: 1;}

.relative {position: relative;}

.absolute {position: absolute;}

.fixed {position: fixed;}

.oh, .over-hidden {overflow: hidden;}

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

.center {margin-left: auto; margin-right: auto;}

.pull-left {float: left;}

.pull-right {float: right;}

.text-left {text-align: left;}

.text-left-i {text-align: left !important;}

.text-right {text-align: right;}

.text-center {text-align: center;}

.text-justify, .justify {text-align: justify;}

.text-lowercase {text-transform: lowercase;}

.text-uppercase {text-transform: uppercase;}

.text-capitalize {text-transform: capitalize;}

.bold   {font-weight: bold;}

.normal {font-weight: normal;}

.basic  {font-size: 9pt; font-weight: normal;}

.text-nowrap, .nowrap {white-space: nowrap;}

.fixed-table {table-layout: fixed; word-break: break-all;}

.hand, .cursor-hand, button, input[type=button], input[type=submit], input[type=checkbox], input[type=radio] {cursor: pointer;}

.move, .cursor-move {cursor: move;}

.cursor-help {cursor: help;}

.help {cursor: help; background: #89A4CC; color: #fff; font-weight: bold; font-size: .5em; border-radius: 50%; padding: 0 .47em; display: inline; margin: 0 .3em; vertical-align: bottom;}

.c-red {color: #ff6666;}

/*.c-red {color: #DA0000;}*/

.c-blue {color: #41519e;}

.small {font-size: smaller;}

.narrowly {letter-spacing: -1px;}



.popup-overlay, .popup-ani {background: #fff; padding: 10px;}

.popup-ani {-webkit-transform: scale(0.8);-ms-transform: scale(0.8);-o-transform: scale(0.8);transform: scale(0.8);}

.popup_visible .popup-ani {-webkit-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);}



.middle {vertical-align: middle;}

.v-top {vertical-align: top;}

.v-top-i {vertical-align: top !important;}

.v-bottom {vertical-align: bottom;}

.v-bottom-i {vertical-align: bottom !important;}

.v-base {vertical-align: baseline;}

.v-base-i {vertical-align: baseline !important;}

.v-center {display: table; table-layout: fixed;}

.v-center > span, .v-center > div {display: table-cell; /*zoom: 1; #display: inline;*/ text-align: center; vertical-align: middle; overflow: hidden;}



.v-center-table {/*zoom: 1; display: inline;*/ border-collapse: collapse; border: 0; table-layout: fixed;}

.v-center-table, .v-center-table td {width: 100%; height: 100%; text-align: center; overflow: hidden;}

.v-center-table td {vertical-align: middle;}



.table {display: table; width: 100%; height: 100%; border-collapse: collapse; border-spacing: 0;}

.table-cell {display: table-cell; vertical-align: middle;}



.inline-block, .ib {

	display: -moz-inline-stack; /*display: -moz-inline-box;*/

	display: inline-block;

	zoom: 1;/*IE*/ *display: inline;/*IE7*/ _display: inline;/*IE6*/

}

.mc   {margin: 0 auto;}



.m-only {display: none;}

@media only screen and (max-width: 400px) {

	.m-only {display: initial !important;}

	.m-table {display: block !important;}

	.m-none {display: none !important;}

	.m-mgt30 {margin-top: 30px !important;}

	.m-mgr0 {margin-right: 0 !important;}

}



.lh13 {line-height: 1.3em;}

.lh15 {line-height: 1.5em;}



.mg0 {margin: 0 !important;}

.mg1 {margin: 1em;}

.mg2 {margin: 2em;}



.mg5  {margin: 5px;}

.mg10 {margin: 10px;}

.mg15 {margin: 15px;}

.mg20 {margin: 20px;}

.mg30 {margin: 30px;}



.mt1 {margin-top: 1em;}

.mt2 {margin-top: 2em;}



.mt5  {margin-top: 5px;}

.mt10 {margin-top: 10px;}

.mt15 {margin-top: 15px;}

.mt20 {margin-top: 20px;}

.mt30 {margin-top: 30px;}

.mt40 {margin-top: 40px;}

.mt50 {margin-top: 50px;}

.mt60 {margin-top: 60px;}



.mb0 {margin-bottom: 0 !important;}

.mb1 {margin-bottom: 1em;}

.mb2 {margin-bottom: 2em;}



.mb5  {margin-bottom: 5px;}

.mb10 {margin-bottom: 10px;}

.mb15 {margin-bottom: 15px;}

.mb20 {margin-bottom: 20px;}

.mb30 {margin-bottom: 30px;}

.mb40 {margin-bottom: 40px;}

.mb50 {margin-bottom: 50px;}

.mb100 {margin-bottom: 200px;}



.mr0  {margin-right: 0px !important;}

.mr5  {margin-right: 5px;}

.mr7  {margin-right: 7px;}

.mr10 {margin-right: 10px;}

.mr15 {margin-right: 15px;}

.mr20 {margin-right: 20px;}

.mr30 {margin-right: 30px;}



.ml5  {margin-left: 5px;}

.ml7  {margin-left: 7px;}

.ml10 {margin-left: 10px;}

.ml15 {margin-left: 15px;}

.ml20 {margin-left: 20px;}

.ml30 {margin-left: 30px;}

.ml40 {margin-left: 40px;}

.ml50 {margin-left: 50px;}

.ml60 {margin-left: 60px;}

.ml70 {margin-left: 70px;}



.pd0 {padding: 0;}

.pd1 {padding: 1em;}

.pd2 {padding: 2em;}



.pd5  {padding: 5px;}

.pd10 {padding: 10px;}

.pd15 {padding: 15px;}

.pd20 {padding: 20px;}

.pd30 {padding: 30px;}



.pt0 {padding-top: 0;}

.pt1 {padding-top: 1em;}

.pt2 {padding-top: 2em;}

.pb1 {padding-bottom: 1em;}

.pb2 {padding-bottom: 2em;}



.pt5  {padding-top: 5px;}

.pt10 {padding-top: 10px;}

.pt15 {padding-top: 15px;}

.pt20 {padding-top: 20px;}

.pt30 {padding-top: 30px;}

.pt40 {padding-top: 40px;}

.pt60 {padding-top: 60px;}



.pb0 {padding-bottom: 0 !important;}

.pb5  {padding-bottom: 5px;}

.pb10 {padding-bottom: 10px;}

.pb15 {padding-bottom: 15px;}

.pb20 {padding-bottom: 20px;}

.pb30 {padding-bottom: 30px;}

.pb40 {padding-bottom: 40px;}



.pr0  {padding-right: 0;}

.pr5  {padding-right: 5px;}

.pr10 {padding-right: 10px;}

.pr15 {padding-right: 15px;}

.pr20 {padding-right: 20px;}

.pr30 {padding-right: 30px;}



.pl0  {padding-left: 0;}

.pl5  {padding-left: 5px;}

.pl10 {padding-left: 10px;}

.pl15 {padding-left: 15px;}

.pl20 {padding-left: 20px;}

.pl30 {padding-left: 30px;}

.pl40 {padding-left: 40px;}

.pl50 {padding-left: 50px;}

.pl60 {padding-left: 60px;}

.pl70 {padding-left: 70px;}



.bt0 {border-top: 0 !important;}

.bt1 {border-top: 1px solid #CCC;}

.br1 {border-right: 1px solid #CCC;}

.bb1 {border-bottom: 1px solid #CCC;}

.bl1 {border-left: 1px solid #CCC;}

.bx1 {border: 1px solid #CCC; overflow: hidden;

	/*-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	box-sizing: border-box;*/

}

.bx0 {border: 0;}

.bt0 {border-top: 0;}

.bl0 {border-left: 0;}

.br0 {border-right: 0;}

.bb0 {border-bottom: 0;}



.w100 {width: 100%;}

.w40 {width: 40%;}



.hidden-jump-tab {position: relative; clear: both;}

.hidden-jump-tab a {display: block; height: 1px; width: 1px; margin-bottom: -1px; overflow: hidden; text-align: center; color: #000; white-space: nowrap;}

.hidden-jump-tab a:focus,

.hidden-jump-tab a:active {height: auto; width: auto; padding: 5px; margin-bottom: 10px;}



/* 화면낭독기 사용자용 */

#hd_login_msg {position: absolute; top: 0; left: 0; font-size: 0; line-height: 0; overflow: hidden;}

.msg_sound_only, .sound_only, .sr-only, .s-only {display: inline-block !important; position: absolute; top: 0; left: 0; margin: 0 !important; padding: 0 !important; font-size: 0; line-height: 0; border: 0 !important; overflow: hidden !important;  text-indent: -10000px; left: -10000px;}

.s-only {width: 1px; height: 1px; position: relative; z-index: -1; margin-left: -1px; margin-bottom: -1px; padding-left: 1px; padding-bottom: 1px;}

/* 본문 바로가기 */

#skip_to_container a {z-index: 100000; position: absolute; top: 0; left: 0; width: 1px; height: 1px; font-size: 0; line-height: 0; overflow: hidden;}

#skip_to_container a:focus, #skip_to_container a:active {width: 100%; height: 75px; background: #21272e; color: #fff; font-size: 2em; font-weight: bold; text-align: center; text-decoration: none; line-height: 3.3em;}



/* 문서의 최상단 스킵네비게이션 */

#skip-navigation{position: relative; z-index: 10000; top: 0; left: 0; /*width: 980px;*/ margin: 0 auto;}

.msie7 #skip-navigation{position: absolute;}

#skip-navigation a{width: 1px; height: 1px; position: absolute; overflow: hidden; margin-bottom: -1px; text-indent: -10000px;}

#skip-navigation a:focus, #skip-navigation a:active{width: auto; height: auto; position: relative; overflow: auto; margin: 0px 0px 0px 0px; position: absolute; width: auto; top: 0; padding: 5px 10px; border: 2px solid #232323; background: #1287e0; color: #ffffff; font-weight: bold; text-indent: 0px;}





input[type=checkbox].cb, input[type=radio].cb {display: none;}

input[type=checkbox].cb+label.C-label, input[type=radio].cb+label.C-label {padding-left: 28px; /*height: 23px;*/  display: inline-block; line-height: 23px; background-repeat: no-repeat; background-position: 0 0; font-size: 16px; vertical-align: top; cursor: pointer;}

/* input[type=checkbox].cb:checked+label.C-label, input[type=radio].cb:checked+label.C-label {background-position: 0 -23px;} */

input[type=checkbox].cb:checked+label.C-label:before, input[type=radio].cb:checked+label.C-label:before {background-position: 0 -23px;}

/* label.C-label {background-image: url("../images/check.png");} */

/*-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;*/

label.C-label:before {display: inline-block; width: 28px; height: 23px; margin-left: -28px; content: " "; font-size: 16px; vertical-align: top; line-height: 23px; background-image: url("../images/check.png"); background-repeat: no-repeat;}





#hiddenframe {display: none;}







.shadow_box {

    /*horizontal length, vertical length, blur radius, spread radius, shadow color(r,b,g,trans)*/

    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);

    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);

    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);

}

.shadow-b {text-shadow: 1px 1px 2px #000;}

.shadow-w {text-shadow: 1px 1px 2px #fff;}





.board-head {font-size: 1.2em; margin-top: .5em; margin-bottom: .5em; text-align: center;}

.cloudy {color: #888888;}



.sa, .sa a {color: #c80000 !important;}







.grayscale {

            filter: grayscale(1);

	-webkit-filter: grayscale(1); /* Webkit Nightlies, Google Chrome Canary and Microsoft Edge*/

	   -moz-filter: grayscale(100%);

	    -ms-filter: grayscale(100%);

	     -o-filter: grayscale(100%);

            filter: url('../js/grayscale/filters.svg#grayscale'); /* Firefox 3.5+ */

            /*filter: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="grayscale"><feColorMatrix type="matrix" values="1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0"/></filter></svg>#grayscale');*/

            -webkit-filter: gray;

                    filter: gray; /* IE6-9 */

}









.fa, .material-icons {

    vertical-align: middle;

}

.chkbox-icon {

    width: 1.13em;

    height: 1.13em;

    line-height: 1.13em;

    -moz-border-radius: 2px;

    -webkit-border-radius: 2px;

    border-radius: 2px;

    text-align: center;

    border: 1px solid #d6d6d6;

    background-color: #ffffff;

    color: #555555;

    -moz-border-radius: 2px;

    -webkit-border-radius: 2px;

    border-radius: 2px;

    display: inline-block;

}

.chkbox-icon.active {

    border: 1px solid #156090;

    background: #186ba0;

    color: #FFFFFF;

}

.chkbox-icon.disabled {

    opacity: 0.35;

    filter: Alpha(Opacity=35);

    background-image: none;

    cursor: default !important;

}