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

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

/*
#93DAFF	#98DFFF	#9DE4FF	#A2E9FF	#A7EEFF	#ACF3FF	#B0F7FF	#B4FBFF	#B9FFFF	#C0FFFF
#87CEFA	#91D8FA	#A5D8FA	#AFDDFA	#B9E2FA	#C3E7FA	#CDECFA	#D7F1FA	#E1F6FA	#EBFBFF
#00BFFF	#0AC9FF	#14D3FF	#1EDDFF	#28E7FF	#32F1FF	#3CFBFF	#46FFFF	#96FFFF	#C8FFFF
#00A5FF	#00AFFF	#00B9FF	#00C3FF	#00CDFF	#00D7FF	#00E1FF	#00EBFF	#00F5FF	#00FFFF
#1EA4FF	#28AEFF	#32B8FF	#3CC2FF	#46CCFF	#50D6FF	#5AE0FF	#6EE0FF	#6EEAFF	#78F3FF
#1E90FF	#289AFF	#32A4FF	#3CAEFF	#46B8FF	#50C2FF	#5ACCFF	#64D6FF	#6EE0FF	#78EAFF
#96A5FF	#A0AFFF	#AAB9FF	#B4C3FF	#BECDFF	#C8D7FF	#D2E1FF	#DCEBFF	#E8F5FF	#F4FFFF
#86A5FF	#90AFFF	#9AB9FF	#A4C3FF	#AECDFF	#B8D7FF	#CCE1FF	#E0EBFF	#EBF5FF	#F9FFFF
#6495ED	#6E9FED	#78A9ED	#82B3ED	#8CBDED	#96C7ED	#A0D1F7	#AADBFF	#B4E5FF	#BEEFFF
#0078FF	#0A82FF	#148CFF	#1E96FF	#28A0FF	#32AAFF	#3CB4FF	#46BEFF	#50C8FF	#5AD2FF
#0064FF	#0A6EFF	#1478FF	#1E82FF	#288CFF	#3296FF	#3CA0FF	#46AAFF	#50B4FF	#5ABEFF
#0000FF	#3232FF	#5050FF	#646EFF	#6478FF	#6482FF	#648CFF	#6496FF	#64A0FF	#64AAFF
#4169E1	#4B73E1	#557DE1	#5F87E1	#6991E1	#739BE1	#7DA5E1	#87AFEB	#91B9F5	#9BC3FF
#0064CD	#0A6ECD	#1478CD	#1E82CD	#288CD2	#3296D7	#3CA0E1	#46AAEB	#50B4F5	#5ABEF5
#5A5AFF	#6464FF	#6E6EFF	#7878FF	#8282FF	#8C8CFF	#A0A0FF	#B4B4FF	#C8C8FF	#D2D2FF
#7B68EE	#8572EE	#8F7CEE	#9986EE	#A390EE	#AD9AEE	#B7A4EE	#C1AEEE	#CBB8EE	#D5C2EE
#6A5ACD	#7E6ECD	#8878CD	#9282CD	#9C8CCD	#A696CD	#B0A0CD	#BAAAD7	#C4B4E1	#CEBEE1
#0000CD	#2828CD	#4646CD	#6464CD	#6E6ED7	#7878E1	#8282EB	#8C8CF5	#9696FF	#A0A0FF
#00008C	#14148C	#28288C	#3C3C8C	#50508C	#646496	#7878AA	#8C8CBE	#A0A0C8	#B4B4DC
#483D8B	#52478B	#5C518B	#665B8B	#70658B	#7A6F95	#84799F	#8E83A9	#988DB3	#A297BD
#000069	#1E3269	#323C73	#3C467D	#3C5087	#3C5A91	#46649B	#506EA5	#5A78AF	#6482B9


*/


/*	ime-mode		*/
.ime-d, .TEL, .HP, .EMAIL, .Number { ime-mode:disabled; }
.ime-a { ime-mode:active; }
/*	button	*/
button { cursor:pointer }

a { color:#06b7f0;}
a:hover, a:active, a:focus { color:#06b7f0; outline:none; text-decoration:none; }
p { margin-bottom:1.5em; }
h1, h2, h3, h4, h5, h6 { font-weight:bold; margin:0 0 30px 0; }
hr { border-top: 1px solid #ddd; }
::-webkit-selection { color:#fff; background:#06b7f0; }
::-moz-selection { color:#fff; background:#06b7f0; }
::selection { color:#fff; background:#06b7f0; }
/*
::-webkit-scrollbar { display:none; }
*/

/*	animate	*/
a { -webkit-transition:0.5s; -o-transition:0.5s; transition:0.5s; }

table caption { position:absolute; left:-200%; top:auto; width:1px; height:1px; overflow:hidden; }



/******************
	bootstrap 호환
******************/
.form-horizontal { margin:30px auto;}
.page-header { margin-top:0; padding-top:40px;}





html { height:100%;}
body { min-height:100%; }

/******************
	font
	Nanum Gothic Coding
	Jua
******************/
body { color:#000; font-family:'Nanum Gothic', sans-serif; font-size:16px; line-height:1.6; }

/******************
	z-index
******************/
#header { z-index:4000; }
#nav-toggle { z-index:8000; }
#loginWrapper { z-index:9999; }
#Content { z-index:1; }
footer { z-index:3000; }

/******************
	layout
******************/
#wrapper { width:100%; height:100%; margin:0; padding:80px 0 0 0; position:relative; top:0; left:0; bottom:0; right:0; background-color:#FFF; }
/*	header	*/
#header { display:block; position:fixed; top:0; left:0; width:100%; height:80px; -webkit-transition:0.5s; -o-transition:0.5s; transition:0.5s; }
/*	헤더 이벤트 이미지 bg	*/
#header {background-color:#FFF;  }


/*	header nav	*/
#header .navbar { margin:0; min-height:80px; border-bottom:solid 3px; position:relative; }
#header .navbar-default { background: url(https://www.espot.co.kr/images/event/Btype/header_bg.png) no-repeat center top; background-color:#fff; border-color:#d7d8da; }
header .nav-header { min-height:80px; }
header .nav-header .navbar-toggle { margin-top:18px; }
header .navbar .navbar-brand { margin:13px 45px 0 0; padding:0; }
header .navbar .navbar-nav {}

header .navbar-fixed-top .navbar-collapse { max-height: none; width:100%; }
header .navbar-fixed-top .navbar-collapse .navbar-nav { height: 100vh; }

header .navbar .navbar-nav>li { margin-top:21px; }
header .navbar .navbar-nav>li a { font-size:14px; line-height:1.3666; text-transform:uppercase; padding-top:8px; padding-bottom:8px; }
.navbar-default .navbar-nav>li>a { color:#000; }

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover { color:#000; background-color:transparent; }
header .navbar .navbar-right { margin-top:10px; }
header .navbar .navbar-right .btn { padding:6px 16px; }
header .navbar .navbar-right .btn-black { color:#000; background-color:transparent; border-color:#000; }
header .navbar .navbar-right .btn-black:hover { color:#fff; background-color:#000; border-color:#000; }
#header.nav-up { top:-77px; }
#header .scroll-progress { border-top:solid 3px #f00606; position:absolute; bottom:-3px; }
header .navbar .navbar-nav>li.TopMenuNotice { display:block; }
header .navbar .navbar-nav>li.cusMenu { display:block; }


@media (min-width:768px) {
	header .nav-header { min-height:0; }
	header .navbar-fixed-top .navbar-collapse .navbar-nav { height:auto; }
	header .navbar .navbar-nav>li.TopMenuNotice { display:none; }
	header .navbar .navbar-nav>li.cusMenu { display:none; }
}
@media (min-width:992px) {
	header .navbar .navbar-nav>li.TopMenuNotice { display:block; }
	header .navbar .navbar-nav>li.cusMenu { display:none; }
}
@media (min-width:1200px) {
	header .navbar .navbar-nav>li.TopMenuNotice { display:block; }
	header .navbar .navbar-nav>li.cusMenu { display:block; }
}


/*	Content	*/
#Content { width:100%; min-height:400px; position:relative; margin:0;}
/*
#Content { -webkit-transition:0.5s; -o-transition:0.5s; transition:0.5s; }
*/




/*	footer	*/
footer { display:block; width:100%; padding:20px 0 20px; background-color:#242d37; position:relative; color:#EBFBFF; font-size:9pt; }
footer section h5 { margin:30px 0 4px; font-weight:400; color:#969fa8; letter-spacing:2px; text-transform:uppercase; }
footer section li a { padding:3px 0; display:inline-block; }
footer a { font-size:14px; color:#fff; }
footer a:focus,
footer a:hover { color:#06b7f0; text-decoration:none; }

footer .footerNav { padding-bottom:0px; margin-bottom:15px; border-bottom:solid 1px #e3e3e336; }
footer .footerNav ul {}
footer .footerNav ul li { display:block; }
footer .footerNav ul li a { display:block; padding: 7px 8px; }
footer .footerNav {}

footer .customerCenter { margin: 15px 15px 15px 0;}
footer .customerCenter h5 { display:inline-block; margin:0 20px 0 0; padding:0; font-size:16px;}
footer .customerCenter ul { display:block; margin:0; padding:0;}
footer .customerCenter ul li { display:block; margin:0 15px 0 0; padding:0; }
footer .customerCenter a.cusTel { color:#06b7f0; font-size:30px; font-weight:800; }
@media (min-width:768px) {
	footer .footerNav ul li { display:inline-block;}
	footer .customerCenter { margin:0 0 30px 0;}
	footer .customerCenter h5 { display:inline-block; margin:0 20px 0 0; padding:0; font-size:12px;}
	footer .customerCenter ul { display:inline-block; margin:0; padding:0;}
	footer .customerCenter ul li { display:inline-block; margin:0 15px 0 0; padding:0;}
	footer .customerCenter a.cusTel { color:#06b7f0; font-size:16px; font-weight:800; }
}
footer .footerinfo { padding:30px 0; }
footer .footerinfo dl { margin-bottom:0; }
footer .footerinfo dl dt,
footer .footerinfo dl dd { display:inline-block; }
footer .footerinfo dl dd:after { content:" "; display:block; float:right; width:100%; }
footer .footerinfo dl dt { padding-right:8px; }
footer .footerinfo dl dd { padding-right:0; }

footer #copyright {	}
footer #copyright { text-align:center;	}
footer #copyright p { font-size:9pt; margin:15px 0; text-align:center; color:#CCC; }

@media (min-width:768px) {
	footer #copyright p { margin:0; }

	footer section h5 { margin-top:0; margin-bottom:15px; }
	footer .footerinfo dl { margin-bottom:10px; }
	footer .footerinfo dl dd { padding-right:20px; }
	footer .footerinfo dl dt,
	footer .footerinfo dl dd { display:inline-block; }

}
@media (min-width:992px) {


}
@media (min-width:1200px) {


}


/**********************************
	공통 세션
**********************************/
.section,
.section-fluid,
.section-emphasis { padding-top:50px; padding-bottom:70px; position:relative; }
.section { background-color:#fff; }
.section-fluid { background-color:#f4f5f7; }
.section-fluid hr { border-top: 1px solid #ccc; }
.section-emphasis { background-color:#242d37; color:#fff; }
.section-emphasis hr { border-top: 1px solid #fff; }
.section h1 { margin-bottom:50px; }

.title-section { padding-top:70px; padding-bottom:90px; }
.title-section h2 {}



/**********************************
	메인
**********************************/
/*	Content	*/
.main #Content section { padding-top:70px; padding-bottom:70px; }
#Content .padding0 { padding:0; }



@media (min-width:768px) {


}
@media (min-width:992px) {

}
@media (min-width:1200px) {

}


/**********************************
	서브
**********************************/
.subpages { }



@media (min-width:768px) {


}
@media (min-width:992px) {

}
@media (min-width:1200px) {

}



/**********************************
	UI Element
**********************************/
/*	큰 설명글	*/
.explanation { font-size:12pt; margin-bottom:30px; }

/*	폼그룸 하위 라벨	*/
form label+label { margin-left:15px; }

/*	well 안에 form	*/
.well form { margin:0; }


/*	Alert */
.alert.alert-danger,
.alert.alert-info,
.alert.alert-success { position:relative; padding:70px 15px 15px 15px; min-height:100px; }

.alert.alert-danger:before { position:absolute; left:15px; top:5px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f071"; font-size:36px; color:#EE8588; }
.alert.alert-info:before { position:absolute; left:15px; top:5px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f05a"; font-size:36px; color:#7ecaf2; }
.alert.alert-success:before { position:absolute; left:15px; top:5px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f058"; font-size:36px; color:#8abd8b; }

@media (min-width:768px) {
	.alert.alert-danger,
	.alert.alert-info,
	.alert.alert-success { padding:15px 15px 15px 100px; min-height:80px; }
	.alert.alert-danger:before { position:absolute; left:20px; top:5px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f071"; font-size:48px; color:#EE8588; }
	.alert.alert-info:before { position:absolute; left:20px; top:5px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f05a"; font-size:48px; color:#7ecaf2; }
	.alert.alert-success:before { position:absolute; left:20px; top:5px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f058"; font-size:48px; color:#8abd8b; }
}


/* h2 아이콘 <i class="fas fa-file-download"></i>	*/
h2 { position:relative; }
h2 svg { position:absolute; top:-50%; right:0; color: rgba(126, 202, 242,0.5); }


/*	Step	*/
.step { margin-bottom:30px;}
.step h2 {}
.step ul { padding:0; margin:0; list-style:none; }
.step ul li { display:inline-block; margin-right:-4px; vertical-align:top; border:solid 1px #ddd; background-color:#f4f5f7; padding:30px; position:relative; height:100%; }
.step ul li h3 { margin:0; color:#01afe8; font-weight:bold; display:inline-block; }
.step ul li h3 small { color:#01afe8; font-size:85%; font-weight:600; color:#01afe8; margin-left:15px; }
.step ul li h4 { margin:0 0 0 15px; display:inline-block; }
.step ul li p { margin:15px 0 0 0;}
.step ul li .arrow { border-top:15px solid transparent; border-bottom:15px solid transparent; border-left:15px solid #f4f5f7; border-right:0; }
.step ul li .arrow.arrow-color { right:-500%; top:32px; position:absolute; z-index:800; }
.step ul li .arrow.arrow-border { right:-500%; top:32px; border-left-color:#ddd; position:absolute; z-index:799; }

.step ul li.active { background-color:#e4e5e6; }
.step ul li.active .arrow { border-left:15px solid #e4e5e6; }
.step ul li.active .arrow.arrow-color {  }
.step ul li.active .arrow.arrow-border { border-left-color:#e4e5e6; }

.step.step2 ul li { width:100%; }
.step.step3 ul li { width:100%; }
.step.step4 ul li { width:100%; }
.step.step5 ul li { width:100%; }


@media (min-width:768px) {
	.step ul li h3 { margin:0; color:#01afe8; font-weight:bold; display:block; }
	.step ul li h4 { margin:20px 0 0 0; display:block; }
	.step ul li .arrow.arrow-color { right:-15px; }
	.step ul li .arrow.arrow-border { right:-17px; }
	.step.step2 ul li { width:50%; }
	.step.step3 ul li { width:33.33%; }
	.step.step4 ul li { width:25%; }
	.step.step5 ul li { width:20%; }

}
@media (min-width:992px) {
	.step.step2 ul li { width:50%; }
	.step.step3 ul li { width:33.33%; }
	.step.step4 ul li { width:25%; }
	.step.step5 ul li { width:20%; }
}
@media (min-width:1200px) {

}



/*	priceTable 	*/
.tablePrice { border:none; font-size:9pt; margin-bottom:50px; }
.tablePrice thead { background-color:#FFF; }
.tablePrice thead th { padding:15px 0; font-size:2em; color:#333; }
.tablePrice thead th.student { border-bottom:solid 5px #0C6;}
.tablePrice thead th.adult { border-bottom:solid 5px #01afe8}
.tablePrice thead td { font-weight:400; }
.tablePrice tbody { border-top:solid 3px #ddd; }
.tablePrice tbody tr { }
.tablePrice tbody th {  }
.tablePrice tbody td { border-left:solid 1px #ddd; border-bottom: solid 1px #ddd; font-weight:400; }
.tablePrice tbody th,
.tablePrice tbody td { padding:15px 5px; }
.tablePrice thead th,
.tablePrice thead td,
.tablePrice tbody th,
.tablePrice tbody td,
.tablePrice tfoot td,
.tablePrice tfoot th { text-align:center; }
.tablePrice tfoot { border-top:solid 3px #ddd; }
.tablePrice tfoot tr { }
.tablePrice tfoot th { }
.tablePrice tfoot td { }
.tablePrice tfoot th,
.tablePrice tfoot td { padding:15px 5px; }
.tablePrice tbody .won { font-weight:600; color:#333; }
.tablePrice tbody .fa-check { font-size:1.2em; color:#01afe8; }
.tablePrice tbody .fa-times { font-size:1.2em; color:#999; }
.tablePrice tfoot .buttonRow { display:none; }
.tablePrice tfoot .won { color:#01afe8; font-weight:600; font-size:1.3em; }

/*	정보 Table 	*/
.table_info { font-size:9pt; margin-bottom:50px; }
.table_info th,
.table_info td { padding:15px 10px !important; }

@media (min-width:768px) {
	.tablePrice { font-size:10pt; }
	.tablePrice tfoot .buttonRow { display:table-row; }
	.tablePrice tfoot td .btn { padding: 5px; font-size: 14px; font-weight:600; line-height: 1.3333333; border-radius: 3px; }
	.table_info { font-size:10pt; }
}
@media (min-width:992px) {
	.tablePrice { font-size:11pt; }
	.tablePrice tfoot td .btn { padding: 10px 16px; font-size: 18px; border-radius: 6px; }
	.table_info { font-size:11pt; }

}
@media (min-width:1200px) {
	.tablePrice { font-size:12pt; }
	.table_info { font-size:12pt; }

}

/* 버튼 xs 사이즈에서는 블럭	*/
.btn-auto { display:block; width:100%; }
@media (min-width:768px) { .btn-auto { display:inline-block; width:auto; } }


/*	list-check	*/
.list-check { list-style:none; font-size:12pt; }
.list-check li:before { font-family:'Font Awesome 5 Free'; font-weight:900; content:"\f00c"; margin-left:-30px; width:29px; display:inline-block; color:#7ebd38; }

/*	TapNav	*/
.TapNav { margin-top:30px; background-color:#FFFFFFF01; }
.TapNav .nav-tabs > li > a { position:relative; display:block; padding:13px 15px; margin-right:2px; line-height:1.6; border:0 solid transparent; border-radius:0; color:#000; font-size:14px; -webkit-transition:0s; -o-transition:0s; transition:0s; }
.TapNav .nav-tabs > li.active > a { padding-bottom:0; }
.TapNav .nav-tabs > li > a:hover { background-color:transparent; }
.TapNav .nav-tabs > li.active > a,
.TapNav .nav-tabs > li.active > a:hover,
.TapNav .nav-tabs > li.active > a:focus { color:#01aee8; background-color:transparent; border:0 solid #ddd; border-bottom-color:transparent; cursor:default; font-weight:600; }
.TapNav .nav-tabs > li.active > a:after { content:''; height:3px; background-color:#14b5e9; display:block; margin-top:10px; }
.tab-content { margin-top:0px; }

/*	SubTapNav	*/
.sub_tab { margin-top:5px; background-color:#FFFFFFF01; }
.sub_tab .nav-tabs > li > a { position:relative; display:block; padding:13px 15px; margin-right:2px; line-height:1.6; border:0 solid transparent; border-radius:0; color:#000; font-size:14px; -webkit-transition:0s; -o-transition:0s; transition:0s; }
.sub_tab .nav-tabs > li.active > a { padding-bottom:0; }
.sub_tab .nav-tabs > li > a:hover { background-color:transparent; }
.sub_tab .nav-tabs > li.active > a,
.sub_tab .nav-tabs > li.active > a:hover,
.sub_tab .nav-tabs > li.active > a:focus { color:#01aee8; background-color:transparent; border:0 solid #ddd; border-bottom-color:transparent; cursor:default; font-weight:600; }
.sub_tab .nav-tabs > li.active > a:after { content:''; height:3px; background-color:#14b5e9; display:block; margin-top:10px; }
.sub_tab .container { padding-left:25px; padding-right:25px; }



/*	특징	feature	col 하단에 div 사용하면 않됨	*/
.feature { margin-top:50px; }
.feature > div + div { border-left: 1px solid #e2e4e8; padding-left: 20px; padding-top:30px; }
.feature > div h4 { text-align:center; }
.feature > div h4 img { display:block; }
.feature > div h4 img,
.feature > div h4 svg,
.feature > div h4 .svg-inline--fa { font-size:60px !important; color:#0080c3; margin-bottom:30px; }
.feature > div h4 {}
.feature > div p { color:#4b525d;}

.feature .featureText { font-size:18px; padding:25px; }
.feature .featureText p { margin-bottom:8px; }
.feature .featureImg { margin-bottom:50px; }
.feature .featureText.orange i,
.feature .featureText.orange svg,
.feature .featureText.orange strong,
.feature .featureText.orange q strong { color:#f39b2a; }
.feature .featureText.orange q strong { color: #fff; background: #f39b2a; }
.feature .featureText.blue i,
.feature .featureText.blue svg,
.feature .featureText.blue strong,
.feature .featureText.blue q strong { color:#26a6de; }
.feature .featureText.blue q strong {	color: #fff; background: #26a6de;  }
.feature + .row { margin-top:50px; }

@media (min-width:768px) {
	.feature > div + div { border-left: 1px solid #e2e4e8; padding-left: 20px; padding-top:0; }
	.feature > div h4 { text-align:left; }
	.feature .featureText { min-height:250px;}
}


/*	classflow	흐름	*/
.classflow { margin-top:50px; padding:0; list-style:none; }
.classflow li { margin-bottom:20px; }
.classflow li h4 { display:block; width:100%; padding-top:10px; margin-bottom:15px; }
.classflow li h4 small { display:inline-block; margin-left:20px; padding-top:15px;}
.classflow li > div { display:block; border-left:none; border-top:dotted 2px #0080c3; padding-bottom:30px; padding-top:20px; }

.classflow .classflowsub {}
.classflow .classflowsub li { margin-bottom: 15px; }
.classflow .classflowsub li h5 { margin-bottom:8px; }

@media (min-width:768px) {
	.classflow li h4 { display:table-cell; width:150px; padding-top:10px; }
	.classflow li h4 small { display:block; padding-top:15px; margin-left:0;}
	.classflow li > div { display:table-cell; border-left:dotted 2px #0080c3; border-top:none; padding-bottom:30px; padding-top:10px; padding-left:40px; }
	.classflow li > div > ul,
	.classflow li > div > ol { padding:0; }
}


/*	CircleList	*/
.CircleList { margin-bottom:50px; }
.CircleList ul,
.CircleList ol { list-style:none; text-align:center; padding:0; }

.CircleList ul li,
.CircleList ol li { display: inline-block; height: 100px; width: 100px; border: solid 15px #01afe8; border-radius: 50%; padding: 10px; margin: 0 -9px; }


/*	border right, left, top, bottom	*/
.border-right { border-right:1px solid #efefef; }
.border-left { border-left:1px solid #efefef; }
.border-top { border-top:1px solid #efefef; }
.border-bottom { border-bottom:1px solid #efefef; }


/*	padding box	*/
.padingBox3020 { padding:30px 20px; }


/*	debulULList	*/
.debulULList > ul { padding:0; list-style:none; }
.debulULList > ul > li { margin-bottom:30px; }
.debulULList > ul > li h4 { margin-bottom:15px; }
.debulULList > ul > li > ul { padding-left:20px; }


/*	verticalDotlineList	*/
.verticalDotlineList { margin-bottom:50px; padding:0; border-left:dotted 4px #d2d2d2; }
.verticalDotlineList li { margin-left:7px; padding-left:10px; }