body, nav, ul, li, a  {margin: 0; padding: 0; font-family:"Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important;}
 p,a, h1,h2,h3, h4,h5, h6, span { transform: skew(-0.1deg);  font-family:"Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important;}
a {text-decoration: none;}

nav#topmenu.Lsize { position: absolute;min-width:280px;z-index:300;top: 70px;}
nav#topmenu {position:absolute;top:0;min-width:280px;
z-index:1040;
	}
nav#topmenu{
	width:100%;height:40px; 
}

nav#topmenu.Lsize{
background:transparent;
}
nav#topmenu.Lsize.hover {
	width:100%;height:250px; 
}
nav#topmenu .gnbWrap .gnb{background:#203864;}
#topmenu .gnbWrap .gnb>li a.parent{color:#fff;}
#headerWrap.main.Lsize+#topmenu.Lsize .gnbWrap .gnb a{}



#topmenu .gnbHeader span.name{
		margin:10px;
		float:left;
		background:url('../images/gnb/user_img.png') no-repeat;
		padding-left:40px;
		color:#fff;
		line-height:30px;
		width:80%;
		height:30px;
		 white-space: nowrap; /* �스트가 한 줄로 표시��� 설정 */
	    overflow: hidden; /* 넘치는 부분� 숨김 */
	    text-overflow: ellipsis; /* 넘치는 �스트를 ...으로 표시 */
	    display: inline-block;	
	}	
	.gnbHeader .btn_close {
		position: absolute;
		top: 9px;
		right: 5px;
		width: 33px;
		height: 33px;
		background:url('../images/gnb/btn_close.png') no-repeat;
		display:block;
		
		}
	#topmenu .gnbBanner {
		display:block;
		height:60px;
		background-color:#ffffff;
		border-top:3px solid #0276bc;
		padding:10px 12px; 
	}
	.gnbBanner > a{
		position: relative;
		float: left;
		width: 30%;
		text-align: center;
		font-size: 11px;
		font-weight: bold;
	}
	.gnbBanner > a:last-child{
		width: 35%;
	}
	.gnbBanner  a span{
		display: inline-block;
		width: 37px;
		height: 20px;
		margin-top: 9px;
		margin-bottom: 2px;
		vertical-align: top;
	}
	.gnbBanner  a.banner01{
		background:url('../images/gnb/quickBanner.png') no-repeat 0 0;
	}
	.gnbBanner  a.banner02{
		background:url('../images/gnb/quickBanner.png') no-repeat -80px 0;
	}
	.gnbBanner  a.banner03{
		background:url('../images/gnb/quickBanner.png') no-repeat -160px 0;
	}
	
/*gnb*************************************************************************************************/	

.gnbWrap{
	height:40px;
}

.container {
    width: 90%;
    margin: 10px auto;
}
.toggleMenu {
    display:  none;
    background: #666;
    padding: 10px 15px;
    color: #fff;
}
.gnb {
    list-style: none;
     *zoom: 1;
}
.gnb:before,
.gnb:after {
    content: " "; 
    display: table; 
}
.gnb:after {
    clear: both;
}
.gnb ul {
    list-style: none;
}
#topmenu .gnbWrap .gnb a {

    color:#444;
}
#topmenu.Lsize .gnbWrap .gnb li li{

}
#topmenu.Lsize .gnbWrap .gnb ul li:first-child{
	margin-top:0;
}
#topmenu.Lsize .gnbWrap .gnb ul li a{

}
#topmenu.Lsize .gnbWrap .gnb li.hover {

}


.gnb li {
    position: relative;
}
.gnb > li {
    float: left;
    width:25%;

}
.gnb > li:last-child{

}
.gnb > li > .parent {
    /*background:#0b3e72;*/
    background-repeat: no-repeat;
    background-position: right;
}
.gnb > li > a {
    display: block;
}
.gnb li  ul {
    position: absolute;
    width:100%;
    left: -9999px;

}
.gnb li.h200 a.parent+ul {
	height:204px;
	background:#f7f7f7;
	
}
.gnb li.h200 li{
	height:40px;
}
.gnb li.h200  ul {
    position: absolute;
    width:100%;
    left: 0;
    
}
#topmenu >.gnb >li.hover {
    height:200px;
    background:#fff;   
}

.gnb  li.hover >li{
    height:40px;
}
.gnb > li.hover > ul {
    left: 0;
    height:204px;
    background:#fff;  
    
}
li.idx.hover a{

}

#topmenu.Lsize.hover .gnbWrap .gnb li{
	height:202px;
}
#topmenu.Lsize.hover .gnbWrap .gnb li ul li{
	height:40px;

}


.gnb > li.hover.h200 {
    background:#fff; 
     height:200px;    
}

.gnb li>a{
    	
}
	
.gnb li li a {
    display: block;
    position: relative;
    z-index:100;
	box-sizing:border-box;
	text-align:center;

}

.gnb li li:hover{
	background:#eff1f4;
}

 .gnb li ul li:last-child a {
    border-bottom: none;
}
.gnb li li li a {
    background:#249578;
    z-index:200;
    border-top: 1px solid #1d7a62;
}

#topmenu.Ssize .gnbWrap ul.gnb{
	display:block;
	background:#fff;
}


#topmenu.Ssize{
	box-shadow:1px 1px 5px #00000030;
}
#topmenu.Ssize ul li{
	width:100%;
}
/*

.Lsize .gnbWrap  li.hover .idx01+ul{background:#fff url('../images/gnb/gnb_img01.gif') right bottom no-repeat;}
.Lsize .gnbWrap  li.hover .idx02+ul{background:#fff url('../images/gnb/gnb_img02.gif') right bottom no-repeat;}
.Lsize .gnbWrap  li.hover .idx03+ul{background:#fff url('../images/gnb/gnb_img03.gif') right bottom no-repeat;}
.Lsize .gnbWrap  li.hover .idx04+ul{background:#fff url('../images/gnb/gnb_img04.gif') right bottom no-repeat;}
*/

@media screen and (max-width: 768px) {
    .active {
        display: block;
    }
    #main{
    	display:block;
    }
   nav#topmenu{
   	position:absolute;
   	top:0;
   	margin-top:0;
	width:280px;
	height:100%;	
	}
	nav#topmenu.hover {
		width:280px;
		height:100%;
	}
   #topmenu  .gnbWrap{
    	height:100%;
    	overflow-y: auto; 
    }
    

    .gnbWrap{
    	height:100%;
    }
    .gnb > li {
        float: none;
    }
	#topmenu .gnbWrap .gnb a {

    	color:#fff;
	}
	#topmenu .gnbWrap .gnb ul a {

    	
	}
    .gnb > li > .parent {
        background-position: 95% 50%;
    }
    .gnb li li .parent {
        
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }
	ul.gnb li.idx a.idx02+ul>li{

    }
    .gnb ul {
        display: block;
        width: 100%;
    }
   .gnb > li.lnbHover > ul , .gnb li li.hover ul {
        position: static;
    }
    

	.gnb li li a{

    }
	/*.gnb li a.idx01.parent {background: #767879 url('../images/gnb/lnbMenu.png') 0 0 no-repeat;} 
	.gnb li a.idx02.parent {background: #767879 url('../images/gnb/lnbMenu.png') 0 -36px no-repeat;} 
	.gnb li a.idx03.parent {background: #767879 url('../images/gnb/lnbMenu.png') 0 -72px no-repeat;}
	.gnb li a.idx04.parent {background:  #767879 url('../images/gnb/lnbMenu.png') 0 -108px no-repeat;} 
	
	.gnb li.lnbHover  a.idx01.parent{background: #dc286f url('../images/gnb/lnbMenu.png') 0 0 no-repeat;} 
	.gnb li.lnbHover  a.idx02.parent{background: #dc286f url('../images/gnb/lnbMenu.png') 0 -36px no-repeat;} 
	.gnb li.lnbHover  a.idx03.parent {background: #dc286f url('../images/gnb/lnbMenu.png') 0 -72px no-repeat;}
	.gnb li.lnbHover  a.idx04.parent {background: #dc286f url('../images/gnb/lnbMenu.png') 0 -108px no-repeat;}
}
	width:100%;
	height:40px;*/
}
nav#topmenu.Lsize.hover {
	width:100%;

}

#headerWrap.main.Lsize+#topmenu.Lsize .gnbWrap .gnb a{padding:8px 16px;}
#topmenu.Lsize .gnbWrap .gnb il.idx > ul li a{font-size:12px;}
************************************************************************************************/
#topmenu .gnbHeader{
	height:48px;background-color:#0b3e72;
}

#topmenu .gnbHeader span.name{
		margin:10px;
		float:left;
		background:url('../images/gnb/user_img.png') no-repeat;
		padding-left:40px;
		color:#fff;
		line-height:30px;
	}	
	.gnbHeader .btn_close {
		position: absolute;
		top: 9px;
		right: 5px;
		width: 33px;
		height: 33px;
		background:url('../images/gnb/btn_close.png') no-repeat;
		display:block;
		text-indent:-10000px;
		
		}
	#topmenu .gnbBanner {
		display:none;
		height:56px;
		background-color:#f7f7f7;
		border-top:3px solid #0276bc;
		padding:10px 12px; 
	}
	
	#topmenu.Ssize .gnbHeader{
		width:100%;
		height:48px;
		background-color:#0b3e72;
		display:none;
	} 
	.gnbBanner > a{
		position: relative;
		float: left;
		width: 30%;
		text-align: center;
		font-size: 11px;
		font-weight: bold;
	}
	.gnbBanner > a:last-child{
		width: 35%;
	}
	.gnbBanner  a span{
		display: inline-block;
		width: 37px;
		height: 20px;
		margin-top: 9px;
		margin-bottom: 2px;
		vertical-align: top;
	}
	.gnbBanner  a.banner01{
		background:url('../images/gnb/quickBanner.png') no-repeat 0 0;
	}
	.gnbBanner  a.banner02{
		background:url('../images/gnb/quickBanner.png') no-repeat -80px 0;
	}
	.gnbBanner  a.banner03{
		background:url('../images/gnb/quickBanner.png') no-repeat -160px 0;
	}

/*gnb*************************************************************************************************/	

nav#topmenu.Lsize .gnbWrap{
	background:#203864;


}

.container {
    width: 90%;
    margin: 10px auto;
}
.toggleMenu {
    display:  none;
    background: #666;
    padding: 10px 15px;
    color: #fff;
}
.gnb {
    list-style: none;
     *zoom: 1;
}
.gnb:before,
.gnb:after {
    content: " "; 
    display: table; 
}
.gnb:after {
    clear: both;
}
.gnb ul {
    list-style: none;
}

#topmenu.Lsize .gnbWrap .gnb li.hover a.parent {
    color:#fff;
}
#topmenu.Lsize .gnbWrap .gnb li li{

}
#topmenu.Lsize .gnbWrap .gnb ul li:first-child{

}
#topmenu.Lsize .gnbWrap .gnb ul li a{

}
#topmenu.Lsize .gnbWrap .gnb li.hover{

}
#topmenu.Lsize .gnbWrap .gnb li.hover a.parent {
	background-color:#397bdb;
	color:#fff;
}
#topmenu.Lsize .gnbWrap .gnb li ul li a{
	font-size:15px;
	font-weight:500;
	
}
#topmenu.Lsize .gnbWrap .gnb li ul li a:hover{
	color:#397bdb;
	font-weight: 600;
}

.gnb li {
    position: relative;
}
.gnb > li {
    float: left;
    width:25%;


}
.gnb > li:first-child{

}
.gnb > li > .parent {
    /*background:#0b3e72;*/
    background-repeat: no-repeat;
    background-position: right;
    font-size:16px;
    color:#333;
    text-align:center;
}
.gnb > li > a {
    display: block;
    font-size:14px;
}
.gnb li  ul {
    position: absolute;
    width:100%;
    left: -9999px;
    z-index:200;
   /* background:#efefef;*/
}
.gnb li.h200 a.parent+ul {
	height:fit-content;
	background:#fff;
	display:none;

	
}

.gnb li:hover a.parent+ul{
	display:block;
}
.gnb li.hover a.parent+ul {
	box-sizing:border-box;
	border-bottom:2px solid #119efe;
	
}
.gnb li.h200 li{
	height:36px;
}
.gnb li.h200  ul {
    position: absolute;
    width:100%;
    left: 0;
    z-index:300;
}
#topmenu >.gnb >li.hover {
    height:fit-content;
    background:#fff;   
}

.gnb  li.hover >li{
    height:36px;
}
.gnb > li.hover > ul {
    left: 0;
    height:fit-content;
    background:#fff;  
    
}
li.idx.hover a{

}

#topmenu.Lsize.hover .gnbWrap .gnb li{
     height:fit-content;
}
#topmenu.Lsize.hover .gnbWrap .gnb li ul li a{
	height:36px
}
.gnb > li.hover.h200 {
    background:#fff; 
     height:fit-content;

}
.gnb li>a{
}
	
.gnb li li a {
    display: block;
    position: relative;
    z-index:100;

}
.gnb li li li a {
    background:#249578;
    z-index:200;
    border-top: 1px solid #1d7a62;
}
.gnb li li li a:hover{color:blue;}
#topmenu.Ssize .gnbWrap ul.gnb{
	display:block;
}
#topmenu.Ssize ul li{
	width:100%;
}
#topmenu.Ssize .gnbWrap ul.gnb li.lnbHover ul{
	background-color:#efefef;
}

@media screen and (max-width: 768px) {
    .active {
        display: block;
    }
    #main{
    	display:block;
    }
   nav#topmenu.Ssize{
   	position:fixed;
   	top:0;
   	margin-top:0;
	width:280px;
	height:100%;	
	background-color:#fff;
	z-index: 1040;
	}
	nav#topmenu.Ssize.hover {
		width:280px;
		height:100%;
	}
   nav#topmenu.Ssize .gnbWrap{
    	height:100%;
    	overflow-y: auto; 
    }

    nav#topmenu.Ssize .gnbWrap{
    	position:relative;height:100%;width:100%;
    }
    .gnb > li {
        float: none;
    }
    nav#topmenu.Ssize  .gnb >li.lnbHover ul{
	    background:#eff1f4d4 !important;; 
	}
	nav#topmenu.Ssize  .gnbWrap .gnb a {
    	padding: 8px 10px;
    	color:#444;
    	text-align:left;
    	border-bottom: 1px solid #e3e3e3;
    	font-weight:700;
    	
	}
	
	    nav#topmenu.Ssize  .gnb >li.lnbHover ul a{
	    font-weight:500;
	    padding-left:20px;
	    font-size:14px;
	    }
	    
	    nav#topmenu.Ssize  .gnb >li.lnbHover ul li:hover{
	    background:#e7eaefd4;
	    }
	
		nav#topmenu.Ssize  .gnbWrap .gnb>a{
		
		} 
	#topmenu .gnbWrap .gnb ul li a {
	border-bottom:none !important;
	}
	nav#topmenu.Ssize .gnbWrap .gnb li ul{
	font-size:13px;
	}
    .gnb > li > .parent {
        background-position: 95% 50%;
    }
    .gnb li li .parent {
        
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }

    .gnb ul {
        display: block;
        width: 100%;
    }
   .gnb > li.lnbHover > ul , .gnb li li.hover ul {
        position: static;
    }
    

	.gnb li li a{

    }
    
    nav#topmenu.Ssize .gnbWrap .gnb li.lnbHover  a.parent{color:#164D94;}
	/*.gnb li a.idx01.parent {background: #767879 url('../images/gnb/lnbMenu.png') 0 0 no-repeat;} 
	.gnb li a.idx02.parent {background: #767879 url('../images/gnb/lnbMenu.png') 0 -36px no-repeat;} 
	.gnb li a.idx03.parent {background: #767879 url('../images/gnb/lnbMenu.png') 0 -72px no-repeat;}
	.gnb li a.idx04.parent {background:  #767879 url('../images/gnb/lnbMenu.png') 0 -108px no-repeat;} 
	
	.gnb li.lnbHover  a.idx01.parent{background: #dc286f url('../images/gnb/lnbMenu.png') 0 0 no-repeat;} 
	.gnb li.lnbHover  a.idx02.parent{background: #dc286f url('../images/gnb/lnbMenu.png') 0 -36px no-repeat;} 
	.gnb li.lnbHover  a.idx03.parent {background: #dc286f url('../images/gnb/lnbMenu.png') 0 -72px no-repeat;}
	.gnb li.lnbHover  a.idx04.parent {background: #dc286f url('../images/gnb/lnbMenu.png') 0 -108px no-repeat;}*/
}