@import url("./reset.css");

/* main page style */
#wrapper {width:100%; position:relative; clear:both; overflow:hidden; background:#000;}
#layout {overflow:hidden; clear:both; width:100%; max-width:1680px; background:#fff;}

/* header */
#header {width:230px; position:absolute; left:0; top:0;  font-family:'Levenim MT',sans-serif;}
#header h1 {margin:34px 0 0 15px; z-index:10;}

#header h2.seem {display:none;}

#header .gnbw {position:relative;}
#header #gnb {margin:83px 0 0 20px;}
#header #gnb li.dep1 {
	color:#2f2f2f;
	font-size:16px;
	font-weight:bold;	
	margin-top:19px;
}
#header #gnb li.dep1.fir {margin-top:0;}
#header #gnb li.dep1 a.d1 {color:#2f2f2f; background:url("..../ko/static/images/web/common/gnb1_off.png") no-repeat left 6px; padding-left:10px;}
#header #gnb li.dep1.on a.d1 {color:#b62e14; background:url("../ko/static/images/web/common/gnb1_on.png") no-repeat left 6px;}

#header #gnb li.dep1 ul {margin:5px 0 0 11px; width:185px; display:none;}
#header #gnb li.dep1 ul li.dep2 {
	padding:11px 0 6px;
	border-bottom:solid 1px #e3e3e3;
	position:relative;
	font-size:12px;
	color:#2f2f2f;
	background:url("../ko/static/images/web/common/gnb2_off.png") no-repeat right 17px;
}
#header #gnb li.dep1 ul li.dep2.on {background:url("../ko/static/images/web/common/gnb2_on.png") no-repeat right 17px;}
#header #gnb li.dep1 ul li.dep2.bold {font-weight:bold;}
#header #gnb li.dep1 ul li.dep2 a {color:#2f2f2f; display:block;}
#header #gnb li.dep1 ul li.dep2.on a {color:#bb0000;}
#header #gnb li.link {display:none;}
#header .g_close {display:none;}

#header .vtf {margin:18px 0 0 21px; display:block; padding-top:21px; background:url("../ko/static/images/web/main/dot.png") repeat-x left top; width:70px;}
#header .vtf span {display:none;}
#header .eng {position:absolute; top:37px; left:174px;}
#header .teng {display:none;}

/* container - main visual */
#container {margin-left:230px; overflow:hidden; clear:both;}
#container #mvisual.contents {
	/*padding:0 0 145px;
	border-left:solid 1px #d6d6d6; */
	/*background:#cce6a0;
	font-family:'Dotum', sans-serif;*/
	text-align:justify;
	/*word-break:keep-all;*/
	overflow:hidden;
	clear:both;
	position:relative;
	padding-right:150px;
	/*max-width:1280px;*/
}
#container #mvisual.contents .mvsa {width:100%; overflow:hidden; position:relative;}
#container #mvisual.contents .mvsa ul.visual {
	/*width:899px;*/
	width:500%;
	clear:both;
	overflow:hidden;
	position:relative;
	left:0;
}
#container #mvisual.contents .mvsa ul.visual.web {height:700px;}
#container #mvisual.contents .mvsa ul.visual.tablet {display:none;}
#container #mvisual.contents .mvsa ul.visual.mobile {display:none;}
#container #mvisual.contents .mvsa ul.visual li {float:left;width:20%; line-height:0; /*width:100%;  width:1280px;*/}
#container #mvisual.contents .mvsa ul.visual.web li {height:700px;}
/*#container #mvisual.contents .mvsa ul.visual li.visual01 {background:url("../ko/static/images/web/main/main_visual00.jpg") no-repeat 50% 0 #ececec;}
#container #mvisual.contents .mvsa ul.visual li.visual02 {background:url("../ko/static/images/web/main/main_visual01.jpg") no-repeat 50% 0 #ececec;}
#container #mvisual.contents .mvsa ul.visual li.visual03 {background:url("../ko/static/images/web/main/main_visual02.jpg") no-repeat 50% 0 #ececec;}
#container #mvisual.contents .mvsa ul.visual li.visual04 {background:url("../ko/static/images/web/main/main_visual03.jpg") no-repeat 50% 0 #ececec;}
#container #mvisual.contents .mvsa ul.visual li.visual05 {background:url("../ko/static/images/web/main/main_visual04.jpg") no-repeat 50% 0 #ececec;}*/
#container #mvisual.contents .mvsa ul.visual li p.txt {display:none;}

#container #mvisual.contents .m_right {background:url("../ko/static/images/web/main/r_bg.jpg") no-repeat left top; width:150px; position:absolute; right:0; top:0;}
#container #mvisual.contents .m_right.tabe {display:none;}
#container #mvisual.contents .m_right ul.thum li {/*height:140px;*/overflow:hidden;line-height:0; vertical-align:top; position:relative; /**margin-top:-2px;*/}
#container #mvisual.contents .m_right ul.thum li.fir {*margin-top:0;}

#container #mvisual.contents .rolling_btn {position:relative; top:-60px; height:0; z-index:10; /*left:403px; left:50%; margin-left:-100px;*/ left:5%;}
#container #mvisual.contents .rolling_btn a {display:inline-block;}

/* main contents*/
.mainC{overflow:hidden; clear:both; background:#000;position:relative; }
.mainC .cleft {width:192px; padding:141px 0 71px 38px; position:absolute; left:0; top:0; background:#e3e3e3 url("../ko/static/images/web/main/ferrum_img.png ") no-repeat 47px 60px;}
.mainC .mfr {display:none;}
.mainC .rcon {max-width:1450px;margin-left:230px; overflow:hidden; clear:both;}
.mainC .rcon .cont {width:50%; background:url("/en/static/images/web/main/con_bg.png") no-repeat right top; /*padding:30px 0 0 48px;*/padding:30px 0 0 0; float:left; height:203px;}
.mainC .rcon .cont span.tit {background:url("../ko/static/images/web/common/bullet_02.gif") no-repeat left 4px; display:block; margin:3px 0 10px;}
.mainC .rcon .cont dl {margin:0 0 23px 48px; clear:both; overflow:hidden; height:84px;}
.mainC .rcon .cont dl.m {display:none;}
.mainC .rcon .cont dl dt {width:100px;}
.mainC .rcon .cont dl dt img {padding-left:10px;}
.mainC .rcon .cont dl dd {color:#adadad; margin-left:30px; position:relative; height:84px; /*font-family:'Dotum',sans-serif;*/ width:65%;}
.mainC .rcon .cont dl dd span.btn1 {display:block; position:absolute; bottom:0; left:0;} 
.mainC .rcon .cont dl dd span.btn2 {display:block; position:absolute; bottom:17px; left:0;}
.mainC .rcon .cont.f_r {float:right;*width:49.5%;}
.mainC .rcon .cont.f_r dl {margin-bottom:18px; height:184px;}
.mainC .rcon .cont dl dt.wd1 {width:90%; position:relative;}
.mainC .rcon .cont dl dt.wd1 span.more {position:absolute; top:-1px; right:0;}
.mainC .rcon .cont dl dd.list {margin:15px 0 0 1px; width:90%;}
.mainC .rcon .cont dl dd.list ul li {background:url("../ko/static/images/web/common/bullet_01.gif") no-repeat left 8px; padding:0 0 5px 8px; color:#737373; position:relative;}
.mainC .rcon .cont dl dd.list ul li span.date {position:absolute; top:0; right:0;}
.mainC .rcon .cont dl dd.list ul li a {color:#737373; width:78%; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;}
.mainC .rcon .cont .info {margin:0 0 33px 48px; position:relative;}
.mainC .rcon .cont .info p.tit {background:url("../ko/static/images/web/common/bullet_02.gif") no-repeat left 4px; display:block; margin:3px 0 10px; padding-left:10px;}
.mainC .rcon .cont .info p.tit span.day {color:#8f8f8f; font-size:11px; /*font-family:'Dotum';*/ margin-left:15px; vertical-align:top; line-height:1.3em;}
.mainC .rcon .cont .info .shares {margin:5px 0 0 10px;}
.mainC .rcon .cont .info .shares .big {color:#fff; font-family:'Verdana',sans-serif; font-size:24px;}
.mainC .rcon .cont .info .shares .changes {color:#fe373d; font-size:12px; /*font-family:'Dotum';*/ margin-top:10px;}
.mainC .rcon .cont .info .shares .changes span.up {background:url("../ko/static/images/web/common/arr_up.png") no-repeat left 4px; padding-left:15px; margin-left:5px;}
.mainC .rcon .cont .info .shares .changes span.down {background:url("../ko/static/images/web/common/arr_down.png") no-repeat left 4px; padding-left:15px; margin-left:5px;}
.mainC .rcon .cont .info p.btna {position:absolute; top:0; right:10%;}
.mainC .rcon .cont .info p.btnb {position:absolute; top:35px; right:10%;}


.mainC .rcon .cont .Ir {overflow:hidden; clear:both;margin-left:48px;}
.mainC .rcon .cont .Ir .value {margin-left:20px; color:#fff; font-size:26px; font-family:'Verdana', sans-serif;}
.mainC .rcon .cont .Ir .value span {font-size:12px; /*font-family:'Dotum',sans-serif;*/ display:block; margin-left:4px}
.mainC .rcon .cont .Ir .value .date {color:#8f8f8f; margin-bottom:8px;}
.mainC .rcon .cont .Ir .value .red {color:#fe373d; margin-top:13px;}
.mainC .rcon .cont .Ir .value span img {margin:0 10px 7px 0; vertical-align:bottom; }

.mgr10 {margin-right:10px;}

/* footer */
#wrapper.main #footer {
	/*background:#393939 url("../ko/static/images/web/common/bg01.png") repeat-x left top;*/
	background:#fff;
	position:relative;
	overflow:hidden;
	clear:both;
}
#wrapper.main #footer .copy {
	/*background:url("../ko/static/images/web/common/footer_img.jpg") no-repeat left top;*/
	background:url("/en/static/images/web/common/f_logo.png") no-repeat 53px 38px;
	height:105px;
	padding:40px 0 0 280px;
	font-size:11px;
	font-family:'Verdana','NanumGothicWeb',sans-serif;	
	font-weight:normal;
	max-width:1400px;
	position:relative;
}
#wrapper.main #footer ul.f_menu {
	overflow:hidden;
	clear:both;
}
#wrapper.main #footer ul.f_menu li {
	background:url("../ko/static/images/web/common/f_line.gif") no-repeat right 7px;
	font-size:11px;
	float:left;	
	color:#fff;
	padding-right:10px;
	margin-right:12px;
}
#wrapper.main #footer ul.f_menu li.fir {padding-left:0;}
#wrapper.main #footer ul.f_menu li.last {background:none;}
#wrapper.main #footer ul.f_menu li a {color:#2d2d2d;}
#wrapper.main #footer address {/*color:#b0b0b0;*/ color:#555;}
#wrapper.main #footer .f_txt {/*color:#b0b0b0;*/ color:#555; font-size:10px; font-weight:normal; line-height:11px; font-family:'Monda', sans-serif;}
#wrapper.main #footer .f_site {position:absolute; top:25px; right:60px;}
#wrapper.main #footer .f_site select {width:150px; padding:5px 0 5px 5px; font-size:12px; /*font-family:'Dotum';*/ border:solid 1px #b0b0b0;}
#wrapper.main #footer p.btnb {position:absolute; top:65px; right:220px;}

/* 이메일 무단수집거부 */
/*#myer {background:url("../ko/static/images/web/common/bg_pop.png") repeat left top; z-index:100; position:absolute; top:0; left:0; width:100%; height:100%; display:none;}*/
#mail {display:none; z-index:10; border:solid 1px #000; /* font-family:'Dotum'; position:relative; width:96%;*/ max-width:570px; position:absolute; left:2%; right:2%; bottom:250px; background:#fff;}
#mail p.top {background:url("../ko/static/images/web/sub/etc/pop_bg.gif") repeat-x left top; position:relative; border-bottom:solid 1px #d0d4d7; padding:19px 0 14px 31px;}
#mail .mloy {padding:23px 35px; line-height:1.7em; color:#636363;}
#mail .ebox {padding:23px 23px 20px; border:solid 1px #d0d4d7;}
#mail strong {margin:25px 0 15px; display:block; color:#2f2f2f;}
#mail .ebtn {position:absolute; right:35px; top:17px; }


@media all and (max-width:1200px) {
	.mainC .rcon .cont dl dd {width:60%;}
}

/* tablet */
@media all and (max-width:1024px) {
	#container #mvisual.contents .mvsa ul.visual.web {display:none;}
	#container #mvisual.contents .mvsa ul.visual.tablet {display:block; height:700px;}
	#container #mvisual.contents .mvsa ul.visual.mobile {display:none;}
	
	#container #mvisual.contents .mvsa ul.visual.tablet li {height:700px;}
	
	
	#container #mvisual.contents {padding-right:0;}
	#container #mvisual.contents .m_right {position:relative; width:100%; background:none;}
	#container #mvisual.contents .m_right.web {display:none;}
	#container #mvisual.contents .m_right.tabe {display:block;}
	#container #mvisual.contents .m_right ul.thum {overflow:hidden; width:101%; position:relative;}
	#container #mvisual.contents .m_right ul.thum li {float:left; width:25%; height:auto;}
	#container #mvisual.contents .m_right ul.thum li.bgf {display:none;}
	#container #mvisual.contents .m_right ul.thum li img {width:100%;}
	#container #mvisual.contents .m_right ul.thum li a {width:25%; margin:0; padding:0;}
	
	
	/*.mainC {padding-bottom:100px;}*/
	.mainC .rcon .cont dl dd {width:60%;}
	.mainC .cleft {display:none;}
	/*.mainC .mfr {display:block; background:url("../ko/static/images/web/main/t_ferrum_bg.jpg") no-repeat center top; text-align:right; width:100%; height:100px; position:absolute; bottom:0; left:0;}*/
	.mainC .mfr {display:block; background:url("../ko/static/images/web/main/t_ferrum_bg.jpg") no-repeat center top; width:100%; height:100px; position:absolute; left:0; bottom:0; overflow:hidden; clear:both;}
	.mainC .mfr img.txti {position:absolute; max-width:253px; width:100%; }
	.mainC .mfr .txt {font-family:'Monda',sans-serif; font-size:26px; color:#000; height:20px; /*width:50%; left:10%;*/ position:absolute; left:-18%; top:40px; width:50%;}
	.mainC .mfr a.fl img {margin:32px 0 30px 28%;/*margin:20px 8% 30px 0;*/}
	.mainC .mfr a.fr img {float:right; margin:32px 28% 30px 0;/*margin:20px 8% 30px 0;*/}
	
	.mainC .rcon {margin-left:0;}
	.mainC .rcon .cont dl {margin-left:5%;}
	.mainC .rcon .cont dl dd {margin-left:10px;}
	.mainC .rcon .cont dl dt.wd1 {width:95%;}
	.mainC .rcon .cont dl dd.list {width:95%;}
	
	.mainC .rcon .cont .info {margin-left:5%;}
	.mainC .rcon .cont .info p.btna {right:5%;}
	.mainC .rcon .cont .info p.btnb {right:5%;}
	
	#wrapper.main #footer .copy {padding:40px 0 0 2%; background:none;}
	#wrapper.main #footer .f_site {right:2%; top:100px;}
	#wrapper.main #footer p.btnb {right:22%; top:100px;}
}


@media all and (max-width:800px) {
	

	.mainC .mfr .txt {left:-13%;}
	
}

@media all and (max-width:780px) {
	
	.mainC .mfr a.fl img {margin:32px 0 30px 8%;}
	.mainC .mfr a.fr img {float:right; margin:32px 8% 30px 0;}
	
	#wrapper.main #footer .f_site {position:relative; top:10px; left:0;}
	#wrapper.main #footer p.btnb {position:absolute; top:97px; right:0.5%; margin-bottom:4px; width:150px;}
}


/* mobile device */
@media all and (max-width:640px) {
	
	#container #mvisual.contents .mvsa ul.visual.web {display:none;}
	#container #mvisual.contents .mvsa ul.visual.tablet {display:none;}
	#container #mvisual.contents .mvsa ul.visual.mobile {display:block; max-height:500px;}
	
	#container #mvisual.contents .mvsa ul.visual {height:none;}
	#container #mvisual.contents .mvsa ul.visual li {height:100%;}
	#container #mvisual.contents .mvsa ul.visual.mobile li img {width:100%; max-width:640px;}
	
	/*#container #mvisual.contents {padding-right:0;}
	#container #mvisual.contents .m_right {position:relative; width:100%; background:none;}
	#container #mvisual.contents .m_right ul.thum {overflow:hidden; width:101%; position:relative;}
	#container #mvisual.contents .m_right ul.thum li {float:left; width:25%; height:auto;}
	#container #mvisual.contents .m_right ul.thum li.bgf {display:none;}
	#container #mvisual.contents .m_right ul.thum li img {width:100%;}
	#container #mvisual.contents .m_right ul.thum li a {width:25%; margin:0; padding:0;}*/
	
	/*#container #mvisual.contents .rolling_btn {top:68%;  하단 섬네일 높이만큼} */
	
	.mainC .rcon .cont {width:100%;}
	.mainC .rcon .cont dl dd {width:70%;}
	.mainC .rcon .cont dl dd.list ul li a {width:80%;}
	
	.mainC .mfr .txt {width:0; left:5%; text-align:left; width:80%;}
	
	#wrapper.main #footer {padding-bottom:20px;}
	/*#wrapper.main #footer ul.f_menu li.cb {clear:both; padding-left:0;}*/
	#wrapper.main #footer .copy address {margin-top:10px;}
	
	#wrapper.main #footer .f_menu .last {display:none;}
	
	#wrapper.main #footer p.btnb {position:relative; top:10px; left:0;}

}

@media all and (max-width:480px) {
	
	
	.mainC .mfr .txt {font-size:22px;}
	.mainC .mfr a.fl img {width:40%; max-width:135px;}
	.mainC .mfr a.fr img {width:40%; max-width:135px;}
	
	.mainC .rcon .cont dl dd {width:55%;}
		
	#wrapper.main #footer .copy {padding:40px 5% 70px;}
	#wrapper.main #footer .f_site {top:1px; left:0;}
	/*#wrapper.main #footer .copy address span.tel {display:block;}
	#wrapper.main #footer .copy .f_txt span.arr {display:block;}*/
	
	
	
}

@media all and (max-width:380px) {
	
	
	
	.mainC .mfr .txt {font-size:18px;}
	
	.mainC .rcon .cont dl dd {width:55%;}
	.mainC .rcon .cont dl dd.list ul li a {width:76%;}
	
	
	#wrapper.main #footer .copy address {text-align:left;}
	#wrapper.main #footer .copy .f_txt {text-align:left;}
	
	#wrapper.main #footer .f_site {top:0; left:0;}

}