@charset "UTF-8";

/* reset.css */
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1; font-size: 14px;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a {text-decoration: none;}

/* common */
strong {font-weight: 500;}
.clearfix::after {content: ""; display: block; clear: both;}
.floatL {float: left;}
.floatR {float: right;}
.hide {display: none;}
.w10 {width: 10% !important;}
.w20 {width: 20% !important;}
.w30 {width: 30% !important;}
.w40 {width: 40% !important;}
.w50 {width: 50% !important;}
.w55 {width: 55% !important;}
.w70 {width: 70% !important;}
.w80 {width: 80% !important;}
.w90 {width: 90% !important;}
.w100 {width: 100% !important;}
.btn-wrap {margin-top: 40px;}
.btn {display: block; color: #fff; width: 140px; border-radius: 4px; padding: 8px 0; font-size: .875em; letter-spacing: -.5px;}
.btn.disabled, .btn:disabled {color: #fff !important; background-color: #707070; border: none !important;}
.btn:hover {color: #fff;}
.bg_green {background-color: #49a203;}
.bg_black {background-color: #333;}
.bg_blue{background-color: #005bab;}
.list-green {padding-left: 24px; background: url("../img/icon_index_green.png") no-repeat left 2px/18px;}
.list-blue {padding-left: 20px; background: url("../img/icon_index_blue.png") no-repeat left 4px/16px;}
.text-blue {color: #019bcc;}
.text-blue a {color: #019bcc;}
.input-form {padding: 8px 10px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; font-size: .875em; color: #333; vertical-align: middle;}
.input-select {padding: 8px 10px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; font-size: .875em; color: #333; vertical-align: middle;}
.intro-box{background-color: #e2ecf6; padding: 12px 16px; margin: 20px 0; font-size: .875em; line-height: 1.4; letter-spacing: -.5px; border-radius: 4px; color: #505050;}
/* .info-box{background-color: #FCF2CE; padding: 12px; margin: 20px 0; font-size: .875em; line-height: 1.4; letter-spacing: -.5px; border-radius: 4px;} */
.info-box{background-color: #FCF2CE; padding: 12px; margin: 20px 0; line-height: 1.4; letter-spacing: -.5px; border-radius: 4px; font-size: 1rem; font-weight: 500;}
.intro-box .arrow-ul {margin-top: 10px;}
.arrow-ul li {margin-bottom: .25rem; line-height: 1.3; position: relative; padding-left: .75rem;}
.arrow-ul li:last-of-type {margin-bottom: 0;}
.arrow-ul li::before {content: ""; position: absolute; left: 0; top: .4rem; height: 5px; width: 5px; border: 1px solid #3ba8e8; border-width: 2px 2px 0 0; transform: rotate(45deg);}
.disc-ul{list-style: disc; padding-left: 1.2em; margin: 10px 0;}
.disc-ul li{line-height: 1.3em;}
.link-btn {display: block; padding: 5px; border-radius: 4px; background-color: #ebf3ff; color: #297eff; border: 1px solid #297eff; text-align: center;}

/* contents */
body {font-family: 'Noto Sans KR', sans-serif !important; color: #333;}

/* header */
.container {margin-top: 28px; margin-bottom: 40px;}
#header {background-color: #23536e; padding: 20px; box-shadow: 0 4px 30px rgb(0 0 0 / 10%);}
#header>div {display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
#header>div h1 {color: #fff; font-size: 1em; font-weight: 500; letter-spacing: -.5px;}
#header>div img {display: block; width: 56px; margin-left: 10px;}

/* stepbox */
.progress_bar {margin-bottom: 30px; display: -ms-flexbox; display: -webkit-box; display: flex; border: 1px solid #ccc; overflow: hidden;}
.progress_bar li {width: 33.333333%; font-size: 16px; padding: .6em 1em .6em 1em; box-sizing: border-box; position: relative;}
.progress_bar li:nth-of-type(2) {padding-left: 1.8em;}
.progress_bar li:nth-of-type(3) {padding-left: 1.5em;}
.progress_bar li.active {background-color: #00b1ea;}
.progress_bar li.active>* {color: #fff !important;}
.progress_bar li::before, .progress_bar li::after {content: ""; position: absolute; top: 50%; margin-top: -1.8em; border-top: 1.8em solid transparent; border-bottom: 1.8em solid transparent; border-left: 1em solid; right: -.8em;}
.progress_bar li::before {border-left-color: #ccc; right: -.85em; z-index: 1;}
.progress_bar li::after {z-index: 2; border-left-color: #fff;}
.progress_bar li.active::before {border-left-color: #00b1ea;}
.progress_bar li.active::after {border-left-color: #00b1ea;}
.progress_bar li>* {display: block; text-align: center;}
.progress_bar li span {font-size: .5em; color: #888; margin-bottom: 4px;}
.progress_bar li strong {font-size: .75em; color: #777; letter-spacing: -.5px; white-space: nowrap;}

/* table */
.table {margin: 0; border-top: 1px solid #aaa; border-bottom: 1px solid #aaa;}
.table tr:not(:last-child) {border-bottom: 1px solid #ccc;}
.table th {background-color: #f0f0f0; font-size: .875em; font-weight: 500; letter-spacing: -.5px; vertical-align: middle; word-break: keep-all; line-height: 1.2;}
.table td {font-size: .875em; color: #666; vertical-align: middle; letter-spacing: -.5px;}
.table tr .btn {display: inline-block; width: 60px;}
.table .table-text {margin-top: 6px; font-size: .75em; letter-spacing: -.5px; color: #707070; line-height: 1.2;}

/* form table */
.form-list {border-top: 1px solid #999; border-bottom: 1px solid #999;}
.form-list li {padding: 16px 10px; border-bottom: 1px solid #ccc;}
.form-list li:last-child {border-bottom: none;}
.form-list .form-tit {margin-bottom: 10px; font-size: .875em; font-weight: 500; letter-spacing: -.5px;}
.form-list .form-con .btn {display: inline-block; width: 18%;}
.form-list .form-con .form-text {margin-top: 6px; font-size: .75em; letter-spacing: -.5px; color: #707070; line-height: 1.2;}

/* list design */
.container .process-list {width: 95%; margin: 20px auto 14px; letter-spacing: -.5px;}
.container .process-list>li:not(:last-child) {margin-bottom: 16px;}
.container .process-list>li h3 {margin-bottom: 10px; font-size: .938em; color: #333; font-weight: 500;}
.container .process-list>li h3 i {color: #0b405e;}
.container .process-list>li:last-child h3 {margin-bottom: 0;}
.container .process-list>li p{padding: 0 10px; font-size: .875em; line-height: 1.5; color: #555; list-style-type: "-"; list-style-position: inside;}
.container .process-list>li img {width: 100px;}
.container .tit {font-weight: 500; font-size: 1em;}
.container .list-blue {line-height: 1.4; font-size: .875em; letter-spacing: -.5px; color: #606060;}
.container .list-blue:not(:last-child) {margin-bottom: 8px;}
.container .list-blue span {color: #808080;}

.container .check-wrap {background: #f0f0f0; padding: 16px 0; margin-bottom: 30px;}
.container .check-wrap>div {width: 93%; max-width: 400px; margin: 0 auto; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.container .check-wrap>div label {display: block; width: calc(35% - 35px); font-size: .875em; letter-spacing: -.5px; font-weight: 500; color: #333; word-break: keep-all; line-height: 1.2;}
.container .check-wrap>div .input-form {display: block; width: calc(62% - 35px);}
.container .check-wrap>div button {width: 70px;}

.container .text-box {line-height: 1.4; letter-spacing: -.5px; font-size: 0.938em;}
.container .text-box .list-green {background-position: left 4px;}

/* lms video */
.container .video-tit {position: relative; margin-bottom: 32px; padding-left: 16px; font-size: 1.125em; font-weight: 600; color: #333;}
.container .video-tit::before {position: absolute; left: 0; top: 50%; transform: translateY(-50%); content: ""; display: block; width: 8px; height: 8px; background-color: #49a203;}
.container .video-tit::after {position: absolute; left: 0; bottom: -12px; content: ""; display: block; width: 100%; height: 1px; background-color: #ccc;}
.container .video-wrap {border-bottom: 1px solid #ccc; margin: 30px 0 20px; padding-bottom: 20px;}
.container .video-wrap .video-box {display: none;}
.container .video-wrap .video-box.active {display: block;}
.container .video-wrap video {width: 100% !important; height: auto !important;}
.container .video-wrap .btn-wrap {margin-top: 20px;}
.container .video-wrap .video-btn-group {width: 80%;}
.container .video-wrap .video-btn-group .video-btn {width: 17%; float: left; margin-right: 8px; color: #0a5b89; border: 1px solid #0a5b89;}
.container .video-wrap .video-btn-group .video-btn:last-of-type {margin-right: 0;}
.container .video-wrap .video-btn.active {color: #fff; background-color: #0a5b89; font-weight: 500;}
.container .video-wrap .btn-wrap>.floatR.btn {width: 20%;}
.myPlayer-dimensions, .video2-dimensions, .video3-dimensions, .video4-dimensions, .video5-dimensions, .video-youtube {width: 100%; height: auto;}
.video-js .vjs-tech {width: 100%; height: auto; position: static !important;}


/* 230310 문의처 테이블 추가 */
.contact_wrap {margin-top: 40px; background-color: #f3f3f3; padding: 20px 10px; border-radius:6px;}
.contact_wrap h2.tit {text-align: center; background-color: #3c6cbd; margin: 0 auto 12px; padding: 6px 0; width: 85%; color: #fff; border-radius: 50px;}
.contact_wrap .table {margin-top: 10px;}
.contact_wrap .table th {background-color: #ebf3fa;}
.contact_wrap .table td {background-color: #fff;}
.contact_wrap .table th, .contact_wrap .table td {padding: 0.5rem 0.15rem; text-align: center;}
.contact_wrap .table tbody tr:first-of-type {border-bottom: none;}
.contact_wrap .table tbody tr td:first-of-type {border-right: 1px solid #ccc;}
.contact_wrap .table .table_desc td {font-size: .75em; color: #555; padding: 4px 2px; font-weight: 400; text-align: center; background-color: #fff6c6;}
/* 230313 유입 사이트 로고 추가 */
.logo-wrap {margin-top: 40px; display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; webkit-box-pack: center; ms-flex-pack: center; justify-content: center;}
.logo-wrap+.btn-wrap {margin-top: 10px;}
.logo-wrap img {display: inline-block; width: 150px;}


@media all and (min-width:576px) {
	body {font-size: 16px;}
	.container {max-width: 90%;}
	.progress_bar li span {font-size: .75em;}
	.progress_bar li strong {font-size: .875em;}
	.contact_wrap {padding: 20px 30px;}
	.contact_wrap .table th, .contact_wrap .table td {padding: 0.5rem 0.5rem;}
	.video-youtube {width: 580px; height: 315px;}
}

/*ellen 작업*/
em{color: red; margin: 0 4px;}
.authNum-tr{display: none;}
.timer-div{display: none;}
.infoMsg-span{display: none;}
.cb-tr{display: none;}
input.form-control[type="file"] { font-size: 0.9em; }
.form-control[readonly] {font-size: .875em;}
.file_manage a.del { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23343a40' class='bi bi-trash' viewBox='0 0 16 16'%3E%3Cpath d='M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z'/%3E%3Cpath fill-rule='evenodd' d='M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4L4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z'/%3E%3C/svg%3E") no-repeat; width: 1rem; height: 1rem; background-size: contain; display: inline-block; vertical-align: middle; margin: 0 10px; }
.table_area .file_manage li { padding: .2rem 0; }
.text-box.info{margin-top:4%; font-size: 0.8em; color: gray;}
p.center-info-txt{margin-top:0.4rem; color:red; display:none;}
p.center-info-txt2{margin-top:0.4rem; color:red; display:none;}
p.center-info-txt3{margin-top:0.4rem; color:red; display:none;}
p.center-info-txt4{margin-top:0.4rem; color:red; display:none;}
p.center-info-txt5{margin-top:0.4rem; color:red; display:none;}
p.center-info-txt6{margin-top:0.4rem; color:red; display:none;}

/* bootstrap modal */
.modal-dialog.modal-center {top: 50%; transform: translateY(-50%) !important;}
.modal-content .modal-header {background: #3A5764; border-bottom: none;}
.modal-content .modal-header .modal-title {font-weight: 500; letter-spacing: -.5px; color: #fff;}
.modal-content .modal-header button.close {border: none; background: none; color: #fff;}
#modalPrivacy .modal-content {max-height: 87vh; border: none;}
#modalPrivacy .modal-body {padding: 1.5rem 1.5rem 2rem; overflow-y: auto; font-size: .938em; color: #656565; letter-spacing: -.5px; line-height: 1.4;}
#modalPrivacy .modal-body p:not(:last-of-type) {margin-bottom: 1rem;}
#modalPrivacy .modal-body p:first-of-type {margin-bottom: 1.45rem; padding-bottom: 1rem; border-bottom: 1px solid #ccc;}
#modalPrivacy .modal-body p strong {display: block; margin-bottom: .35rem; color: #333;}

#modalSignature .modal-content {max-height: 87vh; border: none;}
#modalSignature .modal-body {padding: 1.5rem 1.5rem 2rem; overflow-y: auto; font-size: .938em; color: #656565; letter-spacing: -.5px; line-height: 1.4;}
#modalSignature .modal-body p:not(:last-of-type) {margin-bottom: 1rem;}
#modalSignature .modal-body p:first-of-type {margin-bottom: 1.45rem; padding-bottom: 1rem; border-bottom: 1px solid #ccc;}
#modalSignature .modal-body p strong {display: block; margin-bottom: .35rem; color: #333;}

/* jquery datepicker */
.ui-widget-header { border: 0px solid #dddddd; background: #fff; }
.ui-datepicker-calendar>thead>tr>th { font-size: 14px !important; }
.ui-datepicker .ui-datepicker-header { position: relative; padding: 6px 0; }
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active { border: 0px solid #c5c5c5; background: transparent; font-weight: normal; color: #454545; text-align: center; }
.ui-datepicker .ui-datepicker-title { margin: 0 0em; margin-bottom: 6px; line-height: 16px; text-align: center; font-size: 14px; padding: 0px; font-weight: bold; }
.ui-datepicker { display: none; background-color: #fff; border-radius: 10px; margin-top: 10px; margin-left: 0px; margin-right: 0px; padding: 14px; padding-bottom: 10px; width: 276px; box-shadow: 3px 3px 9px 1px rgba(125, 125, 125, 0.25); }
.ui-widget.ui-widget-content { border: 1px solid #eee; font-family: 'Noto Sans KR', sans-serif !important;}
#datepicker:focus>.ui-datepicker { display: block; }
.ui-datepicker-prev,
.ui-datepicker-next { cursor: pointer; }
.ui-datepicker-next { float: right; }
.ui-state-disabled { cursor: auto; color: hsla(0, 0%, 80%, 1); }
.ui-datepicker-title { text-align: center; padding: 10px; font-weight: 100; font-size: 20px; }
.ui-datepicker-title select {border: 1px solid #ccc; padding: 4px 10px 4px 2px; border-radius: 4px;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {width: auto;}
.ui-datepicker select.ui-datepicker-year {margin-right: 1%;}
.ui-datepicker select.ui-datepicker-month {margin-left: 4%;}
.ui-datepicker-calendar { width: 100%; }
.ui-datepicker-calendar>thead>tr>th { padding: 5px; padding-bottom: 10px; font-size: 20px; font-weight: 400; }
.ui-datepicker-calendar>tbody>tr>td>a { color: #333; font-size: 12px !important; font-weight: bold; text-decoration: none; padding-top: 6px; padding-bottom: 6px;}
.ui-datepicker-calendar>tbody>tr>td>span {padding-top: 6px; padding-bottom: 6px;}
.ui-datepicker-calendar>tbody>tr>.ui-state-disabled:hover { cursor: auto; background-color: #fff; }
.ui-datepicker-calendar>tbody>tr>td { border-radius: 100%; width: 44px; height: 30px; cursor: pointer; padding: 4px; font-weight: 100; text-align: center; font-size: 12px; }
.ui-datepicker-calendar>tbody>tr>td:hover { background-color: transparent; opacity: 0.6; }
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus { border: 0px solid #cccccc; background: transparent; font-weight: normal; color: #2b2b2b; }
.ui-widget-header .ui-icon { background-image: url('../img/navi/btns.png'); }
.ui-icon-circle-triangle-e { background-position: -20px 0px; background-size: 36px; }
.ui-icon-circle-triangle-w { background-position: -0px -0px; background-size: 36px; }
.ui-datepicker-calendar>tbody>tr>td:first-child a { color: red !important; }
.ui-datepicker-calendar>tbody>tr>td:last-child a { color: #0099ff !important; }
.ui-datepicker-calendar>thead>tr>th:first-child { color: red !important; }
.ui-datepicker-calendar>thead>tr>th:last-child { color: #0099ff !important; }
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight { border: 0px; background: #333; color: #fff; border-radius: 4px; padding-top: 7px; padding-bottom: 7px; }
.inp { padding: 10px 10px; background-color: #f1f1f1; border-radius: 4px; border: 0px; }
.inp:focus { outline: none; background-color: #eee; }
/* 약관동의 */
.terms_contents { margin: .8rem 0 2rem; color: #898989; font-size: .9rem; height: 120px; min-height: 120px; width: 100%; overflow-y: auto; resize: none; text-align: left; white-space: pre-line; }
/* font 강조 */
.black_emphasizing { font-weight: bold; color: #393e46; text-decoration: underline; } 	   /* 밑줄 없음 */
.black_underemphasizing { font-weight: bold; color: #393e46; text-decoration: underline; } /* 밑줄 포함 */
/* font color & 강조 */
.font_blue_bold { color: #0d6efd !important; font-weight: bold; }
.font_red_bold { color: #dc3545 !important; font-weight: bold; }
.font_green_bold { color: #459d3b !important; font-weight: bold; }
.font_gray_bold { color: #8d8d8d !important; font-weight: bold; }
.font_blue { color: #0d6efd !important; }
.font_red { color: #dc3545 !important; }
.font_green { color: #459d3b !important; }
.font_gray { color: #8d8d8d !important; }