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


#wrap, #header, #footer {width:100%;margin:0 auto}
#wrap{position: relative; overflow-x: hidden; overflow-y: hidden;}
#header{z-index:1;width:100%;height:90px;background:#fff; position:absolute;}
	.section{}
	.main{height:100%;}
	.icon{height:15%}
#contents{height:auto;}
#footer{background:green}


#header {}
#header .inner {max-width:1200px; margin:0 auto; padding:0}
#header .inner h1 {float:left; padding-top:35px;}
#header .inner h1 a {}
#header .inner h1 a img {width:100%;}
#header .inner div {float:right}
#header .inner div ul.menu {float:right;margin-top:15px}
#header .inner div ul.menu li {display:inline-block}
#header .inner div ul.menu li a {color:#888;font-size:13px;padding:0 8px}
#header .inner div ul.menu li a:hover{/*font-weight:bold*/ color:#222}

#header .inner div .nav{clear:both}
#header .inner div .nav > ul > li {float:left;position:relative}
#header .inner div .nav > ul > li:last-child {margin-right:0}
/*#header .inner div .nav > ul > li:last-child a {padding-right:10px}*/
#header .inner div .nav > ul > li > a {font-size:20px; font-family: 'NanumSquare', "Noto Sans KR"; font-weight:600; padding:15px 20px; display:block}
#header .inner div .nav > ul > li > a:hover {color:#d54d4a}
#header .inner div .nav > ul > li > ul {z-index:500;position:absolute;top:54px;right:55%;margin-right:-80px; width:150px;background:rgba(255,255,255,0.9);max-height:0;overflow:hidden;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
#header .inner div .nav > ul > li > ul > li {width:100%;margin:0 auto;font-size:14px;font-weight:600;text-align:center}
#header .inner div .nav > ul > li > ul > li:hover a {color:#d54d4a }
#header .inner div .nav > ul > li > ul > li a {width:70%;margin:0 auto;border-bottom:1px solid rgba(0,0,0,0.1);padding:10px 0;display:block;color:#888; font-size:14px; font-weight:400}
#header .inner div .nav > ul > li > ul > li:last-child a {border-bottom:none}
#header .inner div .nav > ul li:hover ul {max-height:800px}
			.nav_over{color:#d54d4a}


			.menu-bt-wrapper{z-index:6000; display:none; cursor:pointer; position:absolute; top:25px; right:5px; background:rgba(255, 255, 255, 0)}
			.menu-bt {display:block; position:relative; width:45px; height:40px; padding:10px; box-sizing:border-box;}
			.menu-bt-line{float:left; position:relative; height:2px; width:100%; background-color:#444; border-radius:50px; transition:all .5s ease-in-out; -webkit-transform-origin:left center;-moz-transform-origin:left center;-ms-transform-origin:left center;-o-transform-origin:left center; transform-origin:left center;}
			.menu-bt-line1{top:0}
			.menu-bt-line2 {top:7px;opacity:1}
			.menu-bt-line3 {top:14px}
			.menu-open .menu-bt .menu-bt-line1{transform: rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform: rotate(45deg)}
			.menu-open .menu-bt .menu-bt-line2{opacity:0}
			.menu-open .menu-bt .menu-bt-line3{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform: rotate(-45deg)}
		.ove{overflow-y:hidden; position: fixed; width: 100%}


#mb_nav{display:none;position:fixed;z-index:4000;width:100%;height:100%;background:#fff;padding:0 5%}
		.log_inout{border:1px solid #ccc;width:100%;height:50px;margin:15px auto 25px}
		.log_inout li{float:left;width:50%;height:100%;text-align:center;background:#f5f5f5}
		.log_inout li:last-child{border-left:1px solid #ccc}
		.log_inout li a{font-size:14px;font-weight:700;line-height:50px;display:block}
		.log_inout li a img{position:relative;top:7px;left:-10px;width:27px}

				.all_menu{width:25%;float:left}
				.all_menu h3{width:100%;height:45px;font-size:16px; font-weight:600; line-height:40px}
				.all_menu h3 a{width:100%;height:100%;display:block;text-align:center;border:1px solid #ccc;border-bottom:none;}
				.all_menu > ul{position:absolute;left:5%;clear:both;width:90%;margin:0 auto;padding-bottom:100px}
				.all_menu > ul:after{display:block;content:'';clear:both;position:relative;margin-bottom:50px !important}
				.all_menu > ul > li{position:relative;background:#f5f5f5;border:1px solid #ccc;border-top:none}
				.all_menu > ul > li:first-child{border-top:1px solid #ccc}
				.all_menu > ul > li > a{font-size:16px; font-weight:500; width:100%; padding:15px 0 15px 35px; display:block; cursor:pointer;}
				.all_menu > ul > li > a > span{position:absolute;top:2px;right:0;background:url(/images/bg6.png) no-repeat; width:50px;height:50px;overflow:hidden}
				.all_menu > ul > li > ul{display:none;background:#fff}
				.all_menu > ul > li > ul > li{line-height:30px}
				.all_menu > ul > li > ul > li > a{font-size:14px;font-weight:600;padding-left:55px;display:block}
				.all_menu > ul > li > ul > li > a:hover {color:#c02b29}
				.all_menu > ul > li > ul > li:first-child{padding-top:10px}
				.all_menu > ul > li > ul > li:last-child{padding-bottom:10px}
				.all_menu > ul > li > ul > li > ul{padding:10px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;background:#eee;display:none}
				.all_menu > ul > li > ul > li > ul > li{line-height:25px}
				.all_menu > ul > li > ul > li > ul > li > a{font-size:13px;font-weight:600;color:#888;padding-left:75px;display:block}
				.all_menu > ul > li > ul > li > ul > li > a > i{font-size:10px;color:#aaa;position:relative;top:-3px}
				.all_menu > ul > li > ul > li > ul > li > a > span{font-size:14px;color:#aaa}
				.all_menu > ul > li > ul > li > ul > li > a:hover{color:#222}
				.all_menu > ul > li > ul > li > ul > li > a:hover i{color:#222}
				.all_menu > ul > li > ul > li > ul > li > a:hover span{color:#222}
				.all_menu > ul > li > ul > li > ul > li > ul{padding:10px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;background:#ddd;display:none}
				.all_menu > ul > li > ul > li > ul > li > ul > li{line-height:22px}
				.all_menu > ul > li > ul > li > ul > li > ul > li > a{font-size:13px;font-weight:600;color:#666;padding-left:100px;display:block}
				.all_menu > ul > li > ul > li > ul > li > ul > li > a > i{font-size:10px;color:#666;position:relative;top:-3px}

				.service{width:25%; float:left}
				.service h3{width:100%; height:45px; font-size:16px; font-weight:600; line-height:40px;}
				.service h3 a{width:100%; height:100%; display:block; text-align:center; border:1px solid #ccc;border-left:none;border-bottom:none;}
				.service > ul{display:none;position:absolute;left:5%;border:1px solid #ccc;border-bottom:none;width:90%;margin:0 auto}
				.service > ul > li{position:relative;background:#f5f5f5}
				.service > ul > li > a{font-size:16px; width:100%;padding:15px 0 15px 35px;display:block;border-bottom:1px solid #ccc}

				.toggle_btn1{background:#c02b29;color:#fff;border-bottom:1px solid #c02b29 !important;margin-top:-1px}
				.toggle_btn1 span{background-position:0 0 !important}
				.toggle_btn2{color:#d54d4a}
				.toggle_btn3{color:#d54d4a}
					.mb_nav_open{width:100%;overflow-x:hidden;overflow-y:auto;position:fixed}
					.mb_teb_on a{color:#fff;background:#444;border:1px solid #444 !important}




					.section06 { width:100%;overflow:hidden}
					.section06 .banner { max-width:1200px; margin:20px auto}
/*
					.bannerListwrap {position:relative; max-width:1331px; margin:0 auto;  height:135px;overflow:hidden; padding:20px 40px; background:#f5f5f5}
					.bannerListwrap ul { overflow:hidden; margin:0 auto;}
					.bannerListwrap ul li { float:left; margin-right:17px; }
					.bannerListwrap ul li:last-child { margin-right:0;}
					.bannerListwrap .bannerbtn .prev {display:block; position:absolute; top:40%; left:8px; background:url(/images/btn_prev.png) no-repeat; width:7px; height:13px;}
					.bannerListwrap .bannerbtn .next {display:block; position:absolute; top:40%; right:10px; background:url(/images/btn_next.png) no-repeat; width:7px; height:13px;}
*/
	
	


	.rolling_bn{width:100%; background:#eee; height:170px;}
	.rolling_bn .main_banner{width:100%;height:100%;}
	.rolling_bn .main_banner .bannerList{width:100%;margin:0 auto;position:relative;padding:40px 10px 0;}
	.rolling_bn .main_banner .bannerList .bannerListwrap{position:relative;max-width:1225px;margin:0 auto;overflow:hidden;padding:0 50px;}
	.rolling_bn .main_banner .bannerList .bannerListwrap .bx-wrapper{max-width:1200px !important}
	.rolling_bn .main_banner .bannerList .bannerListwrap .bannerIn li{width:176px !important;height:95px !important;}
	.rolling_bn .main_banner .bx-wrapper .bx-prev{width:20px;height:30px;top:20px;left:0;background:url("/images/news_btn.png") no-repeat 0 0;}
	.rolling_bn .main_banner .bx-wrapper .bx-next{width:20px;height:30px;top:20px;right:0;background:url("/images/news_btn.png") no-repeat -20px 0;}




#footer {width:100%; background:#444; padding:50px 5px; height:150px;}
#footer .footIn {margin:0 auto; max-width:1200px; position:relative}
#footer .footIn:after {display:block;content:'';clear:both; visibility:hidden}
#footer .footIn .foot_logo {float:left; margin-right:30px;}
#footer .footIn .foot_logo img {max-width:240px; width:100%;}
#footer .footIn .address {float:left; font-size:12px; color:#dcdcdc; margin:0; line-height:1.5; letter-spacing:0;}
#footer .footIn .address a {color:#999; font-size:12px;}
#footer .footIn .top { position:absolute; right:0; top:0}
#footer .footIn .top .ssl {width:50px; margin-right:5px;}
#footer .footIn .top .qr {margin-right:5px;}
#footer .address span {color:#666; margin:0 10px;}
#footer .address .none {display:none;}

#footer .qr {position:relative; left:30px;}


/******************** 반응형 ********************/

@media(max-width:1260px){
	.rolling_bn .main_banner .bannerList .bannerListwrap{max-width:945px;}
}
@media(max-width:1200px){
	#header>.inner>div {margin-right:20px;}
	.nav > li > a{font-size:20px;padding:10px 15px 15px}
	.menu li:last-child a{margin-right:5px}
}
@media(max-width:1050px){
	#footer {height:auto;}
	h1 img, #footer .footIn .foot_logo img {/*width:230px;*/ margin-left:5px;}
	#header .inner h1 {padding-top:40px}
	#footer .ri{right:60px;bottom:0}
}
@media(max-width:1000px){
	#header{position:relative;height:70px;}
	#contents {height:auto;}
	.menu, .nav{display:none}
	.menu-bt-wrapper{display:block}
	/*#header .inner h1 {padding-top:0; margin:25px 0;}*/
	/*#footer .footIn .address {width:75%}*/
	#header .inner h1 {padding-top:30px;}
}
@media(max-width:985px){
	.rolling_bn .main_banner .bannerList .bannerListwrap{max-width:660px;}
}
@media(max-width:800px){
	h1 img, #footer .footIn .foot_logo img {width:200px}
	#footer h2{float:none;margin:0 -10px 15px 0}
	#footer .inner{padding:40px 10px 90px}
	#footer .le{float:none;text-align:center}
	#footer .address{float:none;display:inline-block}
	#footer .address li a{padding:0px 10px 15px;font-size:15px}
	#footer address{margin:0 auto}
	#footer address p{font-size:12px}
	#footer address p br{display:block}
	#footer address p span.none{display:none}
	.util_site ul li a{font-size:13px}
}
@media(max-width:700px){
	.rolling_bn .main_banner .bannerList .bannerListwrap{max-width:380px;}
	#footer .footIn .address {width:75%;}
	#footer .qr {position:absolute; left:250px; top:10px;}
}

@media(max-width:600px){
	#footer .address .none {display:block;}
	#footer .footIn .top {bottom:-45px; top:unset;}
	#footer .footIn .address {width:100%;}
}
@media(max-width:500px){
	.all_menu, .service{width:50%}
	#footer h2{display:none}
	#footer .inner{padding:50px 10px 120px}
	#footer .ri{right:50%;margin-right:-110px;padding-bottom:40px}
	.top_btn{display:none}
}
@media(max-width:450px){
/* 	.rolling_bn {height:110px;}
	.rolling_bn .main_banner .bannerList {padding:20px 10px 0}
	.rolling_bn .main_banner .bx-wrapper .bx-next, .rolling_bn .main_banner .bx-wrapper .bx-prev {top:20px;}
	.rolling_bn .main_banner .bannerList .bannerListwrap .bannerIn li {width:220px !important; height:71px !important;}
	.rolling_bn .main_banner .bannerList .bannerListwrap {max-width:280px; padding:0 25px;} */
}