@import "style.css";

body{
    margin:0;
	padding:0;
	/*OVERFLOW-X:scroll;*/
	OVERFLOW: auto;
	background:#fff;
	}

html, div, ul, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, from{
    margin:0;
	padding:0;
	}


ul, ol, dl { 
    list-style:none;
	}
	
img {

    border:0;
	
	}



/* ¸ÇÀ§ ÆĶõ»ö ¹Ù */
#headerWr {position: absolute; left:0; top:0; width:100%; min-height:260px; overflow:hidden; z-index:2000;}
	
/* ¸ÞÀÎ */	
#main {
	clear:both;
	POSITION: relative ; 
	WIDTH:100%;
	Z-INDEX: 1;
	TOP:-40px;
	text-align:center; 
	

}
#main_link {position:absolute; width:100%; height:100%;Z-INDEX:2;}
#main_link a {display:block; width:100%; height:100%;}
/*-------------------------¸ÞÀΰ¡¿îµ¥½ºÅ©·Ñ¹è³Ê------------------------------*/
.mainVisual { clear:both; position:static; z-index:1;  height:100%;min-height:778px; margin-top:140px; overflow:hidden;}
.mainVisual .list { position:absolute !important; left:0; width:100% !important;min-height:778px;  margin-top:0px; }
.mainVisual .list li {
	position:absolute;
	left:499px;
	top:48px;
	width:100%;
	height:100%;
	opacity:0;
	filter:alpha(opacity=0);
	background-position:50% 0;
	background-repeat:no-repeat;
	white-space:nowrap;
	text-indent:-999px;
	overflow:hidden;
	background-size:cover;
}
.mainVisual .list li:first-child { opacity:1; filter:alpha(opacity=100); }
.mainVisual .list li span {top:280px; left:50%; margin:0px 0 0 -528px;}
.mainVisual .list li div { width:440px; min-height:150px;background:url(image/bt_bg02.png) repeat; top:130px; left:50%; margin:0px 0 0 -530px; padding:50px 10px;}
.mainVisual .list li div p { color:#fff; text-align:center; letter-spacing:-0.5px;}
.mainVisual .list li div p.tit1 {font-size:30px; font-weight:600; margin:0 0 30px 0;}
.mainVisual .list li div p.txt1 {font-size:20px; font-weight:400;}
.mainVisual .btnSet { position:absolute; left:0; width:100%; height:37px; z-index:10; margin:350px 0 0 0px; }
.mainVisual .btnSet a.stop, .mainVisual .btnSet a.prev, .mainVisual .btnSet a.next { position:absolute;  width:59px; height:59px; overflow:hidden; white-space:nowrap; font-size:0; letter-spacing:-100px; text-indent:0;   background-position:50% 50%; }
.mainVisual .btnSet a.prev { left:30px; background-image:url("image/prev.png"); margin-top:20px;}
.mainVisual .btnSet a.next { right:30px; background-image:url("image/next.png"); margin-top:20px;}
.mainVisual .btnSet a.stop { left:78px; background-color:#71a30b; background-image:url("../image/pause.png"); }
.mainVisual .btnSet a.play { background-image:url("image/play.gif"); }
.mainVisual .btnSet .curIco { position:absolute; left:50%; top:100px;padding:5px; height:23px;width:300px;margin-left:-530px; z-index:55; text-align:left; }
.mainVisual .btnSet .curIco a { display:inline-block; width:23px; height:23px; margin-left:10px; overflow:hidden; white-space:nowrap; font-size:0; letter-spacing:0px; text-indent:0; background:url("image/off.gif") no-repeat;}
.mainVisual .btnSet .curIco a.on, .mainVisual .btnSet .curIco a:hover { background:url("image/on.gif") no-repeat;width:23px; height:23px; }

.mainVisual .caption {position:absolute;top:700px; right:50%; padding:0 0px 0 0px; margin:0 -30px 0 0; text-indent:0; height:37px; line-height:37px; color:#fff; background:url("../") 100% 0 no-repeat;}


/*-------------------------//¸ÞÀΰ¡¿îµ¥½ºÅ©·Ñ¹è³Ê------------------------------*/

@media (max-height:990px) {
#main .bt_more {position:absolute; bottom:100px; left:50%; z-index:888; background-position:bottom; margin-left:-40px;}


}
@media (min-height:980px) {
	#main .bt_more {position:absolute; bottom:30px; left:50%; z-index:888; background-position:bottom; margin-left:-40px;}
	


	
}

#content:after {display:block;content:"";clear:both;}
#content {
    Z-INDEX: 3;
	POSITION:  relative;
	WIDTH: 100%;
	TOP:-40px; height:100%;
	text-align: center; 
}
#content_in:after {display:block;content:"";clear:both;}
#content_in {
	POSITION: relative;
	WIDTH:1100px;
	text-align:center;
	top:-79px;
	margin:0  auto 0 auto;

}
/* ¸ÞÀÎ ¹è³Ê */

.oe_overlay{
	background:#000;
	opacity:0;
	position: absolute;
	top:0px;
	left:0px;
	width:100%;
	height:204px;
}
.oe_wrapper {position:relative; width:1080px; margin:0px 0 ; top:30px; left:10px;}


ul.oe_menu{
	list-style:none;
	position:relative;
	margin:0px 0px 0px 0px;
	float:left;
	clear:both;
	top:0px;
} 
ul.oe_menu > li{
	width:250px;
	height:285px;
	padding-bottom:0px;
	float:left;
	position:relative;
	margin:0 10px
	
}

ul.oe_menu > li > a{
	display:block;
	color:#f8f8f8;
	text-decoration:none;
	font-weight:400;
	font-size:18px;
	width:250px;
	height:285px;
	padding-top:0px;
	margin:0px auto 0 ;
	text-align:center;
	/*text-shadow:0px 0px 1px #000;
	opacity:0.8;*/
	}
ul.oe_menu > li a span { line-height:49px;margin:0px; text-align:center; }

	
ul.oe_menu > li > a.m1 {background:url(image/m_b01.png) no-repeat left top;}
ul.oe_menu > li > a.m2 {background:url(image/m_b02.png) no-repeat left top;}
ul.oe_menu > li > a.m3 {background:url(image/m_b03.png) no-repeat left top;}
ul.oe_menu > li > a.m4 {background:url(image/m_b04.png) no-repeat left top;}

	
ul.oe_menu > li > a:hover,
ul.oe_menu > li.selected > a{
	
	color:#dfdfdf;
	opacity:1.0;
}
.oe_wrapper ul.hovered > li > a{
	/*background:#fff;
	text-shadow:0px 0px 1px #FFF;*/
}
ul.oe_menu div {
	position:absolute;
	top:0px;
	left:0px;
	
	width:250px;
	height:285px;
	padding:0px;
	display:none;
	margin:0px;
}
ul.oe_menu div.ms1 {background:url(image/m_b01_on.png) no-repeat;}
ul.oe_menu div.ms2 {background:url(image/m_b02_on.png) no-repeat;}
ul.oe_menu div.ms3 {background:url(image/m_b03_on.png) no-repeat top;}
ul.oe_menu div.ms4 {background:url(image/m_b04_on.png) no-repeat  top;}

/* ul.oe_menu div ul {padding:20px; text-align:center; margin:0 auto; }
ul.oe_menu div ul.box1 {padding:50px;}
ul.oe_menu div ul li {
	text-decoration:none;
	color:#fff;
	padding:5px 0 ;
	margin:0px auto;
	display:block;
	font-size:14px;
	font-weight:300;
	
}
ul.oe_menu div ul li.t1 {color:#63aaff;}
ul.oe_menu div ul li a{ display:block; text-align:right; color:#f2f2f2; font-size:10px;font-family:'Nanum Gothic','Malgun Gothic', 'Dotum', 'verdana'; padding:10px 0 0 0}
ul.oe_menu div ul.oe_full{
	width:100%;
}
ul.oe_menu div ul li a:hover{
	
	color:#ffe674;
}
ul.oe_menu li ul{
	list-style:none;
	margin:0px;
}*/
ul.oe_menu div ul li.oe_heading{
	
	padding-top:0px; margin:0px auto 0px auto;top:0px;
    text-align:center;font-weight:500;
}
ul.oe_menu div ul li.oe_heading a { display:block;width:250px; height:285px;color:#fff;	font-size:18px;}
ul.oe_menu div ul li.oe_heading a span {line-height:49px;margin:0px; text-align:center;}

/* END ¸ÞÀÎ ¹è³Ê// */

#content_in_box:after {display:block;content:"";clear:both;}
#content_in_box {
	POSITION: relative;
	WIDTH:1060px; height:300px;
	text-align:center;
	top:-70px;
	margin:0  auto 0 auto;
}

/**¹ÐÅϹ®È­ÄÜÅÙÃ÷**/
#m_con:after {clear:both;display:block;content:"";}
#m_con {position:absolute;width:710px;min-height:280px; text-align:left;left:0px; top:40px; }

/***»ç¾÷ºÐ¾ß_·Ñ¸µ**/

.mproWrapper { width:730px; margin:0px auto;} /* not important */
		
		.mproWrapper ul { 
			list-style-type: none; /* remove the default style for list items (the circles) */ 
			margin:0px; /* remove default margin */
			padding:0px; /* remove default padding */
			
		}
		.mproWrapper ul li {
			float:left; /* important: left float */
			position:relative; /* so we can use top and left positioning */
			overflow:hidden; /* hide the content outside the boundaries (ZOOM) */
			width:340px; margin:0 20px  0 0;text-align:center;
		}
		.mproWrapper ul li.last { margin:0;}
		.mproWrapper ul li span { z-index:3; position:absolute;padding:120px 0 50px 0px; margin:0  0 0 70px; font-size:22px; color:#fff; font-weight:500; background:url(image/m_pro_more.png) no-repeat 50% 160px}
		.mproWrapper ul li span.t1 {color:#f8f8f8;}
		.mproWrapper ul li a img { 
			width:340px;  /* not important, the pics we use here are too big */
			position:relative; /* so we can use top and left positioning */
			border:none; /* remove the default blue border */
		}
		.caption2{
			z-index:10;
			position:absolute; /* needed for positioning */
			bottom:0px; /* bottom of the list item (container) */
			left:0px; /* start from left of the list item (container) */
			width:320px; /* stretch to the whole width of container */
			height:280px;
			display:none; /* hide by default */
			/* styling bellow opacity:0.9;*/
			background:url(image/m_pro_on.png) repeat; margin:10px;
			
			
		}
		.caption2 .captionInside{
			/* just styling */
			
			margin:0px; text-align:center;
		}
		
		.clear { clear:both; } /* to clear the float after the last item  text-decoration:underline;*/
		
		.caption2 .captionInside a { color:#fff; display:block;padding:50px 0px 50px 0; font-size:20px; font-weight:500; background:url(image/m_pro_more.png) no-repeat 50% 80px;}
		.caption2 .captionInside a span { display:block; text-align:center; margin:60px 20px 0 20px ; font-size:13px; padding:0; font-weight:300; line-height:150%}

/**°øÁö»çÇ×**/
#m_notice:after {clear:both;display:block;content:"";}
#m_notice {position:absolute;width:330px;min-height:280px; text-align:left;left:730px; top:50px;}
#m_notice div.tit { background:url(image/m_more2.png) no-repeat 300px 5px;padding:0px 0 0px 0px; height:45px; }
#m_notice div.tit p.t1 { float:left; font-size:22px; color:#272727;  line-height:24px; font-weight:700; }
#m_notice div.tit p.t2 { float:right; width:40px; height:40px; margin:5px 0px 0 0;text-indent:-9999px; }
#m_notice div.tit p.t2 a {display:block;}
#m_notice div.box1 { padding:0px 0px; line-height:35px; }





#bottom {
	POSITION: relative; 
	WIDTH: 100%; 
	HEIGHT:150px;
	text-align:left;
	background:#222222; 

}

#bottom_lay {
	WIDTH: 1100px;
	POSITION: relative;
	margin:0px  auto 0 auto;
	text-align:left;
}

#bottom_b {float:right; margin:0px 0 0 0}
#bottom_b li { float:left;   margin:0px 8px 0 0px;}
#bottom_b li a{ display:block;border:1px solid #fff; line-height:30px; text-align:center; font-size:16px; font-weight:700; color:#fff; padding:0 30px !important;}
#bottom_b li a:hover {background:#6b1111;}

#bottom_lay li{ float:left; padding:35px 0 0 20px; text-align:left; font-size:12px; color:#c1c1c1; line-height:180%; font-weight:600;font-family:'Nanum Gothic','Malgun Gothic', 'Dotum', 'verdana'; }
#bottom_lay li.tailimg {margin:2px 40px 0 10px;}
#bottom_lay li span { color:#ff9600; margin-left:10px;}
#bottom_lay li span a,a:visited,a:hover {color:#ff9600;}

#bottom_lay li p{ display:block; font-family: Verdana, Geneva, sans-serif; font-size:11px; color:#7b7b7b; line-height:180%; }
.bottom_img { 
   padding:15px 0 0 0px;
	}