@charset "utf-8";


.clearfix {display: block;}
.clearfix:after {display: block;clear: both;content: ".";visibility: hidden;height: 0;}

#wrap{overflow:hidden;position:relative;min-width:1200px;}

.con-area{width:1200px;margin:0 auto;}
.con-area:after{content:"";display:block;clear:both;}

#header{position:relative;}

.top-menu-wrap{overflow:hidden;height:30px;background:#8fc2df;}
.top-menu-wrap ul{float:right;}
.top-menu-wrap ul li{float:left;}
.top-menu-wrap ul li a{display:block;line-height:30px;padding:0px 10px;font-size:13px;color:#fff;}

.gnb-wrap{width:1200px;margin:0 auto;}
.gnb-wrap:after{content:"";display:block;clear:both;}
#logo {float:left; line-height: 0;}
.menu{float:right;}
.menu:after{content:"";display:block;clear:both;}
.menu li{position:relative;float:left;width:160px;height:99px;text-align:center;}
.menu li:nth-child(5) {width:140px;}
.menu li:nth-child(5) .submenu {width:140px;}
.menu li a h2{display:block;line-height: 99px;font-size:18px;color:#515151; font-weight: 800;} 
.menu li a h2:hover, .menu li a h2._active{color:#5493c6;}
.menu li .submenu{width:160px; overflow:hidden;position: absolute;z-index:90;height:0px;border-right:1px solid #e1e1e1;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.menu li:first-child .submenu{border-left:1px solid #e1e1e1;}
.menu li .submenu li:first-child{padding-top:28px;}
.menu li .submenu li{height:auto;width: 100%;}
.menu li .submenu li a {display:block;margin:5px 0;font-weight:400;line-height:normal;font-size:14px;color:#444444;}
.menu li .submenu li a:hover{color:#5493c6;}
.submenu_bak{position:absolute;z-index:80;width:100%;height:0px;border-top:1px solid #e1e1e1; background:rgba(255,255,255,0.9); overflow: hidden;}
.top_title01 {width: 1200px; vertical-align: middle; padding: 50px 0 0 80px; margin: 0 auto;}

.bakDark{display:none;width:100%;height:100%;position:fixed; top:0; left:0;z-index:80;background:rgba(0,0,0,0.7);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4c000000', endColorstr='#4c000000');/* IE8이하 */}
.mo-Mbtn {display:none;position:absolute;top:22px;right:10px;width:40px;height:40px;background:#8fc2df;cursor:pointer;}
.mo-Mbtn:before {content:"";display:block;width:30%;height:5px;margin:11px auto 5px;border-top:3px solid #fff;border-bottom:3px solid #fff;}
.mo-Mbtn:after {content:"";display:block;width:30%;height:0px;margin:5px auto;border-bottom:3px solid #fff;}
.mo-menu{display:none;position:absolute;z-index:90;right:-472px;height:100%;top:0px;}
.mo-menu .mo-menu-box{float:right;width:410px;height:100vh;background: #8fc2df;}
.mo-menu .mo-h{background:#fff;}
.mo-menu .mo-h:after{display: block;clear: both;content: ".";visibility: hidden;height: 0;}
.mo-menu .mo-h .mo-logo{float:left;padding: 9px 0;}
.mo-menu .mo-h .mo-close{float:right;margin: 22px 5px 0 0;cursor:pointer;}
.mo-menu .mo-h .mo-close img{-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-ms-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;}
.mo-menu .mo-h .mo-close img:hover{  -webkit-transform: rotate(360deg);-moz-transform: rotate(360deg);-ms-transform: rotate(360deg);-o-transform: rotate(360deg);transform: rotate(360deg); }

.mo-gnb{overflow:auto;position:relative;height:500px;background:#8fc2df;}
.mo-gnb:after {content: "";display: block;clear: both;}
.mo-gnb li{display:block;border-bottom:1px solid #3f6c90;background:#5493c6;}
.mo-gnb li > a{position:relative;display:block;padding:18px 0 18px 20px;font-size:16px;color:#fff;background:url(/html/images/common/mo_plus.png) top 16px right 20px no-repeat;}
.mo-gnb li > ul{display: none;}
.mo-gnb li > ul > li{display:block;border-bottom:1px solid #70a3c0;}
.mo-gnb li > ul > li > a{position:relative;padding-left:35px;font-size:14px;color:#fff;background:url(/html/images/common/mo_c_l.png) top 21px left 25px no-repeat;background-color:#8fc2df;}
.mo-gnb li > ul > li > a:hover{color:#fff;background-color:#8fc2df;}
.mo-gnb li > ul > li > a:hover::before{content:"";position:absolute;top:0;left:0;width:7px;height:100%;background:#fff;}

/* ---- ???? ---- */
#footer {position:relative;margin-top:40px;padding:0 5px;width:100%;box-sizing: border-box; background:#707070}
#footer .footBox{position:relative;margin:0 auto;padding:25px 0;max-width:1200px}
#footer .footBox .foot_menu{margin-bottom:10px}
#footer .footBox .foot_menu li{position:relative;display:inline-block}
#footer .footBox .foot_menu li::before{position:absolute;top:50%;left:0;margin-top:-6px;width:1px;height:12px;content:'';background:#959595}
#footer .footBox .foot_menu li:first-child::before{display:none}
#footer .footBox .foot_menu li a{display:block;padding:0 10px; line-height: 22px; color:#fff;font-weight:bold}
#footer .footBox .foot_menu .btn_list6 {display:inline-block; width:150px; height:27px; font-size:14px; line-height:27px; color:#fff; text-align:center; border: 1px solid #fff; background:#707070}
#footer .footBox .fFamily{position:absolute;top:15px;right:0}
#footer .footBox .fFamily button{position:relative;width:190px;height:36px;color:#fff;background:#707070; text-indent:15px;font-weight:bold;text-align:left;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;border:1px solid #acacac}
#footer .footBox .fFamily button::after{position: absolute; top: 50%; right: 10px;content: "";width: 0;height: 0;margin-top: -1px;border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 4px solid #e1e1e1;}
#footer .footBox .fFamily button.on::after{transform:rotate(180deg)}
#footer .footBox .fFamily button:hover,
#footer .footBox .fFamily button.on{background:rgba(0,0,0,0.5)}
#footer .footBox .fFamily ul{display:none;position:absolute;bottom:35px;left:0;width:100%;text-align:left;background:#acacac;border:1px solid #acacac;border-width:1px 1px 0}
#footer .footBox .fFamily ul li a{display:block;padding:10px 15px;color:#2b2b2b;border-bottom:1px solid #707070;transition:all 0.2s ease;-webkit-transition:all 0.2s ease}
#footer .footBox .fFamily ul li a:hover{color:#fff;background:#707070;border-bottom:1px solid #acacac}
#footer .footBox .fslog{position:absolute;top:15px;right:0}
#footer .footBox .footInfor{position:relative;padding:20px 0 0 305px}
#footer .footBox .footInfor .f_logo{position:absolute;top:15px;left:5px;}
#footer .footBox .footInfor address{font-size:13px;line-height: 22px;color:#fff}

.t-col-00{color:#000;}
.t-col-01{color:#333333;}
.t-col-02{color:#f66e00;}
.t-col-03{color:#f69100;}
.t-col-04{color:#2db500;}
.t-col-05{color:#3b5998;}
.t-col-06{color:#8fc2df;}
.t-col-07{color:#fac133;}
.t-col-08{color:#506ead;}

em, address, optgroup {
    font-style: normal;
}


@media screen and (max-width:800px){
	#wrap{min-width:auto;}
	.con-area{width:auto;}
	#header{height:auto;}
	.gnb-wrap{width:100%;background:#fff;}

	.menu{display:none;}
	.mo-Mbtn{display:block;}
	.mo-menu{display:block;}

	#logo{width: auto;padding:15px 0;}
	#logo img{width:100%;}

	.quick-section{float: none;width:100%;height:auto;}
	.quick-section ul li{float: left;width: 33.3%;margin: 10px 0;}

	#footer .foot_logo{display:none;}
	#footer .address{padding:10px;}
	#footer .address li{float:none;}
	#footer .address li:first-child {margin: 0px 0 5px;}

	.mo-menu .mo-h .mo-logo img{width:250px;}
}


@media screen and (max-width:480px){
	#wrap{min-width:320px;}
	.mo-menu .mo-menu-box{width:300px;}
	.mo-gnb li > a{padding:15px 0 15px 15px;font-size:14px;}
	
}


/*
================================================================================
??? ????
================================================================================
*/

 

 /* PC Device */
 @media all and (min-width:1201px){
	
	#mGnb{display:none;}
}

 /* TABLET Device */
@media all and (max-width:1200px){
	#footer .footBox{text-align:center}
	#footer .footBox .footInfor{padding:10px 0 0}
	#footer .footBox .footInfor .f_logo{position:relative;top:0;left:0;display:inline-block;margin:0 20px}
	#footer .footBox .fslog{position:relative;top:0;right:0;display:inline-block}
	#footer .footBox .footInfor address{margin-top:20px}
	#footer .footBox .fFamily{position:relative;top:0;display:inline-block;margin-top:20px}

	.ritQuick{display:none}
	
}


 /* Mobile Device */
@media all and (max-width:640px){		
	#footer{margin-top:20px}
	#footer .footBox .fslog{display:none}
}