@charset "utf-8";
@font-face {
	font-family: 'Handletter';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/naverfont_05@1.0/Handletter.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

 body, th, td, input, select, textarea{ font-size: 16px;}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	Heading

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
h4, .h4, h5, .h5, h6, .h6{font-weight:500;}
h4, .h4{line-height:32px; margin:50px 0 12px; padding-left:26px; font-size:25px; color:#222; box-sizing:border-box;}
h5, .h5{line-height:26px; margin:30px 0px 8px; font-size:21px; color:#06439f;}
h6, .h6{line-height:22px; margin:20px 0px 6px; padding-left:12px; color:#36344a;}

h4:after, .h4:after{content:""; position:absolute; top:6px; left:0; width:19px; height:19px; background:url(../../../images/site/skin/h4_bul.gif) no-repeat left top;}
h6:after, .h6:after{content:""; position:absolute; top:8px; left:0; width:6px; height:6px; background-color:#1aa0af;}

.h4_p{padding-left:26px;}
.h6_p{padding-left:12px;}

.fc-handletter{font-family: 'Handletter';}

@media screen and (max-width:640px){
	h4, .h4{line-height:27px; margin:35px 0 10px; font-size:22px;}
	h4:after, .h4:after{top:5px;}
	h5, .h5{line-height:23px; margin:25px 0px 6px; font-size:19px;}
	body, th, td, input, select, textarea{ font-size: 14px;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	Tab
	
/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.js_tab{margin-bottom:40px;}
.js_tab ul li{width:25%; margin-right:0; padding-bottom:0;}
.js_tab ul li a{
	position:relative; z-index:0; height:52px; line-height:52px; margin-left:-1px; text-align:center; font-size:17px;
	transition:auto; -webkit-transition:auto;
}
.js_tab ul li:first-child a{margin-left:0 !important;}
.js_tab ul li a:hover,
.js_tab ul li.on a{z-index:1; line-height:50px; margin-left:-2px; padding:0 15px 0 16px; background-color:#fff; border:2px solid #084897; color:#084897;}

.js_tab.select .title{background-color:#084897;}
.js_tab.select .title a{height:45px; line-height:45px; font-size:16px;}
.js_tab.select ul li a{height:40px; line-height:40px; font-size:15px;}

/*탭스크립트*/
.tab_view{display:none;}
.tab_view.on{display:block;}

@media screen and (max-width:640px){
	.js_tab{margin-bottom:30px;}
	.js_tab ul li{width:100%;}
	.js_tab ul li a{margin-left:0; text-align:left;}
	.js_tab ul li a:hover,
	.js_tab ul li.on a{margin-left:0; padding:0 15px; background-color:#f1f1f1; border:1px solid #ccc; border-top:0;}
}



/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	list style

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.list_01{margin:8px 0 0 0;}
.list_01 > li{position:relative; line-height:1.4; margin-top:8px; padding-left:11px; box-sizing:border-box;}
.list_01 > li:first-child{margin-top:0;}
.list_01 > li:before{content:""; display:block; position:absolute; left:0; top:10px; width:3px; height:3px; background-color: #074897; border-radius: 50%;
}
.list_02{margin:8px 0 0 0;}
.list_02 > li{position:relative; line-height:22px; margin-top:3px; padding-left:9px; box-sizing:border-box;}
.list_02 > li:first-child{margin-top:0;}
.list_02 > li:before{content:""; display:block; position: absolute; left:0; top:9px; width:4px; height:5px; background:url(../../../images/site/skin/list_02_bul.gif) no-repeat left top;}
.list_03{margin:8px 0 0 0;}
.list_03 > li{position:relative; line-height:22px; margin-top:3px; padding-left:10px; box-sizing:border-box;}
.list_03 > li:first-child{margin-top:0;}
.list_03 > li:before{content:""; display:block; position: absolute; left:0; top:11px; width:5px; height:2px; background:#cacaca;}

/*리스트 안에 리스트 구조*/
.list_01 li ul,
.list_02 li ul{margin:4px 0 0 0;}
.list_01 li ol,
.list_02 li ol{margin-top:6px;}

@media screen and (max-width:640px){
	.list_01 > li:before{top:8px;}
	.list_03 > li:before{top:10px;}
}

/*number list*/
.num_list_01{margin-top:10px;}
.num_list_01 > li{position:relative; min-height:22px; line-height:22px; padding: 0 0 0 32px; margin-top:7px; box-sizing:border-box;}
.num_list_01 > li:first-child{margin-top:0;}
.num_list_01 > li > em{position:absolute; left:0; top:0; display:block; width:22px; height:22px; line-height:20px; background:#084897; text-align:center; font-size:14px; font-style:normal; font-weight:400; color:#fff;
	transition:all 0.3s ease;  -webkit-transition:all 0.3s ease;
}
.num_list_02{margin-top:10px;}
.num_list_02 > li{position:relative; min-height:24px; line-height:22px; padding:0 0 0 32px; margin-top:6px; box-sizing:border-box;}
.num_list_02 > li:first-child{margin-top:0;}
.num_list_02 > li > em{
	position:absolute; left:0; top:0; display:block; width:24px; height:24px; line-height:22px; background:#edf2fa; text-align:center; font-style:normal; font-size:14px; font-weight:400; color:#5f6164;
	border-radius:50%; -webkit-border-radius:50%;
	transition:all 0.3s ease;  -webkit-transition:all 0.3s ease;
}
.num_list_02.bg_num > li > em{background:#e1e1e1;}

.num_list_03{margin-top:10px;}
.num_list_03 > li{line-height:23px; position:relative; padding:0 0 0 20px; margin-top:3px; min-height:24px; box-sizing:border-box;}
.num_list_03 > li:first-child{margin-top:0;}
.num_list_03 > li > em{
	position:absolute; left:0; top:0; display:block; line-height:23px; font-style:normal; font-weight:700; color:#1c53a7;
	transition:all 0.3s ease;  -webkit-transition:all 0.3s ease;
}

/*ol리스트 안에 ol리스트 구조*/
ol[class*="num_list_"] li .num_list_03{margin-top:6px;}
/*ol리스트 안에 ul리스트 구조*/
ol[class*="num_list_"] li ul[class*="list_"]{margin:4px 0 0 0;}

@media screen and (max-width:640px){
	.num_list_01 > li{min-height:20px; line-height:20px; padding:0 0 0 28px;}
	.num_list_01 > li > em{width:20px; height:20px; line-height:18px; font-size:12px;}
	.num_list_02 > li{min-height:22px; padding:0 0 0 28px;}
	.num_list_02 > li > em{width:22px; height:22px; line-height:20px; font-size:12px;}
	.num_list_03 > li,
	.num_list_03 > li > em{line-height:21px;}
}
@media screen and (max-width:480px){
	.num_list_01 > li > em{line-height:20px; font-size:13px;}
	.num_list_02 > li > em{line-height:22px; font-size:13px;}
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	Table

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.caption{margin-top:-25px;  margin-bottom:5px; text-align:right; font-size:14px; color:#636363;}

.table{width:100%; border-top:2px solid #1a5bb1;}
.table th,
.table td{line-height:22px; padding:10px; border-left:1px solid #c6c6c6; border-right:1px solid #c6c6c6; text-align:center;}
.table th{background:#f5f6f9; border-bottom:1px solid #c6c6c6; font-weight:400;}
.table td{border-bottom:1px solid #c6c6c6;}
.table tr th:first-child,
.table tr td:first-child{border-left:none;}
.table tr th:last-child,
.table tr td:last-child{border-right:none;}

/*가로형*/
.table.ty_02 th{border-bottom:1px solid #c6c6c6;}

.table tr td input[type=text],
.table tr td input[type=password],
.table tr td textarea{width:100%; max-width:100%; height:35px; line-height:35px; margin:1px 0px; vertical-align:middle; border:1px solid #ccc; box-sizing:border-box;}
.table tr td textarea{height:auto; line-height:22px;}
.table tr td .btn{vertical-align:middle;}

@media screen and (max-width:740px){
	.table td ul li:after {top:6px;}	
	/*테이블스크롤*/
	.table_scroll {position:relative;}
	.table_scroll:before {content:"좌우로 터치해서 보세요."; font-size:13px; width:168px; margin:0 auto; box-sizing:border-box; padding:0 0 0 25px; line-height:25px; color:#00589b; display:block; background:url(../../../images/site/skin/scroll_ico.png) no-repeat left top; height:22px; background-size:auto 100%;}
	.table_scroll .move {overflow:auto; margin-top:10px;}
	.table_scroll .move .table{width:740px;}	
	.table_scroll .move .table .table{width:100%;}
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	input style

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
input[type="text"],
input[type="password"]{height:35px; vertical-align:middle;}
input[type="text"].js_cal{width:110px !important;}

/*전화번호 등 작은 인풋*/
input[type="text"].small{width:80px !important;}

select{height:35px; line-height:35px; border-color:#cecece;}
textarea{width:100%;}

/*라디오버튼*/
.radio_btn:after{content:""; display:block; clear:both;}
.radio_btn li{position:relative; float:left; margin-right:15px; font-size:14px;}
.radio_btn input[type="radio"]{position:absolute; left:1px; top:5px; width:14px; height:14px;}
.radio_btn label{position:relative; display:inline-block; padding:0 0 0 22px; vertical-align:middle; cursor:pointer;}
.radio_btn input[type="radio"]:checked+label:before{opacity:1; -webkit-opacity:1; left:5px; top:7px; width:6px; height:6px;}
.radio_btn input[type="radio"]:checked+label:after{background:#dfdfdf; border:1px solid #dfdfdf;}
.radio_btn label:before{
	content:""; opacity:0; -webkit-opacity:0; position:absolute; left:8px; top:10px; z-index:5; display:block; width:0; height:0; background:#464040;
	transition:all 0.2s ease; -webkit-transition:all 0.2s ease;
	border-radius:50%; -webkit-border-radius:50%;
}
.radio_btn label:after{
	content:""; position:absolute; left:0; top:2px; z-index:1; display:block; width:14px; height:14px; border:1px solid #c5c5c5; background:#fff;
	border-radius:50%; -webkit-border-radius:50%;
}

/*체크박스*/
.check_box{position:relative;}
.check_box input{position:absolute; left:1px; top:4px; width:14px; height:14px;}
.check_box label{position:relative; padding:0 0 0 22px; display:inline-block; vertical-align:middle; cursor:pointer;}
.check_box input:checked+label:before{width:14px; height:14px; left:1px; top:3px; opacity:1; -webkit-opacity:1;}
.check_box input:checked+label:after{border:1px solid #dfdfdf;}
.check_box label:before{
	content:""; opacity:0; -webkit-opacity:0; position:absolute; left:8px; top:8px; z-index:5; display:block; width:0; height:0; background:#dfdfdf url(../../../images/site/skin/icon_check.png); background-repeat:no-repeat; background-position:center center;
	transition:all 0.2s ease; -webkit-transition:all 0.2s ease;
}
.check_box label:after{content:""; position:absolute; left:0; top:2px; z-index:1; display:block; width:14px; height:14px; border:1px solid #c5c5c5; background:#fff;}

/*파일찾기*/
.file_find{position:relative; max-width:300px;}
.file_find input[type="file"]{overflow:hidden; position:absolute; width:0px; height:1px; margin:-1px; padding:0; border:0;}
.file_find label{position:absolute; top:0; right:0; display:inline-block; width:90px; height:35px; line-height:35px; background-color:#5d6372; vertical-align:middle; text-align:center; font-size:14px; color:#fff; cursor:pointer; box-sizing:border-box;}
/* named upload */
.file_find .upload-name{
    overflow:hidden; display:inline-block; width:100%; background-color:#fff; vertical-align:middle; white-space:nowrap; text-overflow:ellipsis;
	/* 네이티브 외형 감추기 */
	-webkit-appearance:none; 
	-moz-appearance:none;
	appearance:none;
 }

@media screen and (max-width:640px){
	input[type="text"],
	input[type="password"]{height:30px;}
	input[type="text"].small{width:50px !important;}
	
	.radio_btn input[type="radio"]{top:3px;}
	.radio_btn label:after{top:1px;}
	.radio_btn input[type="radio"]:checked+label:before{top:6px;}
	.check_box input[type="radio"]:checked+label:before{top:2px;}
	.check_box label:after{top:1px;}

	.file_find label{width:80px; height:30px; line-height:30px;}
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	color

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.blue{color:#084897;}
.red{color:#d10000;}
.green{color:#149dad;}
.orange{color:#BB4E0C;}
.black{color:#282828;}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	tip

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.tip{min-height:18px; line-height:18px; margin-top:3px; color:#084897;}
.tip:after{width:18px; height:18px; line-height:18px; background:#084897; font-weight:500; color:#fff;}
.tip.ty2{color:#666;}
.tip.ty2:after{background:#cfd7e2; color:#7388a8;}

@media screen and (max-width: 640px){
	.tip{min-height:19px;}
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	button

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/*기본*/
a.btn, a.btn:link, a.btn:visited, a.btn:active{background:#00a3b4; border-color:#00a3b4;}
a.btn:hover{background:#fff; color:#00a3b4;}
/*바로가기,다운로드,새창*/
a.btn.bg_01:link, a.btn.bg_01:visited, a.btn.bg_01:active{background:#084897; border-color:#084897;}
a.btn.bg_01:hover{border-color:#717a8d; color:#084897;}
/*수정,기타*/
a.btn.bg_02:link, a.btn.bg_02:visited, a.btn.bg_02:active{background:#717a8d; border-color:#717a8d;}
a.btn.bg_02:hover{color:#717a8d;}
/*취소,삭제,닫기 및 부정*/
a.btn.bg_03:link, a.btn.bg_03:visited, a.btn.bg_03:active{background:#053166; border-color:#053166;}
a.btn.bg_03:hover{background:#fff; color:#053166;}
/*화살표,다운,링크*/
a.btn.arrow.bg_01:hover:after{background-image:url(../../../images/site/skin/icon_arrow_ov.gif);}
a.btn.down.bg_01:hover:after{background-image:url(../../../images/site/skin/icon_down_ov.gif);}
a.btn.link.bg_01:hover:after{background-image:url(../../../images/site/skin/icon_link_ov.gif);}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	etc

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.img_bx{width:100%; height:auto; border:1px solid #dedede; box-sizing:border-box;}
.img_bx img{display:block; max-width:100%; margin:0 auto; /* padding:25px 15px; box-sizing:border-box; */}

.sub_tt{display:block; margin-top:20px; font-size:18px; font-weight:500;}

@media screen and (max-width:640px){
	.sub_tt{font-size:17px;}
}