
.clearfix {clear:both;display:block;content:"";}
.cfix:after {clear:both;display:block;content:"";}
.none {display:none!important;}
.bold {font-weight:bold;}
.normal {font-weight: normal;}
.left {float: left!important;}
.right {float: right!important;}
.text-left {text-align: left!important;}
.text-center {text-align:center!important;}
.border-none {border:0;}

.v-middle {vertical-align:middle!important;}
.v-bottom {vertical-align:bottom;}

.width100 {width:100%;}

.btn a {color:#fff;text-decoration: none;}
.btn:visited {color: #fff!important;}
.btn:active {color: #fff!important;}
.btn:hover {color: #fff!important;}

.f-white {color:#fff!important;}
.f-black {color:#000000!important;}
/*.f-blue {color:#345391;}*/
.f-blue {color:#457fe6;}
.f-grey1 {color:#9b9ea3;}
.f-grey2 {color:#4e5259;}

.font12 {font-size:12px;}
.font14 {font-size:14px;}
.font16 {font-size:16px;}
.font18 {font-size:18px;}
.font20 {font-size:20px;}
.font22 {font-size:22px;}
.font24 {font-size:24px;}
.font26 {font-size:26px;}

.t-overflow {
	overflow: hidden;
	display: inline-block;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	text-overflow:ellipsis;
	white-space:nowrap;
	word-wrap:normal;
}

.m-center {margin:0 auto;}

.mtop0 {margin-top:0!important;}
.mtop5 {margin-top:5px;}
.mtop10 {margin-top:10px;}
.mtop15 {margin-top:15px;}
.mtop20 {margin-top:20px;}
.mtop30 {margin-top:30px;}
.mtop40 {margin-top:40px;}
.mtop45 {margin-top:45px;}
.mtop50 {margin-top:40px;}
.mtop60 {margin-top:60px;}
.mtop70 {margin-top:70px;}
.mtop80 {margin-top:80px;}
.mtop90 {margin-top:90px;}
.mtop100 {margin-top:80px;}
.mtop150 {margin-top:150px;}
.mbottom0 {margin-bottom:0!important;}
.mbottom5 {margin-bottom:5px;}
.mbottom10 {margin-bottom:10px;}
.mbottom20 {margin-bottom:20px;}
.mbottom30 {margin-bottom:30px;}
.mbottom40 {margin-bottom:40px;}
.mbottom45 {margin-bottom:45px;}
.mbottom50 {margin-bottom:25px;}
.mbottom60 {margin-bottom:60px;}
.mbottom70 {margin-bottom:70px;}
.mbottom80 {margin-bottom:80px;}
.mbottom90 {margin-bottom:90px;}
.mbottom100 {margin-bottom:100px;}
.mleft10 {margin-left:10px;}
.mright10 {margin-right:10px;}

.ptop0 {padding-top:0!important;}
.ptop10 {padding-top:10px;}
.ptop20 {padding-top:20px;}
.ptop30 {padding-top:30px;}
.ptop40 {padding-top:40px;}
.ptop45 {padding-top:45px;}
.ptop50 {padding-top:50px;}
.ptop60 {padding-top:60px;}
.ptop70 {padding-top:70px;}
.ptop80 {padding-top:80px;}
.ptop90 {padding-top:90px;}
.ptop100 {padding-top:100px;}
.ptop150 {padding-top:150px;}
.pbottom0 {padding-bottom:0!important;}
.pbottom10 {padding-bottom:10px;}
.pbottom20 {padding-bottom:20px;}
.pbottom30 {padding-bottom:30px;}
.pbottom40 {padding-bottom:40px;}
.pbottom45 {padding-bottom:45px;}
.pbottom50 {padding-bottom:50px;}
.pbottom60 {padding-bottom:60px;}
.pbottom70 {padding-bottom:70px;}
.pbottom80 {padding-bottom:80px;}
.pbottom90 {padding-bottom:90px;}
.pbottom100 {padding-bottom:100px;}
.pleft3 {padding-left:3px;}
.pleft5 {padding-left:5px;}
.pleft10 {padding-left:10px;}
.pleft20 {padding-left:20px;}
.pright3 {padding-right:3px;}
.pright5 {padding-right:5px;}
.pright10 {padding-right:10px;}


header { width:100%; background-color: #fff;margin-top:0px;}
header div.logo {text-align:center;padding:10px 0;}
header div.util {width:100%;height:30px;background-color:#f4f4f4}
header div.util ul {padding-right:20px;float:right}
header div.util ul li {float:left;padding:0 20px;line-height:30px}
header div.util ul li a {font-size:13px;color:#4e5259}

/*nav a.navbar-brand {font-weight: 500!important;}*/
nav.navbar {width:100%;margin-top: 110px;	background-color:#4e88ff;	border:0;color:#fff; z-index: 99999;}
nav.navbar li.dropdown > a {color:#fff;}
nav.navbar li.dropdown > a:hover {color:#d3d6db; font-weight: bold;}
.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {max-height:400px!important;}
.dropdown-menu {background-color: #f4f4f4!important;}

#main-visual{
	position:relative;
	width:100%;min-height:600px;
	margin-top:30px;
	background-image:url(../images/main/main.jpeg);
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
  /*background-attachment:fixed;*/
}

#main-title {width:90%;height:480px;position:absolute;left:50%;margin-left:-45%;top:12%;background:rgba(255,255,255,.9);padding:0 10px}
#main-title h2 {font-size:2.5em;font-weight:600;text-align: center;}

#main-title h2.title-1 {margin:45px 0 10px; position:relative; opacity:0;animation:h2move 1s linear;	animation-fill-mode:forwards;}
#main-title h2.title-2 {position:relative; opacity:0;animation:pmove 1s linear 1s;	animation-fill-mode:forwards;}

img.main-logo {
	width:300px;opacity:0;position:absolute;left:50%;bottom:-80px;margin-left:-150px;
	animation:imgmove 1s linear 2s;  animation-fill-mode:forwards;
}


@keyframes h2move {
	0% {top:-40px;opacity:0;}
	100% {top:0px;opacity:1;}
}
@keyframes pmove {
	0% {left:-40px;opacity:0;}
	100% {left:0px;opacity:1;}
}
@keyframes imgmove {
	0% {bottom:-80px;opacity:0;}
	100% {bottom:30px;opacity:1;}
}

.ie9 body #main-title h2.title-1 {opacity:1;top:0;}
.ie9 body #main-title h2.title-2 {opacity:1;left:0;}
.ie9 body #main-title img.main-logo {opacity:1;bottom:0;}

.row {padding: 40px 0 30px;}

.class {
	display:block;margin:0 auto;
	width: 100%;height: 100%; 
	/*border: 10px solid transparent;*/
}

.common_title h1{font-size:36px}

.article-1 div {padding:0!important}
.article-2 {width:100%;background-color:#f9f9f9}
.article-2 .con {width:310px;height:280px;background-color: #fff;}
.article-2 .con-1 {padding:0 10px; border:3px solid #333}
.article-2 .con-1 table th {text-align: center;}

.article-2 .con-1 .table th:nth-child(1) {width:70%}
.article-2 .con-1 .table th:nth-child(2)  {width:30%}
.article-2 .con-1 .table td:nth-child(1) {width:70%}
.article-2 .con-1 .table td:nth-child(2)  {width:30%}

.article-2 .con-1 table td {padding:5px;}
.article-2 .con-1 table td.title {text-align:left;}
.article-2 .con-1 table td a {width:170px;}
.article-2 .con-2 {width:310px;height:130px;}
.article-2 .con-2 img {width:100%;height:100%}
.article-2 .con-2-1 {margin-bottom:20px;}
.article-2 p {width:100%;background-color: #fff;height:50px;line-height:50px;text-align:center;font-size:20px;margin:0;}
.article-2 .con-3 embed {width:100%;height:230px;}
.article-2 img {width:100%;}

.article-3 {background-color:#9b9ea3;padding:15px 0;}
.article-3 .row {padding:10px 0;}
.article-3 h2 {color:#fff;}
.article-3 .con {width:auto;height:75px;background-color: #9b9ea3;margin:3px auto}
.article-3 .con img {width:100%;}

#footer {width:100%;background-color:#30508B;padding:15px 0 0;}
#footer p {color:#fff;}
#footer .util {width:100%;height:40px;}
#footer .util ul {float:right;padding:10px 0;}
#footer .util ul li{float:left;margin-left:30px;font-size: 14px;}
#footer .util ul li a {color:#fff;}
#yakkwan pre {white-space:pre-wrap;}
#gaeinjeongbo pre {white-space:pre-wrap;}
#eyong pre {white-space:pre-wrap;}
#footer .info {margin-top:15px;height:180px;}

#footer .info img {width:90%;}
#footer .info p {color:#fff!important}
#footer .copyright {width:100%;padding:10px 0;}
#footer .copyright p {text-align: center;font-size:12px}


.shadow:hover {
	-ms-transform:translateY(-2px);
	-moz-transform:translateY(-2px);
	-webkit-transform:translateY(-2px);
	transform:translateY(-2px);
	-ms-box-shadow:0px 7px 15px 3px #aaa;
	-moz-box-shadow:0px 7px 15px 3px #aaa;
	-webkit-box-shadow:0px 7px 15px 3px #aaa;
	box-shadow:0px 7px 15px 3px #aaa;
	transition:.2s;
}

.shadow2:hover {
	-ms-transform:translateY(-7px);
	-moz-transform:translateY(-7px);
	-webkit-transform:translateY(-7px);
	transform:translateY(-7px);

	transition:.2s;
}

/* 占싯억옙 */
.popup {
  width:80%;max-width:460px;padding:20px;
  position:absolute;top:25%;left:50%;margin-left:-230px;
  background:#fff;border:5px solid #DB3400;z-index:9999;
}
.popup .pop_header {padding-bottom:20px;border-bottom:2px solid #000}
.popup .pop_body {padding:20px 0;}
.popup .pop_body p {font-size:16px}
.popup .pop_body img {width:100%!important;margin:0!important}
.popup .pop_footer {text-align:center;}
.popup .pop_footer .bottom_btn {margin:0 auto}
.popup .pop_footer button ,
.popup .pop_footer a {width:100px;height:35px;}




.edu-logo {height:63px;}
.go-top {width:50px;height:50px;margin:50px auto;cursor:pointer;}


h2 {text-align: center;}

ul.sub-gnb {margin:25px auto 10px;}
ul.sub-gnb:after {clear:both;display:block;content:"";}
ul.sub-gnb li {height:45px;text-align:center;border:1px solid #fff;background-color:#ccc;}
ul.sub-gnb li.select {background-color:#9b9ea3;}
ul.sub-gnb li a {color:#fff;font-size:18px;font-weight:bold;line-height:45px;
	width: 100%; height:100%; display: block; /*2018 �� �쇱씤 二쇨�*/
}

.navbar-default .navbar-toggle .icon-bar {background-color:#fff;}

.sub-content {margin-top:20px;}
.sub-title {width:100%;height:50px;background-color:#769be4;color:#fff;line-height: 50px;padding-left:30px;font-size:20px;}

.thumbnail {padding:0;border: none;border-radius: 0;height:320px;position:relative;}
.thumbnail_2 {height:auto!important}
.thumbnail img {margin-bottom:5px;}
.thumbnail p {margin-top: 7px;color: #4e5259;}

.jwplayer {width:100%!important;max-width:640px;}

.edu-logo {float:none!important;}
.edu-logo img {float:right}
.edu-logo:after {clear:both;display:block;content:"";}

object {width:100%!important;max-width:560px;}
object embed {width:100%!important;max-width:560px;}



#intro-hello p {font-size:16px;}

#intro-curri table tr th {text-align: center;background-color:#9b9ea3;color:#f4f4f4;vertical-align:middle;}
#intro-curri table tr td {background-color:#f4f4f4;vertical-align: middle;}

#intro-process .sub-content ul {width:100%;padding:0 15px}
#intro-process .sub-content ul li {height:150px;font-size:1.3em;background-color:#6bdda1;color:#fff;border:1px solid #fff;text-align: center;padding:45px 10px 0}
#intro-process .sub-content ul li:nth-child(1){background-color:#6fe4cb}
#intro-process .sub-content ul li:nth-child(2){background-color:#63dbb9}
#intro-process .sub-content ul li:nth-child(3){background-color:#55d1a5}
#intro-process .sub-content ul li:nth-child(4){background-color:#48c3a5}
#intro-process .sub-content ul li:nth-child(5){background-color:#38b473}
#intro-process .warning_note h4 {width:100%;height:50px;line-height:50px;font-size:20px;text-align:center;font-weight:bold;background-color:#f8d92b;color:#fff;margin:0}

#intro-process .warning_note_con {width:100%;padding:20px 0 20px 50px;background-color:#feffd9;}
#intro-process .warning_note_con p {font-size:16px;line-height: 18px;}

#intro-hello .daummap {width:100%;margin:50px auto;}
#intro-hello .note {width:100%;padding:30px 40px 20px;background-color:#f4f4f4;}
#intro-hello .note p {font-size:18px;font-weight:500;}
#map {height:500px;}
#row {height:269px;
		background-image:url(../images/process.jpg); 
		background-repeat:no-repeat;
		background-size:auto;}


/**/
/*#class-list .sub-content {margin-top:50px;}*/
#class-list .thumbnail .btn {
	position:absolute;top:15px;right:20px;padding:3px 5px;color:#fff;font-size:13px;
	border: 1px solid #fff;background:rgba(0,0,0,.4);border-radius: 0;transition: .2s;
}
/*#class-list .thumbnail .btn {display:block;margin:0 auto;padding: 10px 20px;	border: 1px solid #d3d6db;background-color: #fff;border-radius: 0;transition: .2s;}*/

#class-list .thumbnail .btn:hover, .thumbnail .btn:focus {background-color: #345391;color: #fff;}
#class-list .thumbnail .btn a:hover, .thumbnail .btn a:focus {color: #fff;}
#class-list .thumbnail img {width:95%;height:55%}
#class-list .sub-content .paid_btn {width:100%;height:60px;background-color:#345391;margin-bottom:15px;}
#class-list .sub-content .basket_btn {width:100%;height:60px;background-color:#9b9ea3;}
#class-list .sub-content .apply_btn {width:100%;height:60px;background-color:#4e5259;}
#class-list .sub-content .paypal_btn {width:100%;height:60px;background-color:#ffc439;}
/*#class-list .sub-content h3 {margin-top:50px;}*/
/*#class-list .sub-content img {width:95%;}*/

/*#class-list .sub-content img.jwlogo {width:auto;}*/
#class-list .sub-content img.jwlogo {width:0;} /*2018 edit*/
#class-list .sub-content .paid_class_li {width:100%;height:60px;line-height:60px;background-color:#345391;text-align: center;}


.btn-delete {background-color:#9b9ea3;color:#fff;}
.btn-modify {background-color:#4e5259;color:#fff;}

/* 占쌉쏙옙占쏙옙 占쏙옙占쏙옙트*/
.board-list table th.num {width:8%;}
.board-list table th.check {width:8%;}
.board-list table th.title {width:50%;}
.board-list table th.writer {width:15%;}
.board-list table th.date {width:15%;}
.board-list table th ,.board-list table td {text-align:center;}
.board-list table td.title {text-align:left;}
.board-list table td.checkbox {margin:0}
.board-list table td.checkbox input {text-align:center;margin:0 auto}
.board-list table td.checkbox input[type=checkbox]{margin:0 auto}
.board-list div.pagination-box {margin:0 auto;text-align: center;position:relative;}
.board-list div.pagination-box .btn {position:absolute;right:0;}
.board-list .go-top {margin-top:100px;}

/* 占쌉쏙옙占쏙옙 占쏙옙占쏙옙占쏙옙占쏙옙占쏙옙 */
pre {white-space:pre-wrap}
.board-detail table tr td {text-align:left;}
.board-detail table tr.info td{background-color:#f4f4f4;}
.board-detail table tr td p {margin:15px 0;}
.board-detail table tr td img {width:100%;}

/* Q & A */
#reply_write {display:none;height:0;}



/* 占쏙옙틸占쏙옙티 */
table.basket td {vertical-align: middle!important;}
table.basket tfoot tr td {font-size:18px;}
.panel-body p {padding-top:7px;}
.panel-complete .panel-footer {background-color:#30508B;}
.panel-complete .panel-footer h4 {color:#fff;}

/*占쏙옙占쏙옙占쏙옙占쏙옙 - 占싱듸옙占쏙옙 占쏙옙占쏙옙*/
.col-xs-15,.col-sm-15,.col-md-15,.col-lg-15 {position:relative;min-height: 1px;padding-right: 10px;padding-left: 10px;}
.col-xs-15 {width:20%;float:left;}

/* 2018 add(main-menu) */
.dropdown-menu > li > a {
	height: 30px;
}


.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
	background: #e7e7e7;
	font-weight: bold;
}

.navbar-nav > li > .dropdown-menu {
	min-width: 100px;
}

@media screen and (min-width:1400px) {
	#main-title h2 {font-size:2.7em;}
}

@media screen and (min-width:992px) {
	.col-md-2 {width:20%}
}

@media screen and (max-width:1399px){
	/*#main-title {top:12%;}*/
	#main-title h2 {font-size:2.5em;}
}
@media screen and (max-width:1020px){
	.wrap {width:992px}
}
#row {height:450px;
		background-image:url(../img/process_p.jpg); 
		background-repeat:no-repeat;
		background-size:contain;}

@media screen and (max-width:991px){
	.wrap {width:768px}
	.logo img {width:240px;margin-top:5px;margin-bottom:5px}
	/*#main-title h2 {font-size:2.7em;}*/
	nav.navbar {margin-top:110px;}

	.article-1 .class {width:100%}

    /*.article-2 .row {margin-left:0;}*/
	/*.article-2 .con-1 {margin-left:15px;}*/
	.article-2 .con-1 table td a {width:200px}
	.article-2 .con {width:340px}
	.article-2 .con-2 {width:340px;height:140px;margin-top:20px;}
	.article-2 .con-2-2 {float:right}
	.article-2 .con-3 {float:right;margin-top:-462px;}
	.article-2 img {margin-left:0;}
	.article-3 .con {height:65px;}
	.article-3 .con img {width:100%;}

	#footer .info img {width:77%;}

	#class-list .thumbnail img {height:45%}
	.thumbnail {height:280px;}
	.sub-title {font-size:16px;padding-left:20px;}
	ul.sub-gnb li a {font-size:16px;}
	#intro-process .warning_note_con p {font-size:16px;}
	/*#class-list .sub-content .paid_btn {width:91.5%;}*/

	#intro-hello .note p {font-size:16px;font-weight:400;}
	#map {height:450px;}


}
	#row {height:450px;
		background-image:url(../img/process_p.jpg); 
		background-repeat:no-repeat;
		background-size:contain;}


@media screen and (max-width:767px){
/*�묒� 硫붿씤 硫붾돱 �깆옣*/
	.mtop50 {margin-top:35px;}

	.popup {margin-left:-40%;}

	h2 {font-size:24px}

	header div.util ul {padding-right:0}
	header div.util ul li {padding:0 15px}

	.wrap {width:95%;max-width:640px}
	#main-title {height:430px;top:10%;}
	#main-title h2 {font-size:2em;}
	img.main-logo {width:260px;left:50%;margin-left:-130px}
	#main-visual{min-height:520px;}
	/*.article-1 {margin-left:25px;}*/
	/*.article-2 .con-1 {margin-left:60px;}*/
	/*.article-2 .con-2	{margin-left:45px;}*/
	.article-2 .con {margin:0 auto}
	.article-2 .con-2 {margin:15px auto}
	.article-2 .con-2-2 {float:none}
	.article-2 .con-3 {float:none;margin-top:20px}
	.article-3 .con {text-align:center}
	.article-3 .con img {width:80%}

	#footer .util ul {float:none;}
	#footer .info img {width:100%;}
	#footer .info p {font-size:12px;}
	ul.sub-gnb li.first a {line-height: 25px;}
	#class-list .thumbnail img {height:200px}
	.thumbnail {height:310px;}
	.sub-title {font-size:14px;padding-left:10px;}
	#intro-hello p {font-size:14px;}
	#intro-process .warning_note_con {padding:15px;}
	#class-list .sub-content .apply_btn {margin-top:15px;}

	#intro-hello .note {padding:20px 20px 10px}
	#intro-hello .note p {font-size:14px;}
	#map {height:400px;}

	#row {height:600px;
		background-image:url(../img/process_m.jpg); 
		background-repeat:no-repeat;
		background-size:auto;}

}

@media screen and (max-width:479px){
	.table{font-size: 11px;}
	.mtop30 {margin-top:15px;}
	.mtop50 {margin-top:25px;}
	
	.font16 {font-size:11px;}
	.font18 {font-size:12px;}
	.font20 {font-size:14px;}

	.row {padding:20px 0}
	header div.util ul li {padding:0 6.5px}
	header div.util ul li a {font-size:11.5px}

	header div.logo {padding:14px 0}
	.logo img {width:200px;}

	.wrap {width:100%}
	#main-title {height:310px;top:11%;}
	#main-title h2 {font-size:1.4em;}
	#main-title h2.title-1 {margin-top:20px;}
	img.main-logo {width:200px;margin-left:-100px;}
	#main-visual{min-height:380px;}
	.article-1 img {width:100%;}

	.article-2 .con-1 table td a {width:160px} 
	.article-2 .con-1 {width:100%;}
	.article-2 .con-2 {width:100%;height:150px;}
	.article-2 .con-3 {width:100%;float:none;margin:15px auto}
	.article-3 .con {height:60px;margin:0 auto;}
	.article-3 .con img {width:90%}

	#footer .util ul li{margin-left:12px;font-size: 12px;}
	#footer .info {height:auto;}
	#footer .info img {width:40%;margin:0 auto 10px;display:none}
	#footer p {margin-bottom:5px!important;font-size:12px;}
	#footer .copyright {margin-top:10px;}
	#footer .copyright p {text-align:left;padding:0;padding-left:15px}

	#class-list .thumbnail img {width:100%;height:62%;}
	#class-list .thumbnail p {font-size:12px;padding-left:3px;padding-right:3px;margin-top:5px;margin-bottom:0}
	.thumbnail {height:250px;}
	ul.sub-gnb li.first a {line-height: 50px;}
	ul.sub-gnb li a {font-size:14px;font-weight:500;}
	#intro-process .sub-content .row {width:100%;margin:0;}
	#intro-process .sub-content ul {padding:0;}
	#intro-process .sub-content ul li {font-size:16px;padding-top:35px;height:120px}
	#intro-process > .sub-content > p.f-blue {font-size:14px!important;padding:10px;}
	#intro-process .warning_note_con {padding:10px;}
	#intro-process .warning_note_con p {font-size:14px;}
	#intro-hello .note {padding:10px;}
	#intro-hello .note p {font-size:14px;}
	.common_title h1{font-size:12px}
	
	#class-list .sub-content h3 {font-size:20px;}
	.board-list div.pagination-box .btn {width:100%;bottom:-100%;right:0;}

	table.basket .thum {display:none;}
    
	.col-xs-6 {padding-right:0;padding-left:0;}
	.col-xxxs-12{width:100%;position:relative;min-height:1px;padding-right:15px;padding-left:15px;}

	#map {height:300px;}
	#row {height:400px;
		background-image:url(../img/process_m.jpg); 
		background-repeat:no-repeat;
		background-size:contain;}

}



@media screen and (max-width:320px)



{.wrap {width:300px};

#map {height:200px;}
#row {height:300px;
		background-image:url(../img/process_m.jpg); 
		background-repeat:no-repeat;
		background-size:contain;}


}
