#side {position: absolute; top:650px; right:30px;}




#main_benner{overflow:hidden;width:100%; height: 500px; position: relative; z-index:5}

#main_benner .main_con .move{position:absolute; z-index:100; top:50%; margin-top:-250px; width:100%; display:none}
#main_benner .main_con .prev {display:block; position:absolute; left:0}
#main_benner .main_con .next{display:block; position:absolute; right:0}
.next, .prev{position: absolute; top:250px;  text-indent: -9999px; width: 88px; height: 88px; z-index: 10}
.next{right: -470px; background-image:url(/img_dy/btn_next.png)  }
.prev{left: 470px; background-image:url(/img_dy/btn_prev.png)  }





#main_benner .dark{position: absolute;  z-index:500; width: 1000px; left:50%;height: 500px;background: rgba(0,0,0,0.2);}
#main_benner .d_right{margin-left:500px; }
#main_benner .d_left{margin-left:-1500px; }

#main_benner .main_con{ position: absolute;  z-index: 100; width: 1000px; left:50%; margin-left: -500px;height: 500px;}



#main_benner ul.main_benner_img{;position:absolute;width:4000px;height:500px;}
#main_benner ul.main_benner_img li{width: 1000px; height:500px;float: left; display: block;} 
#main_benner ul.main_benner_img li a{display: block; width:1000px; height: 500px; position:absolute; }
#main_benner ul.main_benner_img li img{position: absolute;}




#main_benner ul.main_benner_img li.benner1 a{background:url(/img_jjh/main1.jpg) no-repeat bottom right;}
#main_benner ul.main_benner_img li.benner2 a{background:url(/img_jjh/main2.jpg) no-repeat bottom right;}
#main_benner ul.main_benner_img li.benner3 a{background:url(/img_jjh/main3.jpg) no-repeat bottom right;}
#main_benner ul.main_benner_img li.benner4 a{background:url(/img_jjh/main4.jpg) no-repeat bottom right;}
/*
#main_benner ul.main_benner_img li.benner4 a{background:url(/main/images/main/benner_understanding.jpg) no-repeat bottom right;}
#main_benner ul.main_benner_img li.benner5 a{background:url(/main/images/main/benner_cha.jpg) no-repeat bottom right;}
#main_benner ul.main_benner_img li.benner6 a{background:url(/main/images/main/benner_editorial.jpg) no-repeat bottom right;}
#main_benner ul.main_benner_img li.benner7 a{background:url(/main/images/main/benner_pre.jpg) no-repeat bottom right;}
*/

#main_benner ul.main_benner_img li .benner_title{top:70px; left:50px;}
#main_benner ul.main_benner_img li .benner_bar{top:130px; left:50px;}
#main_benner ul.main_benner_img li p{margin-top:155px;margin-left: 50px; line-height: 25px; color: #333333; font-size: 14px;}
/*main benner finish*/


.main_3_benner { width: 980px; margin:35px auto 30px;}
.main_3_benner a {width: 310px; height:250px; display: block; }
.main_3_benner a{width: 300px; float: left; margin-right:24px;}
.main_3_benner a:last-child{margin-right:0;}
.main_3_benner:after{content:""; display:block; clear:both;} 


.main_3_benner a img {opacity: 1;
	
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	 -moz-border-radius: 3px;
	 -webkit-border-radius: 3px;

	 /* Opera */
	 box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* Firefox */
	 -moz-box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* Safiri, Chrome */
	 -webkit-box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* IE */
	 filter:progid:DXImageTransform.Microsoft.Shadow(color=rgba(0,0,0,0.30),direction=135, strength=20);
	 
	 margin-bottom: 17px;}


.main_3_benner a em{font-weight: bold; color: black;font-size: 14px;}
.main_3_benner a em span{font-size: 12px; color:#666666;font-weight: 100; text-align: center;}
.main_3_benner a p {margin-top:17px;font-size: 12px; font-weight: 100; color:#666666;line-height: 18px;}

/*main 3 benner finish*/

#color{background-color:#f1eee3; padding:55px 0;}
#wrap {width: 980px; margin:0 auto;background-color:#f1eee3;}
#wrap:after{content:""; display:block; clear:both;}

#wrap .class {width: 670px; float: left;}
#wrap .class:after{content:""; display:block; clear:both;}
#wrap .class .small:after{content:""; display:block; clear:both;}
#wrap .class #class_nav li{float: left; margin-right:20px;cursor:pointer;}
#wrap .class #class_nav:after{content:""; display:block; clear:both;} 

#wrap .class #class_nav .all_title { display:block;width: 88px; height: 24px; background-image:  url(/main/images/main/class_btn_all_off.png);text-indent: -99999px}
#wrap .class #class_nav .diploma_title {display:block;width: 88px; height: 24px; background-image:url(/main/images/main/class_btn_diploma_off.png);text-indent: -99999px}
#wrap .class #class_nav .workshop_title {display:block;width: 74px; height: 24px; background-image:url(/main/images/main/class_btn_warkshop_off.png);text-indent: -99999px}
#wrap .class #class_nav .seminar_title {display:block;width: 74px; height: 24px; background-image:url(/main/images/main/class_btn_seminar_off.png);text-indent: -99999px}

#wrap .class #class_nav .all_title:hover {background-image:  url(/main/images/main/class_btn_all_on.png);}
#wrap .class #class_nav .diploma_title:hover  {background-image:url(/main/images/main/class_btn_diploma_on.png)}
#wrap .class #class_nav .workshop_title:hover  {background-image:url(/main/images/main/class_btn_workshop_on.png)}
#wrap .class #class_nav .seminar_title:hover {background-image:url(/main/images/main/class_btn_seminar_on.png)}

#wrap .class #class_nav div div {float: right;margin-left:5px;}

#wrap .class #class_nav div div.layout_3{background-image:url(/main/images/main/btn_3_off.png);width: 29px;height: 29px; cursor:pointer}
#wrap .class #class_nav div div.layout_2{background-image:url(/main/images/main/btn_2_on.png);width: 29px;height: 29px; cursor:pointer}
#wrap .class #class_nav>div {margin-right:25px;}







/*size_big*/


.size{padding-top:25px;}
.size:after{content: "";display: block; clear: both;}
.size .all{display: block ;width:300px; height: 300px; margin:0 25px 25px 0;float: left;
						
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	 -moz-border-radius: 3px;
	 -webkit-border-radius: 3px;

	 /* Opera */
	 box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* Firefox */
	 -moz-box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* Safiri, Chrome */
	 -webkit-box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* IE */
	 filter:progid:DXImageTransform.Microsoft.Shadow(color=rgba(0,0,0,0.30),direction=135, strength=20);
	
	
}

.card_3{position:absolute;top:240px; left:17px;}
.card_2{position:absolute;top:220px; left:17px;}
.size .all .big_hover .card_3{top:230px; left:25px;}
.size .all .big_hover .card_2{top:230px; left:25px;}

.size .all .big_hover{display: none;
					background:rgba(255,255,255,0.92);
					
					height:240px;
					padding:30px;
										
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	 -moz-border-radius: 3px;
	 -webkit-border-radius: 3px;

	 	position: relative; 
					
						
}

.size .all .big_hover em{display:block;font-size: 14px; font-weight: bold; padding-bottom: 30px; border-bottom: 1px solid #cfcfcf}
.size .all .big_hover p{font-size: 12px;padding-top:10px;line-height: 18px;}
.size .all .big_hover span{background:url(/main/images/main/img_open.png) no-repeat left ;
							font-size: 12px; font-weight: bold;display: block;  
							width: 500px; height: 15px;
							padding-left:45px;
							position:absolute;
							bottom:30px;}

.size .all .big_hover

.a{background: url(/main/images/main/uxds_big.jpg)}
.webpro{background:url(/main/images/main/webpro_bic.jpg)}
.c{background:url(/main/images/main/understanding_big.jpg)}
.d{background:url(/main/images/main/cha_big.jpg)}
.e{background:url(/main/images/main/dps_big.jpg)}
.f{background:url(/main/images/main/understend_big.jpg)}
.c-semninar{background:url(../images/main/c-seminar.jpg) }
.wmgs{background:url(../images/main/wmgs_big.jpg) }
.wmgsn{background: url(../images/main/wmgsn_big.jpg)}
.wppa{background:url(/main/images/main/webpro_bic.jpg)}
.uxdea{background:url(../images/main/uxdea_big.jpg) }
.character{background:url(/main/images/main/cha_big.jpg)}
.calligraphy{background: url(../images/main/calligraphy_big.jpg)}
.smartmobile{background:url(../images/main/smartmobile_big.jpg) }
.wmgsp{background:url(../images/main/wmgsp_big.jpg) }
.americano2{background: url(../images/main/americano2_big.jpg)}
.typo{background: url(../images/main/typo_big.jpg)}
.uxdef{background:url(../images/main/uxdef_big.jpg) }
.uxde{background: url(../images/main/uxde_big.jpg)}
.editorial{background: url(../images/main/editorial_big.jpg)}
.imagesmaking{background:url(../images/main/imagesmaking_big.jpg) }
.infographic{background: url(../images/main/infographic_big.jpg)}
.americano3{background:url(../images/main/americano3_big.jpg) }
.prediploma{background:url(../images/main/pre_big.jpg) }
.jquery{background:url(../images/main/jquery_big.jpg) }
.understanding{background:url(../images/main/understanding_big.jpg)}
.understanding_up{background:url(../images/main/understanding_up_big.jpg) }
.uxseminar{background:url(../images/main/uxseminar_big.jpg) }
.visualinterface{background:url(../images/main/visualinterface_big.jpg)}
.onestop{background:url(../images/main/onestop_big.jpg)}
.collage{background:url(../images/main/collage_big.jpg)}
.jobseminar1{background:url(../images/main/job_seminar1_big.jpg)}
.jobseminar2{background:url(../images/main/job_seminar2_big.jpg)}
.emoticon{background:url(../images/main/emoticon_big.jpg)}
.darttoy{background:url(../images/main/3darttoy_big.jpg)}
.mobiledesigntrend{background:url(../images/main/mobiledesigntrend_big.jpg)}
.grid{background:url(../images/main/grid_big.jpg)}
.mxds{background:url( ../images/main/mxds_big.jpg)}
/*size_big _finish*/
/*size_smaill*/


.small{padding-top:25px;}
.small .all{display: block ;width:190px; height: 430px; margin:0 20px 23px 0;float: left; 
						
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	 -moz-border-radius: 3px;
	 -webkit-border-radius: 3px;

	 /* Opera */
	 box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* Firefox */
	 -moz-box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* Safiri, Chrome */
	 -webkit-box-shadow:0 0 5px rgba(0,0,0,0.30);
	 /* IE */
	 filter:progid:DXImageTransform.Microsoft.Shadow(color=rgba(0,0,0,0.30),direction=135, strength=20);
	
	background-color:#ffffff;
	
}
.small .all .big_hover{
						
					padding:20px;
					position: relative; 
					height: 460px;
					
						
}

.small .all .big_hover em{display:block;font-size: 14px; font-weight: bold; padding-bottom: 20px; border-bottom: 1px solid #cfcfcf; padding-top: 150px;line-height: 20px;}
.small .all .big_hover p{font-size: 12px;padding-top:10px;line-height: 18px;}
.small .all .big_hover span{background:url(/main/images/main/img_open.png) no-repeat left ;
							font-size: 12px; font-weight: bold;display: block;  
							width: 500px; height: 15px;
							padding-left:45px;
							position:absolute;
							bottom:80px;}



.small .a{background: url(/main/images/main/uxds_small.jpg) no-repeat top; background-color: white;}
/*.small .webpro{background:url(/main/images/main/webpro_small.jpg) no-repeat top;background-color: white;}*/
.small .c-semninar{background:url(/main/images/main/c-seminar-small.jpg) no-repeat top;background-color: white;}

.small .c{background:url(/main/images/main/understanding_small.jpg) no-repeat top;background-color: white;}
.small .d{background:url(/main/images/main/ch_small.jpg) no-repeat top;background-color: white;}
.small .e{background:url(/main/images/main/dps_small.jpg) no-repeat top;background-color: white;}
.small .f{background:url(/main/images/main/understand_small.jpg) no-repeat top;background-color: white;}

.small .wmgs{background:url(../images/main/wmgs_small.jpg)no-repeat top;background-color: white; }
.small .wmgsn{background:url(../images/main/wmgsn_small.jpg)no-repeat top;background-color: white;  }
.small .webpro{background:url(/main/images/main/webpro_small.jpg) no-repeat top;background-color: white;}
.small .uxdea{background:url(../images/main/uxdea_small.jpg) no-repeat top;background-color: white; }
.small .character{background:url(/main/images/main/ch_small.jpg) no-repeat top;background-color: white;}
.small .calligraphy{background: url(../images/main/calligraphy_small.jpg)no-repeat top;background-color: white; }
.small .smartmobile{background:url(../images/main/smartmobile_small.jpg)no-repeat top;background-color: white; }
.small .wmgsp{background: url(../images/main/wmgsp_small.jpg)no-repeat top;background-color: white; }
.small .americano2{background: url(../images/main/americano2_small.jpg)no-repeat top;background-color: white; }
.small .typo{background: url(../images/main/typo_small.jpg)no-repeat top;background-color: white;}
.small .uxdef{background: url(../images/main/uxdef_small.jpg)no-repeat top;background-color: white; }
.small .uxde{background:url(../images/main/uxde_small.jpg)no-repeat top;background-color: white; }
.small .editorial{background:url(../images/main/editorial_small.jpg)no-repeat top;background-color: white; }
.small .imagesmaking{background:url(../images/main/imagesmaking_small.jpg)no-repeat top;background-color: white;  }
.small .infographic{background:url(../images/main/infographic_small.jpg)no-repeat top;background-color: white;  }
.small .americano3{background:url(../images/main/americano3_small.jpg)no-repeat top;background-color: white;  }
.small .prediploma{background: url(../images/main/pre_small.jpg)no-repeat top;background-color: white; }
.small .jquery{background:url(../images/main/jquery_small.jpg)no-repeat top;background-color: white;  }
.small .understanding{background:url(../images/main/understanding_small.jpg)no-repeat top;background-color: white;  }
.small .understanding_up{background: url(../images/main/understanding_up_small.jpg)no-repeat top;background-color: white; }
.small .uxseminar{background:url(../images/main/uxseminar_small.jpg) no-repeat top;background-color: white;}
.small .visualinterface{background:url(/main/images/main/visualinterface_small.jpg) no-repeat top;background-color: white;}
.small .onestop{background:url(../images/main/onestop_small.jpg) no-repeat top;background-color: white;}
.small .collage{background:url(../images/main/collage_small.jpg) no-repeat top;background-color: white;}
.small .jobseminar1{background:url(../images/main/job_seminar1_small.jpg) no-repeat top;background-color: white;}
.small .jobseminar2{background:url(../images/main/job_seminar2_small.jpg) no-repeat top;background-color: white;}
.small .emoticon{background:url(../images/main/emoticon_small.jpg) no-repeat top;background-color: white;}
.small .mobiledesigntrend{background:url(../images/main/mobiledesigntrend_small.jpg) no-repeat top;background-color: white;}
.small .darttoy{background:url(../images/main/3darttoy_small.jpg) no-repeat top;background-color: white;}
.small .grid{background:url(../images/main/grid_small.jpg) no-repeat top;background-color: white;}
.small .mxds{background:url( ../images/main/mxds_small.jpg) no-repeat top;background-color: white;}
/*size_smaill _finish*/



.con2{width: 310px; margin-left: 670px;
	
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	 -moz-border-radius: 3px;
	 -webkit-border-radius: 3px;

	 /* Opera */
	
	
	background-color:#ffffff;
	

	
}
.con2 .cal{width: 310px; background:#262626;
		height: 51px;position: relative;

-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	 -moz-border-radius: 3px;
	 -webkit-border-radius: 3px;}
.cal  h4 {text-indent: -9999px;background:url(/main/images/main/cal_title.png) no-repeat left ;
		background-position-x: 15px; width: 310px; height: 19px; padding:15px 0 ; float: left;
		}
.cal a{display: block;background: url(/main/images/main/cal_btn.png)no-repeat;
			
		 width: 35px; height: 19px; float: right; }

.cal div a{position:absolute;background:#262626;
			top:220px; 
			width: 10px ;height: 12px;
			text-indent: -9999px;}

.cal div a.cal_left{left:130px; background:url(/main/images/cal_a_bg.png) top left; }
.cal div a.cal_right{right:130px;background:url(/main/images/cal_a_bg.png) bottom right;}	

.cal div .select_a{position: relative;background:none;
			top:1px;right:2px;
			width: auto ;height: auto;
			text-indent: 0; color:#fc3f00; display: block;}
		


/* padding:10px 50px; padding-bottom: 30px;*/

.cal table { display: block;background:#262626;
-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	 -moz-border-radius: 3px;
	 -webkit-border-radius: 3px;
}

.cal table tr td {width: 19px; height: 19px;text-align: center;padding:5px 5px;margin:5px 5px; font-size:12px;
				color:#a6a6a9;text-align: center; border-bottom:1px solid #262626;}
.cal table tr.week td{color:#fff; background:url(/main/images/cla_black.jpg)}

.cal table tr td.select{ border-bottom:1px solid #fc4f00; color: #fc4f00;position: relative; z-index: 100; position: relative;}

 .tip{width:300px; height:300px;  position:absolute;z-index:8000; background:#000; left:0; top:0}

.cal table  tr.cal_title {width: 100%; }
.cal table  tr.cal_title td{width: 100%; }
.cal table  tr.cal_title  h5{font-size: 12px; color: #ffffff; text-align: center;}

.cal_move{ width: 310px; height: 250px;overflow: hidden; position:relative; background:#262626}
.cal_move:after{content: ""; display: block; clear: both;}

table.next_m,  table.this_m  {display:none; position:absolute; left:50px;}


.fold{margin-top:245px;}

#slide div.port.portheight {height:1045px;}/*port ¿¡¼­ 245pxÀ» »« °ªÀ» ³Ö±â.*/

#slide div.port {width:310px; height:1290px; position:relative; overflow:hidden;}
#slide div.port ul {position: absolute; padding-left:8px; height:650px;background: #fff; width: 100%;}

#slide h4{display:inline-block;text-indent: -99999px; background:url(/main/images/main/po_title.png) no-repeat center;
	background-position-x: 15px; width: 150px; height: 19px; padding:15px 0; 
}


#slide>a{display: block;background: url(/main/images/main/po_more.png)no-repeat center;padding:15px 0;text-indent: -99999px;
			
		 width: 37px; height: 19px; float: right; margin-right: 10px; }

#slide a img{-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	 -moz-border-radius: 3px;
	 -webkit-border-radius: 3px;
	 
	   border: 1px solid #cfcfcf
	 }
	 
#slide a strong{display:inline-block;font-size: 14px; font-weight: bold; padding-top:10px;}
#slide a p{font-size: 12px; padding-top:10px;padding-bottom: 35px;}
#slide a p.po_day{display:inline-block; font-size: 12px; color: #999999;float:right; padding:10px 10px 0 0 ; }


 /* con2  finish*/


#mainfooter{width: 980px; margin: auto;padding: 30px 0 ; position: relative;

}

#mainfooter>div{background: url(/main/images/main/footer_logo.png) no-repeat;
			
}

#mainfooter div div{float: right; width: 200px;}
#mainfooter div div.footer_notice{width: 310px;}
#mainfooter:after{content:""; display:block; clear: both;}
#mainfooter div div.footer_notice h4{background:url(/main/images/main/footer_notice.png) no-repeat; display: block;height: 18px;;text-indent: -99999px;margin-bottom: 10px; }
#mainfooter div div.footer_notice a{}
#mainfooter div div.footer_notice a span  {background:url(/images/main/btn_more.gif) no-repeat;display: block;height: 18px;;text-indent: -99999px;margin-top:-23px;width: 100px;float: right;}

#mainfooter div div ul li{font-size: 14px;line-height: 30px;}
#mainfooter div div ul li a:hover{font-weight: bold;}

#mainfooter div div.footer_categories h4{background:url(/main/images/main/footer_categories.png)no-repeat; display: block;height: 18px;;text-indent: -99999px;margin-bottom: 10px; }

#mainfooter div div.footer_sns{width: 300px;margin-right: 30px; float: left;}
#mainfooter div div.footer_sns h4{background:url(/main/images/main/footer_sns.png)no-repeat; display: block;height: 18px;;text-indent: -99999px;margin-bottom: 10px; }
#mainfooter div div.footer_sns ul {padding-top:10px;}
#mainfooter div div.footer_sns ul li{float: left; margin-right: 10px;}




.top_btn{position:absolute;top:-167px;right:-90px;width: 57px; height: 57px;}
#color .all {position: relative;}
#color  .all .deadline {position: absolute; right:0; top:-10px;}