@charset "utf-8";


/*  기본재정의  */
body { font-family:'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; font-size:15px;color:#333333;}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, main, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin:0;padding:0;border:0;background:transparent;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {display:block;}
a {margin:0;padding:0;background:transparent;color:#333333;vertical-align:baseline;text-decoration:none;}
a.link_line {text-decoration:underline;}
a.color_blue {color:#4c90f3;}
table {width:100%;border-spacing:0;border-collapse:collapse;}
caption {width:0;height:0;font-size:0;line-height:0;text-indent:-9999em;}
button, label, input, textarea, select {margin:0;padding:0;font:inherit;cursor:pointer;}
textarea {overflow-y:auto;resize:vertical;vertical-align:top;}
address, em, i {font-style:normal;}
ul li,
ol li {list-style:none;}
::-webkit-input-placeholder {opacity:0.6;font:inherit;}
::-moz-input-placeholder {opacity:0.6;font:inherit;}
::-ms-input-placeholder {opacity:0.6;font:inherit;}
:-moz-input-placeholder {opacity:0.6;font:inherit;}
.db {display:block !important;}
.al {text-align:left !important;}
.ac {text-align:center !important;}
.ar {text-align:right !important;}
.vt {vertical-align:top !important;}
.fl {float:left;}
.fr {float:right;}
.cf:before,
.cf:after {display:table;content:'';}
.cf:after {clear:both;}
.hidden {overflow:hidden;position:absolute;top:0;left:-10000%;width:1px;height:1px;font-size:0;line-height:0;text-indent:-9999em;}


/*  이미지  */
img {max-width:100%;}


/*  마진 패딩  */
.mt0 {margin-top:0px !important;}
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top: 16px !important;}
.mt25 {margin-top:25px !important;}
.mt30 {margin-top:30px !important;}
.mt40 {margin-top:40px !important;}
.mt50 {margin-top:50px !important;}
.ml5 {margin-left:5px !important;}
.ml10 {margin-left:10px !important;}
.ml20 {margin-left:20px !important;}
.mr5 {margin-right:5px !important;}
.mr10 {margin-right:10px !important;}
.mr20 {margin-right:20px !important;}
.mb0 {margin-bottom:0 !important;}
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}

.pd20 {padding:20px !important;}


/*  텍스트  */
.text_black {color:#000 !important;}
.text_b {color:#004493 !important;}
.text_oy {color:#fd6614 !important;}
.text_bold {font-weight: 700 !important;}

.txt_clr_sl {color:#006fbb !important;}
.txt_clr_red {color:#e85a71 !important;}
.txt_clr_green {color:#3ac569 !important;}
.txt_clr_blue {color:#548cf1 !important;}
.txt_clr_navy {color:#5b56e1 !important;}
.txt_clr_black {color:#666572 !important;}
.txt_clr_gray {color:#ddd !important;}
.txt_clr_white {color:#fbfbfb !important;}


/*  버튼  */
button {border:0;}
button.btn, a.btn {display:inline-block; height:35px; border:0; padding:0 35px; box-sizing:border-box; -webkit-box-sizing:border-box; font-family:'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; font-size:17px; line-height:30px; text-align:center; vertical-align:middle; cursor: pointer;}
.btn_wrap {position:relative; margin-top:15px; text-align:center; padding-bottom: 10px;}
.btn.btn01 {width:100%;background:#0c68ff;color:#fff;height:60px;line-height:60px;border-radius: 10px;}
.btn.btn02 {border:1px solid #042e6f; background:#fff; color:#042e6f;}
.btn.btn03 {min-width:50px; height:36px; line-height:35px; border:1px solid #7c7c7c; padding:0 10px; background:#fff; color:#7c7c7c; font-size:14px; font-weight:700;}
.btn.btn04 {min-width:50px; height:36px; line-height:35px; border:1px solid #d9133d; padding:0 10px; background:#fff; color:#d9133d; font-size:14px; font-weight:700;}
.btn.btn05 {min-width:50px; height:36px; line-height:35px; border:1px solid #0c68ff; padding:0 10px; background:#fff; color:#0c68ff; font-size:14px; font-weight:700;}
.btn.btn06 {min-width:70px; height:30px; border:1px solid #042e6f; padding:0 20px; background:transparent; color:#042e6f; font-size:13px; line-height:30px;}


/*  form  */
input[type=text], 
input[type=tel], 
input[type=password] {height:40px; width:100%; line-height:40px; border:1px solid #ccc; padding:0 14px; color:#888; font-size:14px; border-radius:0; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
input[type=radio] {position:inherit; width:16px; height:16px;margin-top:3px; clip:rect(0,0,0,0);}
input[type=radio] + label {position:relative; font-size:14px; cursor:pointer;  font-family:'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; font-size:14px; cursor:pointer; line-height:20px; vertical-align:top; margin-right:20px; padding-left:24px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;}
input[type=radio] + label:before {position:absolute; left:-20px; top:3px; width:13px; height:13px; background-position:-120px -60px; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);}
input[type=radio] + label:before {content:''; display:inline-block; position:absolute; top:-9px; left:-5px; width:40px; height:40px; background:url('../img/icon.png') no-repeat 0px -356px; transform:scale(0.5);}
input[type=radio]:checked+label:before {background-position:-40px -356px;}

input[type=checkbox] {position:absolute; width:18px; height:18px;}
input[type=checkbox] + label{ position:relative;  font-family:'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; font-size:14px; cursor:pointer; line-height:20px; vertical-align:top; margin-right:15px; padding-left:30px;}
input[type=checkbox] + label:before {position:absolute; left:-20px; top:3px; width:12px; height:12px; background-position:-49px -60px;}
input[type=checkbox] + label:before {content:''; display:inline-block; position:absolute; top:-9px; left:-5px; width:40px; height:40px; background:url('../img/icon.png') no-repeat 0px -311px; transform:scale(0.5)}
input[type=checkbox]:checked + label:before {background-position:-40px -311px;box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);}
input[type=checkbox]:checked + label:after { content: ''; position: absolute; top: 1px; left: 5px; width: 13px; height: 13px; /*background: #99a1a7;*/ border-radius: 100%; /*box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3); */}

select {width:100%; height:40px; border:1px solid #ccc; padding:0 8px; background:#fff url('../img/ico_select02.png') no-repeat right 0; background-size:40px 40px; color:#888; font-size:14px; cursor:pointer; border-radius:0;}
select::-ms-expand {display: none;}
textarea {border:1px solid #ccc; width:100%; height:100px; padding:10px; color:#777;  font-family:'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; font-size:14px; resize:one; box-sizing:border-box;-webkit-box-sizing:border-box; -webkit-appearance:none; border-radius:0}


/*  title  */
.title_style {margin:25px 0 10px; color:#222; font-size:17px;}
.title_style:first-child {margin:0 0 20px 0; word-wrap: break-word; word-break: keep-all; letter-spacing: -1px; line-height: 24px;}
.title_style em {color:#0c68ff;}
.title_style p {color:#0c68ff;  font-size:17px;}


/*  table_list  */
.table-responive{border-collapse:collapse; border-spacing:0; width:100%; border:1px solid #ddd; overflow-x:auto; border-bottom:1px solid #888;}
.table_responive > table {width:100%;color:#222;font-size: 18px;line-height: 1.4; border-collapse: separate; border-spacing: 0;}

.table_responive thead th {padding: 0;background: #2b6ab4;border-left: 1px solid #6b97cb;border-bottom: 1px solid #6b97cb;text-align:center;vertical-align:middle;word-wrap: break-word;word-break: keep-all;color: #fff;}
.table_responive tbody td {position:relative;padding: 0;border-left: 1px solid #6b97cb;border-bottom: 1px solid #6b97cb;vertical-align:middle;word-wrap:break-word;word-break:keep-all;background: #2b6ab4;color: #fff;font-weight: bold;}
.table_responive th {height: 39px;padding:6px 0 4px;background:#fafafa;}
.table_responive td {height: 40px;padding:6px 0 4px;/*border-top:1px solid #ddd;*/text-align:center;}
.table_responive td a {color: #fff;}
.table_responive td a:hover {color:#0c68ff; text-decoration:underline;}
.table_responive tr:nth-child(even) {background-color:#f2f2f2}


/* table_list2 */
.table-responive2{border-collapse:collapse; border-spacing:0; width:100%; border:1px solid #ddd; overflow-x:auto; border-bottom:1px solid #888;}
.table_responive2 > table {width:100%;color:#222;font-size: 14px;line-height: 1.2;border-top: 2px solid #042e6f;background: #fff;}
.table_responive2 thead th {padding: 10px;background: #e0edf6;border-left:1px solid #d7d7d7;border-bottom:1px solid #d7d7d7;border-right: 1px solid #d7d7d7;text-align:center;vertical-align:middle;word-wrap: break-word;word-break: keep-all;}
.table_responive2 tbody td {position:relative;padding: 8px;border-left:1px solid #d7d7d7;border-bottom: 1px solid #d7d7d7;border-right: 1px solid #d7d7d7;vertical-align:middle;word-wrap:break-word;word-break:keep-all;}
.table_responive2 th {height: 10px;padding:6px 0 4px;background:#fafafa;}
.table_responive2 td {height: 18px;padding:6px 0 4px;border-top:1px solid #ddd;text-align:center;}
.table_responive2 td a {color:#222;}
.table_responive2 td a:hover {color:#0c68ff; text-decoration:underline;}
.table_responive2 tr:nth-child(even) {background-color: #fff;}


/* 세로모드 모바일 디바이스 (가로 해상도가 576px 보다 작은 화면에 적용) */ 

@media (max-width: 767px) {
.table_responive > table {font-size:16px;}
}

@media (max-width: 616px) {
.table_responive > table {font-size:13px;}
}

@media (max-width: 320px) {
.table_responive > table {font-size:12px;}
.table_responive th, .table_responive td {height:40px;}
}


/* popup */
.popup_wrap .p_header {background:#54a3ee; padding:16px 20px;}
.popup_wrap .p_header h4 {display:block; font-size:16px; line-height:24px; font-weight:500; color:#fff;}
.popup_wrap .p_content {padding:20px;}


/***********************************
* 메인 레이어 팝업 스타일
***********************************/
.mainPopup{display:none;position:fixed;left:0;top:0;z-index:9999}
.mainPopup .mainP_wrap{position:absolute;left:0;top:0;background:#fff;z-index:1;overflow:hidden;min-height: 200px;}
.mainPopup .mainP_wrap .mainP_tit{position:absolute;left:0;top:0;width:100%;padding: 20px 20px;background: #2b6ab4;border-bottom:1px solid #c5c5c5;}
.mainPopup .mainP_wrap .mainP_tit>strong{text-align: left;display:block;padding-left: 0;color:#fff;font-size:18px;line-height:26px;/* background:url(/resource/images/paid/nep/cmmn/icon_popup_notice.png) left 0 no-repeat */}

.mainPopup .mainP_wrap .mainP_con{width:100%;height:100%;padding: 10px 0 0px;display:table;overflow:hidden;text-align:left;border-bottom: 1px solid #ddd;}
.mainPopup .mainP_wrap .mainP_con .mainP_middle{display:table-cell;vertical-align:middle;}
.mainPopup .mainP_wrap .mainP_con .mainP_txt{padding: 20px;line-height: 24px;}
/* .mainPopup .mainP_wrap .mainP_con .mainP_txt{padding:15px 20px;line-height:normal} */
.mainPopup .mainP_wrap .mainP_con .mainP_txt *{word-break:keep-all;color:inherit}

.mainPopup .mainP_wrap .mainP_btn{position:absolute;left:0;bottom: 1px;width:100%;border-top: 1px solid #ddd;overflow:hidden;z-index:2;/* padding: 0; */}
.mainPopup .mainP_wrap .mainP_btn button{float:left;width:50%;height: 50px;border-left: 1px solid #ddd;background: #e9ecf2;transition:all .3s;}
.mainPopup .mainP_wrap .mainP_btn button:first-child{border-left:0}
.mainPopup .mainP_wrap .mainP_btn button:hover{background:#eee}

.mainPopup .mainP_wrap.img .mainP_tit{display:none}
.mainPopup .mainP_wrap.img .mainP_con{padding-top:0;display:flex}
.mainPopup .mainP_wrap.img .mainP_con a{}
.mainPopup .mainP_wrap.img .mainP_con img{float:left}

@media all and (max-width:768px){
.mainPopup{right:0;bottom:0;background:rgba(0,0,0,.5)}
.mainPopup .mainP_wrap{position:relative;width:95% !important;/*left:50% !important;top:50% !important*/}
.mainPopup .mainP_wrap .mainP_tit>strong{font-size:18px}
.mainPopup .mainP_wrap .mainP_con .mainP_txt{padding: 20px;line-height: 19px; font-size:14px;}

.mainPopup .mMid{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
}