@charset "euc-kr";
/* CSS Document */

/*---------- BANNER ----------*/
/* INFO
   Banner Graphic must be at least the height of .banner + height of parent element (in this case the header)
   e.g.  .banner { height: 22em }
         .header { height: 3.5em }
         22em + 3.5em = 25.5em
         25.5em * 16px = 408px
         => Banner Graphic must be at least 408px height!

Graphic: http://unsplash.com/post/81123587039/download-by-wojtek-witkowski
*/
.banner {
	background-repeat: no-repeat;
	background-image: url(../images/banner_bg01.jpg);
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 500px;
	background-color: rgba(31,31,31,1.00);
	background-attachment: fixed;
	overflow-y: hidden;
	display: block;
	min-height: 300px;
	background-size: cover;
}
.banner:after {
	content : "";
	position: absolute;
	opacity: 0.7;
	background-color: rgba(31,31,31,1.00);
	width: 100%;
	height: 100%;
	bottom: 0px;
	}
.banner-text {
	text-align: center;
	top: 30%;
	position: absolute;
	width: 100%;
	left: 50%;
	margin-left: -50%;
	z-index: 2;
}

.bn_txt01 {	
	color: #FFFFFF;
	font-size: 72px;
}
.bn_txt02 {
	font-size: 48px;
	color: rgba(255,255,255,1.00);
}
.bn_txt03 {
	font-size: 22px;
	color: rgba(255,255,255,1.00);
}

@media (max-width:768px){
	.banner {
	background-repeat: no-repeat;
	background-image: url(../images/banner_bg01.jpg);
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 300px;
	background-color: rgba(31,31,31,1.00);
	background-attachment: fixed;
	overflow-y: hidden;
	display: block;
	min-height: 300px;
	background-size: cover;
}
.banner:after {
	content : "";
	position: absolute;
	opacity: 0.7;
	background-color: rgba(31,31,31,1.00);
	width: 100%;
	height: 100%;
	bottom: 0px;
	}
.banner-text {
	text-align: center;
	top: 30%;
	position: absolute;
	width: 100%;
	left: 50%;
	margin-left: -50%;
	z-index: 2;
}

.bn_txt01 {	
	color: #FFFFFF;
	font-size: 48px;
}
.bn_txt02 {
	font-size: 28px;
	color: rgba(255,255,255,1.00);
}
.bn_txt03 {
	font-size: 18px;
	color: rgba(255,255,255,1.00);
}
}
