/*reset*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

*{margin:0;padding:0;box-sizing:border-box}
li{list-style:none}
img{border:0;max-width:100%}
html{font-size:18px;}
body, td, p, input, button, textarea, select,a{font-family:'Noto Sans KR',sans-serif; color:#333}
p{line-height:1.6}
h1,h2,h3,h4,h5,h6{font-weight:600}
strong,th,b,dt,em{font-weight:500}
em,i{font-style:normal}
a,a:hover,a:active,a:focus{text-decoration:none}


.img_round img{border:1px solid #ddd;border-radius:30px;}

/*color*/
:root{
    --main-color:#3399cc;
}
    


/************************************************
pc
************************************************/
@media all and (min-width:1024px){
    ._mo{display:none}
    
    .container{position:relative;max-width:1410px;margin:0 auto}   
	 
	
    /*scroll*/
    .scroll .hsec1{height:80px}
    .scroll .lnb li > a{height:80px;line-height:80px}
    .scroll .lnb .sub{top:80px}
    .scroll #main{padding-top:80px}


    /*header*/
    #header{position:fixed;left:0;top:0;width:100%;z-index:100;background:#fff;border-bottom:1px solid #eee;transition:background 0.5s}

    .hsec1{display:flex;justify-content:space-between; align-items:center;height:100px;padding:0 2.5%;;transition:height 0.3s}
    .hsec1 .logo{font-size:0} 
    .hsec1 .open_allmenu{width:50px;height:50px;background:url('../images/hd_sitemap_on.png') no-repeat center;text-indent:-9999px;cursor:pointer}

    .lnb ul{display:flex;text-align:center}
    .lnb li{position:relative}			
    .lnb li > a{display:block;position:relative;height:100px;line-height:100px;padding:0 50px;font-size:20px;font-weight:500;color:#000;white-space:nowrap}
    .lnb li > a:before{position:absolute;content:'';left:50%;top:0;width:0%;height:2px;background:var(--main-color);transition:0.3s}
    .lnb li:hover > a:before{left:0;width:100%}
    .lnb li:hover .sub{display:block}
    .lnb .sub{display:none;position:absolute;left:50%;top:100px;width:160px;transform:translateX(-50%);background:#fff;padding:20px 0;border:1px solid #eee;border-top:0}  
    .lnb .sub dd{padding:0 20px;}
    .lnb .sub dd a{display:block;line-height:40px;font-size:16px}
    .lnb .sub dd a:hover{color:var(--main-color)}        


    .all_menu{position:fixed;z-index:100;top:-100%;left:0;width:100%;height:100%;background:var(--main-color);transition:top 0.5s}
    .all_menu.on{top:0}
    .all_menu .logo{position:absolute;left:50px;top:40px}
    .all_menu .close{position:absolute;right:50px;top:30px;width:50px;height:50px;background:url('../images/close_x.png') no-repeat center;cursor:pointer}
    .all_menu .inner{position:relative;top:100px;border:1px solid rgba(255,255,255,0.2);border-width:1px 0;text-align:center}
    .all_menu .inner li{display:inline-block;position:relative;line-height:80px}
    .all_menu .inner li > a{color:#fff;font-size:24px;padding:0 50px}
    .all_menu .inner .sub{position:absolute;width:100%;padding:30px 0}
    .all_menu .inner .sub dd{line-height:35px}
    .all_menu .inner .sub a{font-size:16px;color:#fff}

    /*main*/
    #main{padding-top:100px;transition:0.3s}  

    /*footer*/
    #footer{background:#4d525e;padding:50px 0}
	#footer a {font-size:14px;color:#fff;}
    .fsec1 {display:flex}
    .fsec1 .logoG{}
    .fsec1 .contG{flex:1;padding:0 50px;font-size:14px;color:#fff;line-height:2}
    .fsec1 .contG .company{}
    .fsec1 .contG .company i{margin:0 10px}
    .fsec1 .contG .copyright{font-size:13px;color:#b9c0c7;margin-top:10px}
	
    .a3design{display:inline-block;background:#6b7791;padding:1px 10px;font-size:14px;margin:20px 0}
	
	
	#fs2{height:50px;line-height:50px;background:#3399cc;font-size:16px;color:#fff}
#fs2 a{font-size:16px;color:#fff;display:inline-block;margin:0 30px}
#fs2 a:first-child{margin-left:15px}
	
		#layerPopup1{display:none;position:fixed;z-index:900000;left:0;top:0;background:rgba(0,0,0,0);text-align:center}
			#layerPopup1.on{display:block}
			#layerPopup1 .popup{display:inline-block;position:relative;top:200px; left:100px}
			#layerPopup1 .popup img{max-width:100%}
			#layerPopup1 .close_area{background:#000;width:100%;text-align:right; padding:15px 10px; margin-top:-6px}
			#layerPopup1 .close_area span{cursor:pointer;margin:5px;color:#fff}
			#layerPopup1 .cookie_close{float:left}
			#layerPopup1 .basis_close{}

}


/*************************************************
tablet
**************************************************/
@media all and (max-width:1480px){
    .lnb li > a{padding:0 30px}
}



/*************************************************
mobile
**************************************************/
@media all and (max-width:1023px){
    ._pc{display:none}   
    
    html{font-size:12px;}
    .container{padding:0 4%}
    
	
	
	    
	/*header*/
	#header{position:fixed;left:0;top:0;width:100%;z-index:100;border-bottom:1px solid #ddd}
	.hsec1{display:flex;justify-content: space-between;align-items: center; height:60px;background:#fff;}
	.hsec1 .logo{font-size:0;margin-left:4%} 
    .hsec1 .logo img{height:20px;vertical-align:top}   
	
	
	.lnb{position:fixed;width:65%;left:-65%;top:0;z-index:90;height:100%;background:#fff;transition:.3s;overflow:auto}
	.lnb.on {left:0;transition:.3s}
	.lnb .close{position:absolute;right:0;top:10px;width:40px;height:40px;cursor:pointer}
    .lnb .close:before{display:block;content:'';position:absolute;width:24px;height:2px;left:50%;top:50%;background:#000;transform:translate(-50%,-50%) rotate(45deg)}
    .lnb .close:after{display:block;content:'';position:absolute;width:24px;height:2px;left:50%;top:50%;background:#000;transform:translate(-50%,-50%) rotate(-45deg)}
	.lnb ul{padding-top:60px;}
	.lnb li{border-bottom:1px solid #ddd}
	.lnb li > a{display:block;height:45px;line-height:45px;font-size:16px;padding-left:20px}
    .lnb li.on > a{color:#fff}
	.lnb li.be > a{background:url('../images/ico_plus.png') no-repeat 95% center}
	.lnb li.be.on > a{background:url('../images/ico_minus.png') no-repeat 95% center var(--main-color)}
	.lnb .sub{display:none;background:#f5f5f5}
	.lnb dl{padding:10px 0}
	.lnb dd > a{display:block;line-height:30px;font-size:14px;padding-left:30px}
    .lnb dd > a:hover{color:#0a5970}

	.body_bg.on{position:fixed;left:0;top:0;width:100%;height:100%;background:#000;opacity:0.6;z-index:80}
    
    .hsec1 .lnb_open{margin-right:4%}
    .hsec1 .lnb_open img{height:36px}
    
    
    /*main*/
    #main{padding-top:60px}
    
    
    /*footer*/
    #footer{background:#4d525e;padding:30px 0}
	 #footer a {font-size:12px;color:#fff;}
    .fsec1 {}
    .fsec1 .logoG{}
    .fsec1 .logoG img{height:18px}
    .fsec1 .contG{padding:10px 0 0;font-size:12px;color:#fff;line-height:1.6}
    .fsec1 .contG .company{}
    .fsec1 .contG .company i{margin:0 5px}
    .fsec1 .contG .copyright{font-size:12px;color:#b9c0c7;margin-top:10px}
    
.a3design{display:inline-block;background:#6b7791;padding:2px 8px;font-size:12px;margin:10px 0}

#fs2{height:40px;line-height:40px;background:#3399cc;font-size:14px;color:#fff}
#fs2 a{font-size:14px;color:#fff;display:inline-block;margin:0 5px}
#fs2 a:first-child{margin-left:10px}


		#layerPopup1{display:none;position:fixed;z-index:900;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.5);
			text-align:center}
			#layerPopup1.on{display:block}
			#layerPopup1 .popup{display:inline-block;position:relative;top:100px;}
			#layerPopup1 .popup img{max-width:100%}
			#layerPopup1 .close_area{background:#000;width:100%;text-align:right;padding:5px 0}
			#layerPopup1 .close_area span{cursor:pointer;margin:0 5px;color:#fff}
			#layerPopup1 .cookie_close{float:left}
			#layerPopup1 .basis_close{}
}