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


#wrap, #header, #footer {width:100%;margin:0 auto}
#wrap{position: relative; overflow-x: hidden; overflow-y: hidden;}

#contents{height:auto;}
#footer{background:green}


#header {}
#header .inner {max-width:1200px; margin:0 auto; padding:0; display:flex; justify-content:space-between; align-items:flex-end;}
#header .inner h1 {padding:10px;}
#header .inner h1 a {}
#header .inner h1 a img {}
#header .inner div {}
#header .inner div ul.menu {text-align: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{color:#222}


#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:21px; font-family: 'NotoSans'; font-weight:400; padding:15px 20px; display:block}
#header .inner div .nav > ul > li > a:hover {color:#7320ff}
#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:#7320ff }
#header .inner div .nav > ul > li > ul > li a {width:80%;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:#7320ff}


			.menu-bt-wrapper{z-index:6000; display:none; cursor:pointer; position:absolute; top:15px; 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%; top:60px;}
		.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:15px; font-weight:600; 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:35px}
				.all_menu > ul > li > ul > li > a{font-size:15px;font-weight:600;padding-left:55px;display:block}
				.all_menu > ul > li > ul > li > a:hover {color:#7320ff}
				.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:30px}
				.all_menu > ul > li > ul > li > ul > li > a{font-size:15px;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; 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:15px; width:100%;padding:15px 0 15px 35px;display:block;border-bottom:1px solid #ccc; font-weight:600;}

				.toggle_btn1{background:#7320ff;color:#fff;border-bottom:1px solid #7320ff !important;margin-top:-1px}
				.toggle_btn1 span{background-position:0 0 !important}
				.toggle_btn2{color:#7320ff}
				.toggle_btn3{color:#7320ff}
					.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}





	


	.rolling_bn{width:100%; }
	.rolling_bn .main_banner{width:100%;height:100%}
	.rolling_bn .main_banner .bannerList{width:100%;position:relative; margin:30px auto}
	.rolling_bn .main_banner .bannerList .bannerListwrap{position:relative;max-width:1220px;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:270px !important;}
	.rolling_bn .main_banner .bx-wrapper .bx-prev{width:20px;height:30px;left:-25px;background:url(/images/news_btn.png) no-repeat 0 0}
	.rolling_bn .main_banner .bx-wrapper .bx-next{width:20px;height:30px;right:-25px;background:url(/images/news_btn.png) no-repeat -20px 0}
	.rolling_bn .bx-wrapper .bx-pager, .rolling_bn .bx-wrapper .bx-controls-auto, .rolling_bn .bx-controls {bottom:0;}



#footer {width:100%; background:#f5f5f5; padding:25px 5px;}
#footer .footIn {margin:0 auto; max-width:1200px; position:relative}
#footer .footIn:after {display:block;content:'';clear:both; visibility:hidden}
#footer .footIn .foot_logo {margin-right:80px; display:inline-block;}
#footer .footIn .foot_logo img {max-width:200px; width:100%;}
#footer .footIn .address { display:inline-block;font-size:13px; color:#888; margin:0; line-height:1.5; letter-spacing:0;}
#footer .footIn .address a {color:#aaa; font-size:12px;}
#footer .footIn .top { position:absolute; right:0; top:0}
#footer .footIn .top .ssl {width:50px; margin-right:5px;}
#footer .address span {color:#bbb; margin:0 10px;}
#footer .address .none {display:none;}



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

@media(max-width:1260px){
	.rolling_bn .main_banner .bannerList .bannerListwrap{max-width:935px;}
}
@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:1000px){
	#header{position:fixed; top:0; background:#fff; z-index:999; height:60px; box-shadow:0px 2px 10px #eee}
	
	.menu, .nav{display:none}
	.menu-bt-wrapper{display:block}
	#header .inner h1 a img {max-width:220px; vertical-align:middle;}

	#footer .footIn .foot_logo {display:block; margin-right:0; margin-bottom:5px; text-align:center;}
	#footer .footIn .address {display:block; text-align:center; font-size:12px;}
	#footer .footIn .foot_logo img {max-width:150px;}
	#footer .footIn .top {top:-50px}
}
@media(max-width:985px){
	.rolling_bn .main_banner .bannerList .bannerListwrap{max-width:655px;}
}

@media(max-width:700px){
	.rolling_bn .main_banner .bannerList .bannerListwrap .bannerIn li {width:220px !important;}
	.rolling_bn .main_banner .bannerList .bannerListwrap .bannerIn li img {max-width:100%;}
	.rolling_bn .main_banner .bannerList .bannerListwrap{max-width:325px;}
	.rolling_bn .main_banner .bx-wrapper .bx-next, .rolling_bn .main_banner .bx-wrapper .bx-prev {top:0;}
}


@media(max-width:500px){
	.all_menu, .service{width:50%}
	.top_btn{display:none}
}