@charset "utf-8";

/* 레이아웃 */
#gaonwrap { min-width:1400px; width:100%; }

#top { position:absolute; left:0; top:0; min-width:1400px; width:100%; border-bottom:1px solid rgba(221,221,221,0.5);  z-index:3; }
	#toparea { position:relative; width:1400px; margin:0 auto; display: flex; flex-direction: column; }

#top.ctop { background:#fff url(/images/common/top_bg.gif) repeat-x; }
	
#container { position:relative; min-width:100%; width:100%; z-index:1; }
	
	#cont1 { position:relative; width:100%; height:100vh; padding-top:50px; overflow:hidden; }
	#cont2 { position:relative; width:100%; padding:73px 0 80px 0; }
	#cont3 { position:relative; width:100%; padding:71px 0 80px 0; background:url(/images/main/cont3_bg.jpg) no-repeat 50% 50%; }
	#cont4 { position:relative; width:100%; padding:73px 0 100px 0; }
		.containerarea { position:relative; width:1400px; margin:0 auto; }
	
#bottom { position:relative; width:100%; background:#444c57; color:#ccc; z-index:2; }
	#bottomarea { position:relative; width:1400px; padding:36px 0 70px 0; margin:0 auto; }





@media (min-width:1281px) and (max-width:1400px){
	#gaonwrap { min-width:100%; width:100%; }

	#top { position:absolute; left:0; top:0; min-width:100%; width:100%; border-bottom:1px solid rgba(221,221,221,0.5); z-index:3; }		
		#toparea { position:relative; width:100%; margin:0 auto; }
	
	#container { position:relative; min-width:100%; width:100%; z-index:1; }
		
		#cont1 { position:relative; width:100%; height:100vh; padding-top:50px; overflow:hidden; }
		#cont2 { position:relative; width:100%; padding:73px 15px 80px 15px; }
		#cont3 { position:relative; width:100%; padding:71px 15px 80px 15px; background:url(/images/main/cont3_bg.jpg) no-repeat 50% 50%; }
		#cont4 { position:relative; width:100%; padding:73px 15px 100px 15px; }
			.containerarea { position:relative; width:100%; margin:0 auto; }
			
	#bottom { position:relative; width:100%; background:#444c57; color:#ccc; z-index:2; }
		#bottomarea { position:relative; width:100%; padding:36px 15px 70px 15px; margin:0 auto; }
}


@media (min-width:1025px) and (max-width:1280px){
	#gaonwrap { min-width:100%; width:100%; }		
	
	#top { position:absolute; left:0; top:0; min-width:100%; width:100%; border-bottom:1px solid rgba(221,221,221,0.5);  z-index:3; }
		#toparea { position:relative; width:100%; margin:0 auto; }
		
	#container { position:relative; min-width:100%; width:100%; z-index:1; }
		
		#cont1 { position:relative; width:100%; height:100vh; padding-top:50px; overflow:hidden; }
		#cont2 { position:relative; width:100%; padding:73px 15px 80px 15px; }
		#cont3 { position:relative; width:100%; padding:71px 15px 80px 15px; background:url(/images/main/cont3_bg.jpg) no-repeat 50% 50%; }
		#cont4 { position:relative; width:100%; padding:73px 15px 100px 15px; }
			.containerarea { position:relative; width:100%; margin:0 auto; }
		
	#bottom { position:relative; width:100%; background:#444c57; color:#ccc; z-index:2; }
		#bottomarea { position:relative; width:100%; padding:36px 15px 70px 15px; margin:0 auto; }
}


@media (min-width:769px) and (max-width:1024px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
		
	#top { position:relative; min-width:100%; width:100%; border-bottom:1px solid rgba(221,221,221,0.5); background:#fff; z-index:3; }
		#toparea { position:relative; width:100%; margin:0 auto; }
	
	#top.ctop { background:#fff; }

	#container { position:relative; min-width:100%; width:100%; z-index:1; }
		
		#cont1 { position:relative; width:100%; height:auto; padding-top:0px; overflow:hidden; }
		#cont2 { position:relative; width:100%; padding:53px 30px 60px 30px; }
		#cont3 { position:relative; width:100%; padding:51px 30px 60px 30px; background:url(/images/main/cont3_bg.jpg) no-repeat 50% 50%; }
		#cont4 { position:relative; width:100%; padding:53px 30px 75px 30px; }
			.containerarea { position:relative; width:100%; margin:0 auto; }
		
	#bottom { position:relative; width:100%; background:#444c57; color:#ccc; z-index:2; }
		#bottomarea { position:relative; width:100%; padding:36px 30px 70px 30px; margin:0 auto; }
}


@media (max-width:768px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
		
	#top { position:relative; min-width:100%; width:100%; height:71px; border-bottom:1px solid rgba(221,221,221,0.5); background:#fff; z-index:3; }
		#toparea { position:relative; width:100%; margin:0 auto; }
		
	#top.ctop { background:#fff; }

	#container { position:relative; min-width:100%; width:100%; z-index:1; }
	
		#cont1 { position:relative; width:100%; height:auto; padding-top:0px; overflow:hidden; }
		#cont2 { position:relative; width:100%; padding:33px 15px 40px 15px; }
		#cont3 { position:relative; width:100%; padding:31px 15px 40px 15px; background:url(/images/main/cont3_bg.jpg) no-repeat 50% 50%; }
		#cont4 { position:relative; width:100%; padding:33px 15px 50px 15px; }
			.containerarea { position:relative; width:100%; margin:0 auto; }
		
	#bottom { position:relative; width:100%; background:#444c57; color:#ccc; z-index:2; font-size:90%; }
		#bottomarea { position:relative; width:100%; padding:36px 15px 70px 15px; margin:0 auto; }
}




/* 타이틀 */
#top .title { position:relative; display: inline-block; /*left:50%; transform:translateX(-50%);*/ height:70px; background:url(/images/inc/mark.png) no-repeat center left; font-size:50%; font-family: esamanru-Medium, "이사만루 미디엄"; color:#111; letter-spacing:-1px; order: 2; margin: 0 auto; }
#top .title h1 { margin-top:8px; font-family: pgovb; color:#153974; line-height: 16px; }
#top .title span { font-size:160%; display:block; }
#top .title a { color:#000 !important; text-align:left; padding-left:100px; }


@media (min-width:769px) and (max-width:1024px){
	
	.sidenav h1 { height:70px; padding-left:75px; background:url(/images/inc/mark2.png) no-repeat 15px center; background-size:auto 26px; font-size:100%; font-family: esamanru-Medium, "이사만루 미디엄"; color:#fff; letter-spacing:-1px;   }
	.sidenav h1 strong { font-size:155%; display:block; }
}

@media (max-width:768px){
	#top .title { background-size:auto 40px; font-size:37%; }
	#top .title a { padding-left:80px; }
	#top .title h1 { margin-top: 19px; line-height: 8px; }
	#top .title span { font-size: 135%; }
	
	.sidenav h1 { height:70px; padding:16px 0 0 70px; background:url(/images/inc/mark2.png) no-repeat center left 20px; background-size:auto 24px;  font-size:75%; font-family: esamanru-Medi um, "이사만루 미디엄"; color:#fff; letter-spacing:-1px; line-height: 12px; }
	.sidenav h1 span { font-size:130%; display:block; }
	
}

@media (max-width:425px){
	#top .title { background-size:auto 30px; }
	#top .title a { padding-left:60px; width: 182px; }
}





/* 상단 누리집지도 버튼 */
.sitemapBtn { position:relative; right:50px; top:90px; }


@media (min-width:1281px) and (max-width:1400px){
	.sitemapBtn { right:30px; }
}


@media (min-width:1025px) and (max-width:1280px){
	.sitemapBtn { right:15px; }
}

@media (max-width:1024px){
	.sitemapBtn { display:none; }
}




/* 메인 메뉴 */
/* 메인 메뉴 */
#menu { position:relative; right:0; bottom:0; width:100%; order: 3; }
#topMenu { position:relative; overflow:visible !important; display:flex; height: 100%; }
#menu.student::before { position:absolute; left:50%; transform: translateX(-50%); bottom:50px; content:''; width:100vw; height:1px; background:#ddd; z-index:1000; }

#menu.company { display:none; }


#topMenu > li { position:relative; text-align:center; flex-grow:1; flex: 1; }

#topMenu > li > a:link,
#topMenu > li > a:visited { vertical-align:top; height:50px; color:#222; font-size:110%; letter-spacing:-1px; font-weight: 700;  display:flex; align-items:center; justify-content:center; }
#topMenu > li > a:active,
#topMenu > li > a:focus,
#topMenu > li > a:hover,
#topMenu > li > a.select { color:#1976D2;  }

#topMenu > li.selected > a { color:#1976D2;  }

#topMenu > li.none { display:none; } 



#topMenu ul.mdepth3,
#topMenu > li.end { display:none !important; }

#top.ctop #topMenu > li > a:link,
#top.ctop #topMenu > li > a:visited { color:#333; }
#top.ctop #topMenu > li > a:active,
#top.ctop #topMenu > li > a:focus,
#top.ctop #topMenu > li > a:hover,
#top.ctop #topMenu > li > a.select { color:#f96041; }


#topMenu ul.mdepth2 {
    display: none; /* 기본은 숨김 */
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    z-index: 1000;
    min-width: 180px;
}

#topMenu li:hover > ul.mdepth2 {
    display: block;
}


@media (min-width:1280px) and (max-width:1440px){
	#topMenu > li > a:link,
	#topMenu > li > a:visited { padding:12px 10px 13px; }

	#top::before { bottom:48px; }
}

@media (min-width:1025px) and (max-width:1280px){
	#topMenu > li > a:link,
	#topMenu > li > a:visited { padding:8px 10px 9px; font-size:105%; letter-spacing: -2px; }

	#top::before { bottom:40px; }
}

@media (max-width:1024px){
	#menu,
	#top::before { display:none; } 
}




	/* 해당 url일 경우 select */
.memberMenu > ul > li > a.select span { color: #1976D2; }

	


/* 서브메뉴 표시 */
#topMenu > li > ul { position:absolute; left:0; top:75px; width:100%; height:230px; border-top:1px solid #ddd; border-right: 1px solid #eee; background:#fff; display:none; clear:both; z-index:1003; line-height:1.3; border-bottom:3px solid #ff5244; }
#topMenu > li:nth-child(1) > ul:before { position:absolute; content:''; width:100vw; left:1%; background:#fff; height:calc(100% + 3px); transform:translateX(-100%); border-right: 1px solid #eee; border-bottom:3px solid #ff5244;  }
#topMenu > li:nth-child(4) > ul:before { position:absolute; content:''; width:100vw; right:1%; background:#fff; height:calc(100% + 3px); transform:translateX(100%); border-left: 1px solid #eee; border-bottom:3px solid #ff5244;  }

#topMenu > li > ul > li { position:relative; width:100%; padding:3px 10px 4px 10px;  text-align:left; display:block; }
#topMenu li:first-child .mdepth2 { border-left: 1px solid #eee; }



#topMenu > li > ul > li > a:link,
#topMenu > li > ul > li > a:visited { width:100%; height:auto; padding:0; background:none; color:#333; border:0; line-height:1.3; text-decoration:none; font-family:pgovm; font-size:90%; margin:0; letter-spacing:-1px; text-align: center; }
#topMenu > li > ul > li > a:active,
#topMenu > li > ul > li > a:hover,
#topMenu > li > ul > li > a:focus,
#topMenu > li > ul > li > a.select { clear:both; color:var(--secondary); }

#topMenu > li > ul > li > a.st { letter-spacing:-2px; }



.submenu { display:none; overflow:hidden; }

.menubox { position:absolute; left:0; width:100%; height:215px; bottom: -215px; border-top:1px solid #ddd; border-bottom:3px solid #ff5244; background:#fff; display:none; z-index:10; }


@media (min-width:1153px) and (max-width:1280px){

}


@media (min-width:1025px) and (max-width:1152px){
	
}


@media (max-width:1024px){
	.topMenu,
	.menubox { display:none; } 	
	.menubox { width:0; height:0; border:0; line-height:0; }
}	
		






/* 하단 */
#bottom #bottomarea .ftrBtn { margin-bottom:40px; }
#bottom #bottomarea .ftrBtn a { color:#add5f7;  }

#bottom #bottomarea .bottomMenu { margin-bottom:20px; }
#bottom #bottomarea .bottomMenu ul li { float:left; padding:0; margin-right:30px; }
#bottom #bottomarea .bottomMenu ul li:last-child { margin-right:0px; }


#bottom #bottomarea .bottomMenu ul li a:link,
#bottom #bottomarea .bottomMenu ul li a:visited { color:#ccc; letter-spacing:-1px; }
#bottom #bottomarea .bottomMenu ul li a:active,
#bottom #bottomarea .bottomMenu ul li a:focus,
#bottom #bottomarea .bottomMenu ul li a:hover { color:#fff; }

#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:link,
#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:visited { color:#fcd700; }
#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:active,
#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:focus,
#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:hover { color:#ffa646; }


#bottom #bottomarea .linksite { position:absolute; right:0; top:28px; }
#bottom #bottomarea .linksite p { position:relative; width:220px; height:40px;  border:1px solid #252a30; background:#fff; }
#bottom #bottomarea .linksite p a:link,
#bottom #bottomarea .linksite p a:visited { line-height:38px; padding-left:15px; display:block; }

#bottom #bottomarea .linksite ul { position:absolute; bottom:38px; left:0; overflow:hidden; width:100%; height:210px; border:1px solid #222; padding:10px; box-sizing:border-box; box-shadow: 3px -5px 15px rgba(0,0,0,0.1);  background:#3d3d3d; display:none; z-index:100000000000; overflow:auto; border-radius: 10px 10px 0 0; }
#bottom #bottomarea .linksite ul li { float:none; width:100%; height:30px; border-left:none !important; border-right:none;  display:block;}
#bottom #bottomarea .linksite ul li a:link,
#bottom #bottomarea .linksite ul li a:visited { width:100%; height:30px; line-height:30px; padding-left:20px; background:none; background:#3d3d3d; box-sizing:border-box; color:#fff; font-size:80%; display:inline-block; border-bottom:1px dashed #777;}
#bottom #bottomarea .linksite ul li a:active,
#bottom #bottomarea .linksite ul li a:focus,
#bottom #bottomarea .linksite ul li a:hover { color:#ffd40c; border-bottom:1px dashed #ffd40c; transition:0.3s; }

#bottom #bottomarea .linksite p a.toggleS::after { content:''; position:absolute; top:0px; right:0px; width:38px; height:38px; background:url(/images/inc/bottomLink_blt.gif) no-repeat right top; transition:0.3s; }
#bottom #bottomarea .linksite p a.toggleS.on::after { transform:rotate(-180deg);  }


#bottom #bottomarea .linksite ul li.tit { height:31px; padding-left:10px; border-bottom:1px solid #111; background:#666; color:#fff; }
#bottom #bottomarea .linksite ul li.tit a:link,
#bottom #bottomarea .linksite ul li.tit a:visited { padding-left:0px; background:#666; color:#fff; font-size:100%; }
#bottom #bottomarea .linksite ul li.tit a:active,
#bottom #bottomarea .linksite ul li.tit a:focus,
#bottom #bottomarea .linksite ul li.tit a:hover { color:#ffd40c; }



#bottom #bottomarea address { margin:0 0 10px 0; }
#bottom #bottomarea address span { margin-right:20px; }

#bottom #bottomarea .copyright { font-size:95%; } 
#bottom #bottomarea .copyright span { position:relative; top:1px; font-family:Arial, Helvetica, sans-serif; font-size:120%;}

#bottom .topbtn { position:absolute; right:0px; bottom:0px; }



@media (max-width:1280px){
	#bottom #bottomarea .linksite { right:15px; }
}


@media (max-width:768px){
	#bottom #bottomarea .bottomMenu ul li { margin-right:15px; }
	#bottom #bottomarea .linksite { position:relative; top:0; margin:0 0 20px 15px; }
	#bottom #bottomarea .linksite p { width:100%; }
	#bottom #bottomarea address span { display:block; margin:0 0 5px 0; }

	

}



/*의원자료방/
/*의원자료방/
/*의원자료방/

/*의원자료방 로그인*/
.membersLogin { width:100%; height:100%; box-sizing:border-box; }
.membersLogin .loginBox { width:800px; height:600px; background:#fff; box-shadow:5px 5px 15px rgba(0,0,0,0.05); border-radius:10px; position: relative; left: 50%; top: 50%; transform: translate(-50%, -50%);}

.membersLogin .loginBox .lobinImgarea{ float:left; width:50%; height:100%; }
.membersLogin .loginBox .loginBoxarea{ float:left; width:50%; height:100%; padding:0 50px; text-align:center; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; }

.membersLogin .loginBox .lobinImgarea img { width:100%; height:100%; border-radius:10px 0 0 10px; }
.membersLogin .loginBox .loginBoxarea h1 { width:100%; color:#111; font-family:NotoSans-Medium, "본고딕 미디엄"; font-weight:bold !important; margin-bottom:30px; word-break: keep-all; }

.membersLogin .text_idpw { width:100%; height:45px; line-height:44px; padding-left:15px; border:none; border-bottom: solid 1px #ccc; box-sizing:border-box; background:#fff !important; font-size:110%; font-weight:bold; margin-bottom:15px; }
.membersLogin .submit_btn {  width:100%; height:45px; border:none; border-radius:3px; background:#00274d; color:white; font-size:110%;  font-weight:bold; cursor:pointer;  margin-top:50px; }
.membersLogin .join a { display:flex; align-items:center; justify-content: center; margin-top:10px; width:100%; height:45px; border:1px solid #ddd; border-radius:3px;  }

.membersLogin .tel-item { display:flex; }
/*
.membersLogin input::placeholder{color:transparent;}
.membersLogin input:placeholder-shown + label{ color:#aaa; font-size:14pt; top:15px; }
.membersLogin input:focus + label, label{ color:#8aa1a1; font-size:10pt; pointer-events: none; position: absolute; left:0px; top:0px; transition: all 0.2s ease ; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; }

.membersLogin input:focus, input:not(:placeholder-shown){ border-bottom: solid 1px #8aa1a1; outline:none; }
.membersLogin input[type=submit]{ background-color: #8aa1a1; border:none; color:white; border-radius: 3px; width:100%; height:45px; font-size: 14pt; margin-top:70px; cursor:pointer;}

.membersLogin #forgot{ text-align: right; font-size:12pt; color:rgb(164, 164, 164); margin:10px 0px;}
*/


@media (min-width:865px) and (max-width:1024px){
	.membersLogin .loginBox { width:calc(100% - 160px);  }
}
@media (min-width:735px) and (max-width:864px){
	
	.membersLogin .loginBox { width:calc(100% - 100px); }

	.membersLogin .loginBox .loginBoxarea h1 { font-size:180%;}

	.membersLogin .text_idpw { height:40px; line-height:39px; }
	.membersLogin .submit_btn { height:45px; font-size:100%; margin-top:50px; }

}

@media (min-width:425px) and (max-width:734px){
	.membersLogin .loginBox { width:calc(100% - 100px); }
	.membersLogin .loginBox .lobinImgarea{ display:none;}
	.membersLogin .loginBox .loginBoxarea{ width:100%; padding:0 20px; }

}
@media (max-width:424px){
	.membersLogin { padding-top:150px;}
	.membersLogin .loginBox { width:calc(100% - 30px); }
	.membersLogin .loginBox .lobinImgarea{ display:none;}
	.membersLogin .loginBox .loginBoxarea{ width:100%; padding:0 20px; }
	.membersLogin .loginBox .loginBoxarea h1 { font-size:150%; }

	.membersLogin .text_idpw { width:100%; height:35px; line-height:34px;}
	.membersLogin .submit_btn {  width:100%; height:40px;}
}




/* 로그인 시 보이는 메인 */
#sright.mainBox { width:100%;  }
.mainBox .main ul { display:flex; justify-content:space-between; align-items:center; gap:70px; }
.mainBox .main ul li { width:33%; background:#fff; border:1px solid #ddd; border-radius:20px; transition:0.2s; }
.mainBox .main ul li a.jelly { width:100%; height:100%; padding:20px; display:flex; align-items:center; justify-content:center; flex-direction: column; cursor: pointer; gap: 14px; font-size:120%; font-weight:700; }
.mainBox .main ul li a.jelly img { width:175px; height:auto; }


.mainBox .main ul li:hover{background:var(--primary-40); box-shadow:3px 3px 8px rgba(0,0,0,0.3); }
.mainBox .main ul li a.jelly:hover { color:#fff; animation: jelly 0.5s; }


@keyframes jelly {
  25% {transform: scale(0.9, 1.1);}

  50% {transform: scale(1.1, 0.9);}

  75% {transform: scale(0.95, 1.05);}
}




@media (max-width:1024px){
	.mainBox .main ul { gap:40px; }
	.mainBox .main ul li a.jelly img { width:80%; }
}

@media (max-width:768px){
	.mainBox .main ul { gap:16px; }
}

@media (max-width:425px){
	.mainBox .main ul { flex-wrap:wrap; }
	.mainBox .main ul li { width:100%; }
	
	.mainBox .main ul li a.jelly img { width:60%; }
}