@charset "utf-8";

/*노브랜드 main CSS*/

/*mobile*/


/*main footer style*/
#footer {display:none; position:absolute; width:100%; padding:20px 4% 15px 4%; z-index:200; bottom:0; background-color:#111111; box-sizing:border-box;}
#footer div {background:url(../images/common/ft_logo.png) no-repeat 0 0; background-size:100px;}
#footer p {font-size:68.5%; color:#777; letter-spacing:1.5px;}
#footer p.add {padding:25px 0 2px 0; box-sizing:border-box;}
#footer em {color:#a0a0a0;}


/*main contents common*/
.main_section .section_inner1 {width:90%; margin:0 auto; height:80%; overflow:hidden;}
.main_section .mtit {height:8%; text-align:center; font-size:125%; font-weight:700;}
.main_section .mtxt {text-align:center; font-size:87.5%; line-height:1.6;}
.main_section .mtxt br {display:block;}

.main_section .mbtn_more {display:table; width:100%; height:12%;}
.main_section .mbtn_more p {display:table-cell; height:56%;}
.main_section .mbtn_more a {display:block; border:1px solid #333; text-align:center; font-size:75%; font-weight:700; line-height:40px; box-sizing:border-box; transition:.3s ease .1s;}
.main_section .mbtn_more:hover a {background:#333; color:#fff;}

/*main 1page*/
.main_sec1 {position:relative; text-align:center;}
.main_sec1 span p {display:inline-block; width:65%; max-width:450px; padding-bottom:12%; background:url(../images/main/main_tit_temp.png) no-repeat 0; background-size:contain; text-indent:-9999px; transition:.5s ease .1;}
.main_sec1 span em {display:block; font-size:75%; letter-spacing:4.8px; color:#fff; font-weight:700;}
.main_sec1 .bottom_scroll {position:absolute; left:50%; bottom:10%; width:30px; height:30px; margin-left:-15px; background:url(../images/common/btn_scroll.png) no-repeat 0 0; background-size:contain; text-indent:-9999px;}

/*main 2page*/
.main_sec2 .fs1_1 {display:table; width:100%; height:22%; background:url(../images/main/fs1_1.png) no-repeat 0 0; background-size:cover;}
.main_sec2 .fs1_1 p {display:table-cell; color:#fff;}
.main_sec2 .fs1_1 p span {display:block;}
.main_sec2 .fs1_2 {position:relative; height:58%; background:url(../images/main/fs1_2.png) no-repeat center center; background-size:100%;}
.main_sec2 .fs1_2 div {display:none; position:absolute;}
.main_sec2 .fs1_2 .box1 {right:0; width:34%; padding-bottom:100%; background:#6b6b6b; opacity: 0.1;}
.main_sec2 .fs1_2 .box2 {right:0; bottom:0; width:18%; padding-bottom:18%; background:#817a82; opacity: 0.3;} 

/*main 3page*/
.main_sec3 .fs2_1 {height:10%;}
.main_sec3 .fs2_2 ul:after {content:""; clear:both; display:block;}
.main_sec3 .fs2_2 {height:70%;}
.main_sec3 .fs2_2 ul {height:100%;}
.main_sec3 .fs2_2 ul li {float:left; width:49%; height:49%; background-repeat:no-repeat; background-position:center center; background-size:cover; transition:.5s ease .1s;}
.main_sec3 .fs2_2 ul li a {display:block; height:100%; position:relative; color:#fff; font-size:100%; font-weight:700; transition:.5s ease .1s;}
.main_sec3 .fs2_2 ul li a p {display:block; position:absolute; width:100%; left:0; top:45%;}
.main_sec3 .fs2_2 ul li a p span {display:block; text-align:center;}
.main_sec3 .fs2_2 ul li a p span {display:block; text-align:center;}
.main_sec3 .fs2_2 ul li a em {display:block; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #fff; background:url(../images/main/btn_plus.png) no-repeat 90% 90%; box-sizing:border-box; opacity:0; transition:.5s ease .1s;} 

.main_sec3 .fs2_2 ul li:nth-child(2n) {float:right;}
.main_sec3 .fs2_2 ul li:nth-child(3),.main_sec3 .fs2_2 ul li:nth-child(4) {margin-top:2%;}
.main_sec3 .fs2_2 ul li:nth-child(1) {background-image:url(../images/main/fs2_1.png);} 
.main_sec3 .fs2_2 ul li:nth-child(2) {background-image:url(../images/main/fs2_2.png);} 
.main_sec3 .fs2_2 ul li:nth-child(3) {background-image:url(../images/main/fs2_3.png);} 
.main_sec3 .fs2_2 ul li:nth-child(4) {background-image:url(../images/main/fs2_4m.png);} 
.main_sec3 .fs2_2 ul li:hover:nth-child(1) {background-image:url(../images/main/fs2_1_on.png);} 
.main_sec3 .fs2_2 ul li:hover:nth-child(2) {background-image:url(../images/main/fs2_2_on.png);} 
.main_sec3 .fs2_2 ul li:hover:nth-child(3) {background-image:url(../images/main/fs2_3_on.png);} 
.main_sec3 .fs2_2 ul li:hover:nth-child(4) {background-image:url(../images/main/fs2_4m_on.png);}
.main_sec3 .fs2_2 ul li:hover a em {opacity:1; width:75%; height:75%; top:12.5%; left:12.5%;}

/*main 4page*/
.main_sec4 .fs4_1 {height:10%;}
.main_sec4 .fs4_2 {height:54%; overflow:hidden; position:relative; background:url(../images/main/fs3.png) no-repeat 0 0; background-size:cover;}
.main_sec4 .fs4_2 p {display:none; position:absolute; opacity:0.1;}
.main_sec4 .fs4_2 .box1 {bottom:20%; left:27%; width:52%; padding-bottom:50%; background:#222;}
.main_sec4 .fs4_2 .box2 {bottom:0; right:16%; width:30%; padding-bottom:29%; background:#000;}




/*tablet*/
@media only screen and (min-width:768px) {

	/*main 1page*/
	.main_sec1 span p {height:119px; padding-bottom:0;}
	.main_sec1 span em {font-size:87.5%;}
	.main_sec1 .bottom_scroll {width:60px; height:60px; margin-left:-30px;}
	
}


/*PC*/
@media only screen and (min-width:1024px) {
	
	#header {height:62px;}
	/*main footer style*/
	#footer {display:block; position:absolute; bottom:0; left:0; padding:0 0 40px 0; z-index:200; background:transparent}
	#footer div {width:90%; margin:0 auto; background:none; overflow:hidden;}
	#footer p {font-size:75%; color:#777; font-weight:700; letter-spacing:1.8px;}
	#footer p em {vertical-align:top; color:#a0a0a0; font-weight:700;}
	#footer p.add {float:left; padding:0;}
	#footer .copy {float:right;  padding:0;}
	
	/*main contents common*/
	.main_section .section_inner1 {width:1200px;}
	.main_section .mbtn_more {height:46px; width:170px;}
	.main_section .mbtn_more p {height:100%;}
	.main_section .mbtn_more a {height:100%; padding-left:20px; text-align:left; background:url(../images/common/btn_morebgb.png) no-repeat 142px center; line-height:44px; box-sizing:border-box;}
	.main_section .mbtn_more.mbtn_more_w a {background:url(../images/common/btn_morebgw.png) no-repeat 142px center; border-color:#fff; color:#fff;}
	.main_section .mbtn_more.mbtn_more_w:hover a { background:url(../images/common/btn_morebgb.png) no-repeat 142px center #fff; color:#333; border-color:#333;}
	.main_section .mbtn_more:hover a {background:url(../images/common/btn_morebgw.png) no-repeat 142px center #333; border-color:#fff;}
	
	.main_section .mtit {display:inline-block; position:relative; width:auto; height:70px; font-size:225%; line-height:2.4;}
	.main_section .mtxt {font-size:112.5%;}
	.main_section .mtxt br {display:none;}
	.main_section .titbar {display:none; position:absolute; top:0; left:0; width:10px; background:#333;}

	/*main 1page*/
	.main_sec1 div {position:relative; vertical-align:bottom; height:60%;}
	.main_sec1 .main_news {width:40%; height:45px; margin:6% auto 8%; background-color:#000; overflow:hidden; text-align:center; line-height:45px;}
	.main_sec1 .main_news dt {float:left; width:7%; height:45px; background:url(../images/main/bg_mainnews.gif) no-repeat right 16px; text-align:center;}
	.main_sec1 .main_news dt a {display:inline-block; width:13px; height:15px; background:url(../images/main/btn_news.png) no-repeat 0; text-indent:-9999px;}
	.main_sec1 .main_news dd {float:left; width:93%; text-align:left; line-height:42px; color:#fff; font-size:87.5%; padding:0 1.5%; box-sizing:border-box; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
	.main_sec1 .main_news dd a {color:#fff;}
	
	/*main 2page*/
	.main_sec2 .main_sec2_wrap {position:relative; height:670px;}
	.main_sec2 h2 {margin-left:42%; padding-top:204px; margin-top:30px;}
	.main_sec2 h2 em {height:203px;}
	.main_sec2 .fs1_1 {float:right; display:block; text-align:center; width:58%; margin-top:16px; height:348px;}
	.main_sec2 .fs1_1 p {display:inline-block; margin-top:10%;}
	.main_sec2 .fs1_1 span {text-align:left;}
	.main_sec2 .fs1_2 {float:left; width:32%; height:546px; margin-top:-305px; background-position:left 30px;}
	.main_sec2 .fs1_2 .box1 {width:200px; height:514px; padding-bottom:0; top:0px; right:-30px;}
	.main_sec2 .fs1_2 .box2 {width:104px; height:104px; padding-bottom:0; bottom:-50px; right:-50px;}
	.main_sec2 .mbtn_more {position:absolute; left:49%; top:530px;}

	/*main 3page*/
	.main_sec3 .main_sec3_wrap {height:560px;}
	.main_sec3 h2 {padding-top:88px;}
	.main_sec3 h2 em {height:88px;}
	.main_sec3 .fs2_1 p {direction:inline-block; text-align:left; height:auto; width:auto;}
	.main_sec3 .fs2_2 ul li a {font-size:175%; font-weight:400;}
	.main_sec3 .fs2_2 ul li a p {top:42%;}
	.main_sec3 .fs2_2 ul li:hover a {font-size:125%; font-weight:700;}
	.main_sec3 .fs2_2 ul li {float:left; width:23.5%; margin-right:2%; height:270px;}
	.main_sec3 .fs2_2 ul li:nth-child(2n) {float:left;}
	.main_sec3 .fs2_2 ul li:nth-child(3) {margin-top:0;}
	.main_sec3 .fs2_2 ul li:nth-child(4) {height:560px; margin-top:-298px;; margin-right:0; background-image:url(../images/main/fs2_4.png);}
	.main_sec3 .fs2_2 ul li:hover:nth-child(4) {background-image:url(../images/main/fs2_4_on.png);}
	.main_sec3 .fs2_2 ul li:hover:nth-child(4) a em {height:90%; top:5%;}
	.main_sec3 .mbtn_more {margin-bottom:40px;}
	
	/*main 4page*/
	.main_sec4 .main_sec4_wrap {position:relative; height:690px;}	
	.main_sec4 h2 {width:40%; padding-top:314px; margin-left:58%;}
	.main_sec4 h2 em {height:314px;}
	.main_sec4 .fs4_1 {display:block; text-align:left; width:auto; height:auto; margin-left:58%;}
	.main_sec4 .fs4_1 p {display:inline-block; text-align:left; margin-bottom:26px;}
	.main_sec4 .fs4_2 {position:static; width:50%; height:628px; margin-top:-437px;} 
	.main_sec4 .mbtn_more {position:absolute; left:58%;}
	.main_sec4 .fs4_2 .box1 {width:300px; height:300px; padding-bottom:0; bottom:18%; left:20%;}
	.main_sec4 .fs4_2 .box2 {width:170px; height:170px; padding-bottom:0; bottom:0; left:41%;}
	
		/*PC최소버전*/
		@media only screen and (max-width:1500px) {
		.main_section .section_inner1 {width:980px;}
		.main_section .mtxt {font-size:100%;}
		.main_sec2 .main_sec2_wrap {height:500px;}
		.main_sec2 h2 {padding-top:140px;}
		.main_sec2 h2 em {height:140px;}
		.main_sec2 .fs1_1 {margin-top:10px; height:250px;}
		.main_sec2 .fs1_2 {height:440px; margin-top:-240px; background-position:left 30px;}
		.main_sec2 .mbtn_more {left:48%; top:390px;}
		.main_sec3 .main_sec3_wrap {height:500px;}
		.main_sec3 .fs2_2 ul li {height:206px;}
		.main_sec3 .fs2_2 ul li:nth-child(4) {height:506px;}
		.main_sec4 .main_sec4_wrap {height:500px;}
		.main_sec4 .fs4_2 {position:static; width:50%; height:500px; margin-top:-300px;} 
		.main_sec4 .fs4_1 p br {display:block;}
		.main_sec4 h2 {padding-top:150px;}
		.main_sec4 h2 em {height:160px;}
		.main_sec4 .fs4_2 .box1 {bottom:18%; left:10%;}
		.main_sec4 .fs4_2 .box2 {bottom:0; left:32.5%;}
		}
	
	
	
}