@charset "utf-8";
/* CSS Document */

/*   basics   */
/*
 * Nanum Gothic (Korean) http://www.google.com/fonts/earlyaccess
 */
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 800;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.ttf) format('truetype');
}
body { font-family:'Nanum Gothic'; }
.wrap { width:1200px; position:relative; margin:0 auto; }

/*   header   */

#header { width:100%; height:80px; background:#fff; position:fixed; z-index:500; border-bottom:0.1px solid #CCC; }

 	.Logo { width:210px; height:79px; position:absolute; left:0; top:0px; }
	.Logo > a { display:block; }
	.main_menu { width: 850px; height:30px; position:absolute; top:27px; left:370px; }
	.main_menu li { float:left; padding:4px 40px; } 
	.main_menu li > a { display:block; font-size:18px; font-weight:bold; color:#000; }
	
	#nav { width:100%; height:130px; background:#585c69; z-index:100; position:absolute; top:80px; display:none; }
	#nav .wrap > ul { float:left; position:absolute; top:14px; }
	#nav .wrap > ul > li > a { display:block; padding:5px 0px; font-size:14px; color:#FFF; letter-spacing:-1px; }
	#nav .wrap > ul > li > a:hover { color:#F00; }
	#nav .wrap > ul:nth-child(1) { margin-left:410px; }
	#nav .wrap > ul:nth-child(2) { margin-left:560px; }
	#nav .wrap > ul:nth-child(3) { margin-left:710px; }
	#nav .wrap > ul:nth-child(4) { margin-left:860px; }
	#nav .wrap > ul:nth-child(5) { margin-left:1010px; }
	
/*   Section Slider   */
#section_slider { padding-top:80px; width:100%; height:100%; }

/*   Section Contents   */
#contents { width:100%; height:100%; }
	#contents > article:nth-child(1) { width:100%; height:1000px; box-sizing:border-box; background:url(../images/prod.jpg) no-repeat center; }
		.over_img {  width:100%; height:590px; position:absolute; left:0; top:310px; }
		.over_img > p { float:left; width:350px; height:590px; margin-right:75px; }
		.over_img > p > .over { position:absolute; top:0px; left:0; transition:opacity 0.8s ease; opacity:0; }
		.over_img > p:hover .over { opacity:1; }
		.over_img > p:last-child { margin-right:0px; }
		.over_img > p > a { display:block; position:relative; }
		.over_img > p > a > img { display:block; position:absolute; top:0; left:0; }
		.over_img > p > a:hover > img { opacity:1; }
		.over_img > p > a > img.over { position:absolute; top:0px; left:0; transition:opacity 0.8s ease; opacity:0; }
	
	#contents > article:nth-child(2) { width:100%; height:760px; box-sizing: border-box; background:#fff; }
    #contents > article:nth-child(2) > div.wrap { box-sizing: border-box; }
	#contents > article:nth-child(2) > div.wrap > h1 { width:100%; height:100px; padding-top:100px; }
	#contents > article:nth-child(2) > div.wrap > p { font-size:0px; width:100%; height:100%; border-bottom:1px solid #CCC; }
	#contents > article:nth-child(2) > div.wrap > p > img { display:inline-block; }		

	#contents > article:nth-child(3) { width:100%; height:240px; box-sizing: border-box; background:#c4d5db; }
    #contents > article:nth-child(3) > div.wrap > h1 { width:100%; text-align:center; font-size:25px; padding-top:50px; padding-bottom:30px; } 
			
/*   Sub Title  */
    #section_subtitle { width: 100%; padding-top:80px;}	
	#section_subtitle > .div_subtitle_a { background:url(../images/comp.jpg) no-repeat center; width:100%; height:200px; }
	#section_subtitle > .div_subtitle_b { background:url(../images/prod_t.jpg) no-repeat center; width:100%; height:200px; }
	#section_subtitle > .div_subtitle_c { background:url(../images/pres.jpg) no-repeat center; width:100%; height:200px; }
	#section_subtitle > .div_subtitle_d { background:url(../images/cost.jpg) no-repeat center; width:100%; height:200px; } 
	#section_subtitle > .div_subtitle_e { background:url(../images/not.jpg) no-repeat center; width:100%; height:200px; }
	
	#section_subtitle > .div_submenu_a { width:100%; height:50px; border-bottom:1px solid #cccccc; }
	#section_subtitle > .div_submenu_a > .wrap > p { font-size:14px; font-weight:bold; text-align:center; float:left; height:50px; line-height:50px; }
	#section_subtitle > .div_submenu_a > .wrap > p:nth-child(1) { width:58px; border-left:1px solid #cccccc; border-right:1px solid #cccccc; background:url(../images/comp_h_icon.png) no-repeat center; }
	#section_subtitle > .div_submenu_a > .wrap > p:nth-child(2)  { width:149px; border-right:1px solid #cccccc; }
	#section_subtitle > .div_submenu_a > .wrap > p:nth-child(3)  { width:149px; border-right:1px solid #cccccc; }

/* Contents_sub */	
    #contents_sub{ padding-top:50px;padding-bottom:50px; }
/* Map */    
	#contents_sub > article > .wrap > .map { display:block; width:100%; height:460px; margin:0; padding:0; position:absolute; top:150px; }
/* Video */		
    #contents_sub > article > .wrap > div.video { width:1200px; height:780px; background:url(../images/prod_04_b1200l.jpg) no-repeat center; position:relative; } 
    #contents_sub > article > .wrap > div.video > video:nth-child(1) { display:block; width:400px; position:absolute; top:160px; left:100px; }
    #contents_sub > article > .wrap > div.video > video:nth-child(2) { display:block; width:400px; position:absolute; top:160px; right:100px; }
    #contents_sub > article > .wrap > div.video > video:nth-child(3) { display:block; width:400px; position:absolute; top:500px; left:100px; }
    #contents_sub > article > .wrap > div.video > video:nth-child(4) { display:block; width:400px; position:absolute; top:500px; right:100px; }

/*   Footer   */
    #footer { position:relative; width:100%; height:250px; background-color:#3a4675; }
    #div_open { position:absolute; top:-700px; left:calc(50% - 400px); width:800px; height:700px; background-image:url(../images/per_01.jpg); display:none; } /* 개인방침내용 */
	#footer > div.wrap > a { display:block; width:150px; height:25px; margin:0; padding:0;  }
	#footer #div_open img { display:block; width:40px; height:40px; position:absolute; top:0 ; right:0; } /* 개인방침 X */
    #footer > div.wrap > .top { display:block; width:48px; height:48px; margin:0; padding:1px; position:absolute; top:0; right:0; }
	#footer > div.wrap > .d_logo { display:block; width:240px; height:52px; margin:0; padding:0; position:absolute; top:100px; left:0; } 
    #footer > div.wrap > .footer_menu { display:block; font-size:18px; color:#FFF; position:absolute; top:60px; right:85px; }	
    #footer > div.wrap > .footer_menu .txt a { color:#FFF; } /* 개인방침 */