@CHARSET "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic&display=swap');

 *{
 	margin:0; padding:0;
 }
  
html,body {
 height: 93%;
 width: 100%;
 min-width: 800px;
}

#since{
	width:100%,;
	height: 20px;
	line-height: 24px;
		         
	float: right;
	text-align: right;
			
	margin-top: 10px;	
	margin-right: 10px;
	font-size: 12px;                    		

	font-style: italic;
	font-weight: normal;
	color: rgb(0,0,255);
	
	/*border: solid 1px #0000FF;*/
}

.main_seperate{
        position: relative;         				
        top:42px;	
        width: 100%;
}

#test 
{
	margin-top: 40px;	
	border-width:0px;
	overflow-y:hidden;
}

    #topMenu {
        display: inline-block;
        list-style: none;
        position: fixed;
       
        height: 80px; 							/* 메인 메뉴의 높이 */
        width: 100%;  							/* 메인 메뉴의 넓이 */
        /*border: solid 1px #0000FF;*/
    }  
  
  #topMenu ul {           					/* 메인 메뉴 안의 ul을 설정함: 상위메뉴의 ul+하위 메뉴의 ul */
        display: inline-block;
        list-style-type: none;  					/* 메인 메뉴 안의 ul 내부의 목록 표시를 없애줌 */
        margin: 0px;            					
        padding: 0px;           					
       /*border: solid 1px #0000FF;*/           /* 테두리를 설정 */
    }
    
      #topMenu ul li {            				/* 메인 메뉴 안에 ul 태그 안에 있는 li 태그의 스타일 적용(상위/하위메뉴 모두) */
        color: black;               				
        background-color: white;  			
        float: left;                					
        line-height: 30px;          				/* 텍스트 한 줄의 높이를 30px로 설정 */
        vertical-align: top;     					
        text-align: left;         					
        position: relative;         				
  }
  
    .topMenuLogo{    						
        top:0px;
        height: 73px;  							
        width: 280px;  							
        margin: 0px;            					
        padding: 0px;           					/* 메인 메뉴 안의 ul의 padding을 없음 */
        /*border: solid 1px #0000FF;*/
    }    

    .mainLogo{    						
        margin: 5px;            					
        padding: 2px;           					
        /*border: solid 1px #0000FF;*/
    }    

    .topMenuLi {            			
        position: relative;         				
        top:30px;
  }

    .menuLink, .submenuLink {   		/* 상위 메뉴와 하위 메뉴의 a 태그에 공통으로 설정할 스타일 */
        text-decoration:none;              	/* a 태그의 꾸밈 효과 제거 */
        display: block;                  		
        width: 110px;                       		/* 기본 넓이를 110px로 설정 */      
        
        padding-left: 5px;            					/* 서브메뉴 왼쪽 padding */ 
        vertical-align: middle;     					/* 세로 정렬을 가운데로 설정 */
        font-size: 15px;                    		/* 폰트 사이즈를 12px로 설정 */
font-family: 'Tahoma' ,'Nanum Gothic' , sans-serif;
    }
      
    .menuLink {     								/* 상위 메뉴의 글씨색 설정 */
        font-weight: bold;                  		/* 폰트를 굵게 설정 */
        color: black;
        /*border: solid 1px #0000FF;*/
    }
    .topMenuLi:hover .menuLink  {    	/* 상위 메뉴의 li에 마우스오버 되었을 때 스타일 설정 */
        color: red;                 					/* 글씨 색 빨간색 */
        font-weight: bold;
    } 
        
    .menuLinkW {   		/* 상위 메뉴와 하위 메뉴의 a 태그에 공통으로 설정할 스타일 */
        font-weight: bold;                  		/* 폰트를 굵게 설정 */
        color: black;
        text-decoration:none;              	/* a 태그의 꾸밈 효과 제거 */
        display: block;                     		

        width: 120px;                       		/* 기본 넓이를 130px로 설정 */
        font-size: 14px;                    		/* 폰트 사이즈를 14px로 설정 */
font-family: 'Tahoma' ,'Nanum Gothic' , sans-serif;
    }
    
    .topMenuLi:hover .menuLinkW  {    	/* 상위 메뉴의 li에 마우스오버 되었을 때 스타일 설정 */
        color: red;                 					/* 글씨 색 빨간색 */
        font-weight: bold;
    } 
        
    .topMenuLi:hover .submenu { 		
        height: 200px;          					
    }    
    
    .submenuLink {          					/* 하위 메뉴의 a 태그 스타일 설정 */
        color: #2d2d2d;             			/* 글씨 색을 RGB(2D2D2D)로 설정 */
        background-color: white;    			/* 배경색을 흰색으로 설정 */
        margin-top: 0px;           				/* 위 칸의 하단 테두리와 아래칸의 상단 테두리가 겹쳐짐 */
    }
    
    .longLink {     								/* 좀 더 긴 메뉴 스타일 설정 */
        width: 210px;   							/* 넓이는 210px로 설정 */
    }
    .submenu {              						/* 하위 메뉴 스타일 설정 */
        position: absolute;     				/* html의 flow에 영향을 미치지 않게 absolute 설정 */
        height: 0px;            					/* 초기 높이는 0px로 설정 */
        overflow: hidden;       					/* 실 내용이 높이보다 커지면 해당 내용 감춤 */
        transition: height .2s; 					/* height를 변화 시켰을 때 0.2초간 변화 되도록 설정(기본) */
        -webkit-transition: height .2s; 		/* height를 변화 시켰을 때 0.2초간 변화 되도록 설정(구버전 크롬/사파라ㅣ) */
        -moz-transition: height .2s; 		/* height를 변화 시켰을 때 0.2초간 변화 되도록 설정(구버전 파폭) */
        -o-transition: height .2s; 			/* height를 변화 시켰을 때 0.2초간 변화 되도록 설정(구버전 오페라) */
    }

    .submenuLink:hover {        			/* 하위 메뉴의 a 태그의 마우스 오버 스타일 설정 */
        color: blue;                 				/* 글씨색을 파란색으로 설정 */
        font-weight: bold;
        background-color: rgb(220,240,250);    			/* 배경색을 밝은 청회색으로 설정 */
    }
    
    
    