.show-pic{
	position:relative;
	width: 100%;
	height: auto;
}
.pic-carousel img{
	width: 100%;
}
.hide-pic{
	display: none;
}
.prev,.next{
	position: absolute;
	cursor: pointer;
}
.prev{
	left: 50px;
}
.next{
	right: 50px;
}
.main-course{
	margin: 0px;
	padding: 0px;
	width: 100%;
}
.main-course h2{
	padding-left: 40px;
}
.main-course div{
	position:relative;
	text-align: center;
	float:left;
	width:25%;
	*width:24%;
	padding-bottom: 10px;
	padding-top: 10px;
}
.main-course div img{
	width: 90%;
}
.main-course-cover{
	display: none;
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    *height:expression(document.getElementById('course-list').offsetHeight+"px");
    background-color: black; 
    z-index:1002; 
    opacity:.70; 
    filter: alpha(opacity=70);
}
.main-course-title{
	display: none;
    position:absolute;
    top:60%;
    left:0;
    width:100%;
    color:white;
    z-index:1003;
}


/*new new new*/
.hide-area{
	display:none;
}
.index-background-area{
	position: relative;
	width: 100%;
}
.index-background-img,.index-background-indicators{
	padding: 0px;
	margin: 0px;

}
.index-background-img img{
	width: 100%;
}
.index-background-indicators{
	position: absolute;
	bottom: 10px;
	width: 100%;
	text-align: center;
	line-height: 20px;
}
.index-background-indicators li{
	display: inline-block;
	*display:inline;
	*zoom:1;
	width: 20px;
	height: 20px;
	border-radius: 20px;
	color: #4a4a4a;
	font-size: 14px;
	font-weight: bold;
	background-color: #FFF;
	cursor: pointer;
}
li.index-background-indicators-active,.index-background-indicators li:hover{
	background-color: #10AE58;
	color: #FFF;
}
.index-login-area{
	padding: 20px;
	background-color: #FFF;
	text-align: center;
	border-radius: 4px;
}
.index-login-title{
	color:#10AE58;
	font-weight: bold;
}
.index-login-un,.index-login-pw{
	padding: 10px 12px;
	width: 225px;
	border: 1px solid #A7A7A7;
}
.index-login-area input:focus{
	border:1px solid #10AE58;
}
.index-login-submit-button{
	padding: 8px 12px;
	width: 250px;
	font-size: 14px;
	border: 1px solid #3EC47B;
	background-color: #3EC47B;
	color: white;
	cursor: pointer;
}
.index-login-submit-button:hover{
	border: 1px solid #10AE58;
	background-color: #10AE58;
}
.contact-way{
	margin-top: 20px;
	margin-bottom: 20px;
	width: 100%;
}
.contact-way div{
	display: inline-block;
	*display: inline;
	*zoom: 1;
	text-align: center;
	padding:10px 0px;
}
.contact-way div img{
	width: 60px;
}
.contact-way div span{
}
.contact-title{
	font-weight: bold;
	color: #10AE58;
}
.contact-content{
	color: #10AE58;
}

/*=============================================small=============================================*/
@media screen and (max-width:768px){
	.prev,.next{
		display: none;
	}
	.main-course div{
		width: 50%;
	}
	.main-course-title{
		display: block;
		top:42%;
		z-index: 2;
		font-size: 16px;
	}
	.main-course-cover{
    	display: block;
    	z-index: 1;
    	opacity:.50; 
    	filter: alpha(opacity=50);
	}
	.main-course h2{
		padding-left: 10px;
		font-size: 20px;
	}

	/*new new new*/
	.index-background-area{
		margin-top: 0px;
	}	
	.index-login-area{
		margin-top: 10px;
		position: relative;
		border-top:1px dashed #10AE58;
		border-bottom:1px dashed #10AE58;
		padding: 10px;
	}
	.contact-way div{
		width: 100%;
	}
}
/*=============================================middle=============================================*/
@media screen and (min-width:768px) and (max-width:992px){
	.prev,.next{
		top:35%;
	}
	.main-course div{
		width: 33%;
	}
	.main-course-title{
		display: block;
		top:45%;
		z-index: 2;
    	font-size: 20px;
	}
	.main-course-cover{
    	display: block;
    	z-index: 1;
    	opacity:.50; 
    	filter: alpha(opacity=50);
	}
	
	
	/*new new new*/
	.index-background-area{
		margin-top: 0px;
	}

	.index-login-area{
		position: absolute;
		top: 120px;
		right: 120px;
	}
	.contact-way div{
		width: 32%;
	}
}
/*=============================================big=============================================*/
@media screen and (min-width:992px){
	.prev,.next{
		top:45%;
	}
	.main-course-title{
		display: none;
		top:60%;
    	font-size: 24px;
	}
	.main-course-cover{
    	display: none;
    	opacity:.70; 
    	filter: alpha(opacity=70);
	}

	/*new new new*/
	.index-background-area{
		margin-top: -30px;
	}
	.index-login-area{
		position: absolute;
		top: 25%;
		right: 10%;
	}
	.contact-way div{
		width: 32%;
	}
}