@charset "utf-8";
/* CSS Document */

/**************************************************
프로그램 ID : common.css
프로그램 명 : Base Cascading Style Sheets
작  성   자 : 노희영
최초 작성일 : 2018/01/17
최종 작성일 : 
참고   사항 : 
**************************************************/


/* reset */

* {margin:0; padding:0; border:0 none transparent; box-sizing:border-box;-webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
:before, :after {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}

html,body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, textarea, p, blockquote, th, td, input, select, textarea, button {
	font-family: 'NotoSans-DemiLight',"맑은고딕","Malgun Gothic", "AppleGothicNeoSD", "Apple SD 산돌고딕 Neo", "sans-serif"; ;
	-webkit-font-smoothing: antialiased;
	font-size:15px; line-height:18px; color:#666; /*letter-spacing:-0.03em;*/
}

html,body{ overflow-x:hidden}

form, fieldset, p, figure {word-break:break-all; word-wrap:break-word;}

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

fieldset, img {border: 0 none}
img {border:0;max-width:100%;vertical-align:top}
menu, ol, ul, li, dl, dt, dd {list-style:none;}
menu, ol, ul, dl, dt {display:block;}

h1, h2, h3, h4, h5, h6, p {word-break:normal; word-wrap:break-word;}
h1, h2, h3, h4, h5, h6, strong, th {font-weight:normal;}
address, caption, pre, em, i {font-style:normal;}

hr{display:none}


/* form */
input, select, textarea, button {color:#666; vertical-align:middle;}
input::-ms-clear {display: none}

textarea {resize:none;}
button, label {cursor:pointer;}
a {text-decoration:none; cursor:pointer; transition:color 0.1s linear 0s, background-color 0.1s linear 0s, opacity 0.1s linear 0s !important;}
a:link, a:visited {color:#666;}
a:hover, a:active {color:#333;}


/* tables */
table {width:100%; border-collapse:collapse;}
table th, table td {color:#666; vertical-align:top; word-break:normal; word-wrap:break-word;}


/* Accessibility */
.accessibility {visibility:hidden; width:0px; height:0px; font-size:0px; overflow:hidden; line-height:0px; position:absolute;}
.skip {visibility:hidden; width:0px; height:0px; font-size:0px; overflow:hidden; line-height:0px; position:absolute;}

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


/* 정렬 */
.pos_R{position:relative;}
.pos_A{position:absolute;}

.fl {float:left !important;}
.fr {float:right !important;}
.fn {float:none !important;}
.clr {clear:both;}
ul.ulfl > li{float:left}

.tl {text-align:left !important;}
.tr {text-align:right !important;}
.tc {text-align:center !important;}

.vt {vertical-align:top;}
.vb {vertical-align:bottom;}
.vm, .btns {vertical-align: middle;}

.nobg {background:none !important;}
.nobd {border:0 none !important;}
.nobl {border-left:0 none !important;}
.nomg {margin:0 !important;}
.nomt {margin-top:0 !important;}
.noml {margin-left:0 !important;}
.nopdt {padding-top:0 !important;}
.nopd {padding:0 !important;}
.nopb {padding-bottom:0 !important;}
.nopl {padding-left:0 !important;}
.nodp {display:none;}

.clear{clear:both !important;}
.clearfix:after,ul.ulfl:after,#container:after,.sub_cont:after {content:"";width:100%;display:block;visibility:hidden;clear:both;}

::-webkit-input-placeholder {color:#aaa;} 
:-moz-placeholder {color:#aaa; opacity:1;}
::-moz-placeholder {color:#aaa; opacity:1;}
:-ms-input-placeholder {color:#aaa !important;}
::-ms-input-placeholder {color:#aaa;}
.placeholder {color:#aaa !important;}


/* 폰트 두께 */
.fw_B{ font-weight:bold}
.fw_N{ font-weight:normal}


/* 칼라 */
.color_styR{color:#fb7d02}
/* 컬러 */
.gray{color:#475066 !important}
.blue{color:#134bb9 !important}
.navy{color:#071943 !important}
.purple{color:#4b2f91 !important}
.green{color:#00a737 !important}
.mint{color:#420f96 !important}
.orange{color:#fa462e !important}
.red{color:#e91313 !important}
.bk{color:#000 !important}

/* 배경 */
.bg_gray{background-color:#f0f0f0 !important;}
.bg_l_gray{background:#f6f6f6 !important;}
.bg_blue{background-color:#134bb9 !important;color:#fff !important}
.bg_navy{background-color:#071943 !important;color:#fff !important}
.bg_purple{background-color:#4b2f91 !important;color:#fff !important}
.bg_green{background-color:#00a737 !important;color:#fff !important}
.bg_mint{background-color:#07a5a5 !important;color:#fff !important}
.bg_orange{background-color:#fa462e !important;color:#fff !important}
.bg_red{background-color:#e91313 !important;color:#fff !important}
.bg_bk{background-color:#000 !important;color:#fff !important}
.bg_w{background-color:#fff !important;color:#000 !important}
.bg_w_bo{background-color:#fff !important;color:#000 !important;border:1px solid #ddd;}

/* line */
.line_H1{width:100%; height:1px; background:#e8e8e8; clear:both; font-size:0px; line-height:0px; display:block}


/* box */
.box_siz{   
box-sizing:border-box; /*width 는 padding, border 크기를 포함한 크기*/
-webkit-box-sizing:border-box; 
-moz-box-sizing:border-box;
}


/* 정렬 */
.p_r{position:relative}
.p_a{position:absolute}
.t_a_c{text-align:center }
.t_a_l{text-align:left }
.t_a_r{text-align:right}

.fr{float:right}
.fl{float:left }
.fn{float:none !important;}

.v_a_t {vertical-align:top }
.v_a_m {vertical-align:middle }
.v_a_b {vertical-align:bottom }



/* 공란 */
.h_space10{width:100%; height:10px; clear:both; display:block}
.h_space15{width:100%; height:15px; clear:both; display:block}
.h_space20{width:100%; height:20px; clear:both; display:block}
.h_space30{width:100%; height:30px; clear:both; display:block}
.h_space40{width:100%; height:40px; clear:both; display:block}
.h_space50{width:100%; height:50px; clear:both; display:block}
.h_space60{width:100%; height:60px; clear:both; display:block}
.h_space70{width:100%; height:70px; clear:both; display:block}
.h_space75{width:100%; height:75px; clear:both; display:block}
.h_space80{width:100%; height:80px; clear:both; display:block}
.h_space90{width:100%; height:90px; clear:both; display:block}
.h_space100{width:100%; height:100px; clear:both; display:block}


/*------------------------------------*\
  width
\*------------------------------------*/
.w100p {width:100%;}
.w90p{width:90%}
.w80p{width:80%}
.w70p{width:70%}
.w60p{width:60%}
.w50p{width:50%}
.w40p{width:40%}
.w30p{width:30%}
.w33p{width:33.3%}
.w25p{width:25%}
.w20p{width:20%}
.w15p{width:15%}
.w10p{width:10%}



/*------------------------------------*\
  margin/padding
\*------------------------------------*/
.mt0 {margin-top:0px !important;}
.mt5 {margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mt40{margin-top:40px !important;}
.mt50{margin-top:50px !important;}
.mt60{margin-top:60px !important;}

.mb0 {margin-bottom:0px !important;}
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb40 {margin-bottom:40px !important;}
.mb50 {margin-bottom:50px !important;}

.ml0 {margin-left:0px !important;}
.ml5 {margin-left:5px !important;}
.ml10 {margin-left:10px !important;}
.ml20 {margin-left:20px !important;}
.ml30 {margin-left:30px !important;}
.ml40 {margin-left:40px !important;}
.ml50 {margin-left:50px !important;}

.mr0 {margin-right:0px !important;}
.mr5 {margin-right:5px !important;}
.mr10 {margin-right:10px !important;}
.mr20 {margin-right:20px !important;}
.mr30 {margin-right:30px !important;}
.mr40 {margin-right:40px !important;}
.mr50 {margin-right:50px !important;}

.pa0 {padding:0px}
.pa5 {padding:5px}
.pa10 {padding:10px}
.pa20 {padding:20px}
.pa30 {padding:30px}
.pa40 {padding:40px}
.pa50 {padding:50px}
.pa60 {padding:60px}
.pa70 {padding:70px}

.pt30{padding-top:30px}



/* 버튼 */
.btn_line_bl01{ border:1px solid #195dae; height:40px; line-height: 40px; color:#195dae !important; display: inline-block; padding:0 25px}
.btn_line_bl01:hover{ background:#195dae; color:#fff !important}

.btn_fill_bl01{ border:1px solid #195dae; height:40px; line-height: 40px; background:#195dae;  color:#fff !important; display: inline-block; padding:0 25px}
.btn_fill_bl01:hover{ border:1px solid #195dae; color:#195dae !important}



/* 테이블 */
.tb_sty_h01{}
.tb_sty_h01 thead th{ text-align: center; height:45px; line-height: 22px; font-size:18px;  font-family: 'Nanum Barun Gothic Bold';  background: #f7f8fc; color:#195dae;  border:1px solid #e8e8e8; border-bottom:0px; vertical-align: middle}
.tb_sty_h01 tbody td{height:39px; line-height: 24px;padding:5px 10px; text-align: center;  vertical-align: middle;  border:1px solid #e8e8e8 }

.tb_sty_h02{}
.tb_sty_h02 thead th{ text-align: center; height:45px; line-height: 24px; font-size:18px; font-family: 'Nanum Barun Gothic Bold'; background: #f7f8fc; color:#195dae; vertical-align: middle;  border:1px solid #e8e8e8; border-bottom:0px;}
.tb_sty_h02 tbody td{height:39px;  line-height: 24px;padding:10px 10px; text-align: left;  border:1px solid #e8e8e8; background: #fff; vertical-align: top; padding-bottom:10px;}
.tb_sty_h02 tbody td:first-child{ vertical-align:middle;  text-align: center; font-family: 'Nanum Barun Gothic Bold'; color:#195dae;  }
.tb_sty_h02 tbody tr:hover{outline:3px solid #195dae}

.tb_sty_h03{}
.tb_sty_h03 thead th{ text-align: center; height:45px; line-height: 24px; font-size:18px; font-family: 'Nanum Barun Gothic Bold'; background: #f7f8fc; color:#195dae; vertical-align: middle;  border:1px solid #e8e8e8; border-bottom:0px;}
.tb_sty_h03 tbody td{height:39px;  line-height: 24px;padding:10px 10px; text-align: left;  border:1px solid #e8e8e8; background: #fff; vertical-align: top; padding-bottom:10px;}
.tb_sty_h03 tbody td:nth-child(1){ vertical-align:middle;  text-align: center;}
.tb_sty_h03 tbody td:nth-child(2){ vertical-align:middle; font-family: 'Nanum Barun Gothic Bold'; color:#195dae;  }
.tb_sty_h03 tbody tr:hover{outline:3px solid #195dae}