@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,600,700,300,800);
@import url('https://fonts.googleapis.com/css?family=Nanum+Myeongjo:400,700,800&subset=korean');
@import url('https://fonts.googleapis.com/css?family=Roboto:400,300,500,500italic,700,900,400italic,700italic');
@import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i');
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); 
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic+Coding:400,700&subset=korean');
@import url(//cdn.rawgit.com/hiun/NanumSquare/master/nanumsquare.css);
@import url('https://fonts.googleapis.com/css?family=East+Sea+Dokdo&subset=korean');




/*************************
*******Typography******
**************************/

h1 {
	font-family: 'Nanum Gothic Coding', monospace;
	font-size: 36px;
	font-weight: 400;
	text-align: center;
	color: #ffffff;
	background-color: rgba(255, 255, 255, 0);
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

h2 {
	font-family: 'Nanum Square';
	font-size: 30px;
	text-align: center;
	color: #ffffff;
	background-color: rgba(255, 255, 255, 0);
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);      

}

h3 {
	font-family: 'Nanum Square';
	color: #ffffff;
	text-align: center;
	font-size: 26px;
	background-color: rgba(255, 255, 255, 0);
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);  
}


.btn-primary {
	padding: 8px 20px;
	background: #c52d2f;
	color: #fff;
	border-radius: 4px;
	border: none;
	margin-top: 10px;
}


.btn-primary:hover,
.btn-primary:focus {
	background: #c52d2f;
	outline: none;
	box-shadow: none;
}

.btn-transparent {
	border: 3px solid #fff;
	background: transparent;
	color: #fff;
}

.btn-transparent:hover {
	border-color: rgba(255, 255, 255, 0.5);
}








/*************************
*******Home Page******
**************************/

#main-slider {
	position: relative;
}

.no-margin {
	margin: 0;
	padding: 0;
}

#main-slider .carousel .carousel-content {
	margin-top: 0px;
}

#main-slider .carousel .slide-margin {
	margin-top: 100px;
}

#main-slider .carousel h2 {
	color: #fff;
}




#main-slider .carousel .item {
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	left: 0 !important;
	opacity: 0;
	top: 0;
	position: absolute;
	width: 100%;
	display: block !important;
	height: 450px;
	-webkit-transition: opacity ease-in-out 500ms;
	-moz-transition: opacity ease-in-out 500ms;
	-o-transition: opacity ease-in-out 500ms;
	transition: opacity ease-in-out 500ms;
}

#main-slider .carousel .item:first-child {
	top: auto;
	position: relative;
}

#main-slider .carousel .item.active {
	opacity: 1;
	-webkit-transition: opacity ease-in-out 500ms;
	-moz-transition: opacity ease-in-out 500ms;
	-o-transition: opacity ease-in-out 500ms;
	transition: opacity ease-in-out 500ms;
	z-index: 1;
}

#main-slider .prev,
#main-slider .next {
	position: absolute;
	top: 50%;
	background-color:rgba(255, 110, 4, 0.25);
	color: #fff;
	display: inline-block;
	margin-top: -25px;
	height: 40px;
	line-height: 40px;
	width: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: 4px;
	z-index: 5;
}

#main-slider .prev:hover,
#main-slider .next:hover {
	background-color: rgba(255, 110, 4, 0.9);
}

#main-slider .prev {
	left: 10px;
}

#main-slider .next {
	right: 10px;
}

#main-slider .carousel-indicators .active {
	width: 13px;
	background: rgba(255,255,255,0.75);
	width:30px;
}

#main-slider .carousel .btn-slide {
	padding: 8px 20px;
	background: #ff1280;
	color: #fff;
	border-radius: 4px;
	margin-top: 25px;
	display: inline-block;
}



#main-slider .carousel-indicators :hover,
#main-slider .carousel-indicators .active {
	background: rgb(233, 27, 35);
	transition: all 0.3s ease-in-out;
	
}

#main-slider .active .animation.animated-item-1 {
	-webkit-animation: fadeInUp 300ms linear 300ms both;
	-moz-animation: fadeInUp 300ms linear 300ms both;
	-o-animation: fadeInUp 300ms linear 300ms both;
	-ms-animation: fadeInUp 300ms linear 300ms both;
	animation: fadeInUp 300ms linear 300ms both;
}

#main-slider .active .animation.animated-item-2 {
	-webkit-animation: fadeInUp 300ms linear 600ms both;
	-moz-animation: fadeInUp 300ms linear 600ms both;
	-o-animation: fadeInUp 300ms linear 600ms both;
	-ms-animation: fadeInUp 300ms linear 600ms both;
	animation: fadeInUp 300ms linear 600ms both;
}

#main-slider .active .animation.animated-item-3 {
	-webkit-animation: fadeInUp 300ms linear 900ms both;
	-moz-animation: fadeInUp 300ms linear 900ms both;
	-o-animation: fadeInUp 300ms linear 900ms both;
	-ms-animation: fadeInUp 300ms linear 900ms both;
	animation: fadeInUp 300ms linear 900ms both;
}

#main-slider .active .animation.animated-item-4 {
	-webkit-animation: fadeInUp 300ms linear 1200ms both;
	-moz-animation: fadeInUp 300ms linear 1200ms both;
	-o-animation: fadeInUp 300ms linear 1200ms both;
	-ms-animation: fadeInUp 300ms linear 1200ms both;
	animation: fadeInUp 300ms linear 1200ms both;
}

#main-slider .active .animation.animated-item-5 {
	-webkit-animation: fadeInUp 300ms linear 1500ms both;
	-moz-animation: fadeInUp 300ms linear 1500ms both;
	-o-animation: fadeInUp 300ms linear 1500ms both;
	-ms-animation: fadeInUp 300ms linear 1500ms both;
	animation: fadeInUp 300ms linear 1500ms both;
}