@charset "utf-8";


/* 건너뛰기 */   
.skipNav { position:absolute; left:0; right:0; top:-2px; width:100%; text-align:center; z-index:10000;}
.skipNav a { display:block; color:#fff; height:1px; overflow:hidden;}
.skipNav a:focus,
.skipNav a:active { height:30px; line-height:30px; background:#da131a; color:#fff !important; font-size:110%; }
.rotate>* {-ms-transform:rotate(180deg); -webkit-transform:rotate(180deg); transform:rotate(180deg);}




/* 상단배너 */
#top-ban { width:100%; background:linear-gradient(90deg, #364a7d, #e3e0f5);  }
#top-ban .nuri { height:3.2rem; line-height:3.2rem; padding-left:3.1rem; background:url(/images/common/icon_taegeukgi.gif) no-repeat 0 50%; color:#D4F1FF; font-size:1.5rem; font-weight:400; }

#top-ban .inner { display:flex; justify-content:space-between; align-items:center; height:3.2rem; }


@media (max-width:1024px){
	#top-ban .underLinkUl { display:none; }
}

@media (max-width:768px){
	#top-ban { width:100%; background:#364a7d; }
	#top-ban .nuri { font-size:1.4rem; }
	
}






/* 모바일용 상단 버튼 */
.mobileTopBtn { display:none; width:0; height:0; overflow:hidden;  }

@media (min-width:769px) and (max-width:1024px){
	.mobileTopBtn { display:block; }
	.mobileTopBtn li.mobileTopBtn1 { position:absolute; right:3rem; top:1.2rem; display:block; }

	.mobileTopBtn li.mobileTopBtn1 a { text-align:center; font-size:1.5rem; display:flex; flex-direction:column; justify-content:center; align-items:center; }
	.mobileTopBtn li.mobileTopBtn1 a img { width:34px; display:block; margin-bottom:5px; }
}


@media (max-width:768px){
	.mobileTopBtn { display:block; }
	.mobileTopBtn li.mobileTopBtn1 { position:absolute; right:1.6rem; top:1.2rem; display:block; }

	.mobileTopBtn li.mobileTopBtn1 a { text-align:center; font-size:1.4rem; display:flex; flex-direction:column; justify-content:center; align-items:center; }
	.mobileTopBtn li.mobileTopBtn1 a img { width:22px; display:block; margin-bottom:5px; }
}




/* 외부 링크 */
.underLink { position:relative; display:flex; justify-content:space-between; }


.underLinkUl { display:flex; justify-content:flex-end; }
.underLinkUl > li { position:relative; padding:0 1.6rem; }
.underLinkUl > li::after { content:''; position:absolute; top:calc(50% - 0.2rem); right:calc(0% - 0.2rem); width:0.4rem; height:0.4rem; border-radius:50%; background:#8d91ab; display:inline-block; }
.underLinkUl > li:last-child::after { display:none; }

.underLinkUl > li > a:link,
.underLinkUl > li > a:visited { height:20px; line-height:20px; color:#555; font-size:1.5rem; text-align:center; display:block; }
.underLinkUl > li > a:active,
.underLinkUl > li > a:focus,
.underLinkUl > li > a:hover { color:#132D66; }
.underLinkUl > li > a.select { color:#132D66; font-weight:700; }

.underLinkUl > li > div { position:absolute; left:50%; top:20px; transform:translate(-50%,0); display:none; z-index:9999 !important; padding-top: 5px; }
.underLinkUl > li > div ul { position:relative; display:flex; flex-wrap:wrap;  justify-content:flex-start; padding:1.6rem; border:1px solid #ddd; border-radius:2.0rem; background:#fafafa;margin-top: 5px; /* 약간의 여백이 필요하다면 */
    box-shadow: 0 4px 10px rgba(0,0,0,0.1); /* 그림자를 주면 경계가 명확해짐 */ }
.underLinkUl > li > div ul:before { content:''; position:absolute; left:50%; bottom:100%; width:1.6rem; height:1.6rem; background:#fff; border:1px solid #E6E8EA; border-top-color:transparent; border-left-color:transparent; transform:translateX(-50%) rotate(-135deg); margin-bottom:-.8rem; }


.underLinkUl > li > div ul li a:link,
.underLinkUl > li > div ul li a:visited { position:relative; color:#555; font-size:1.6rem;  }
.underLinkUl > li > div ul li a:active,
.underLinkUl > li > div ul li a:focus,
.underLinkUl > li > div ul li a:hover { color:#113d8e; }

.underLinkUl > li > div ul li a:link::before,
.underLinkUl > li > div ul li a:visited::before { content:''; position:absolute; left:50%; bottom:0; width:0; height:2px; background-color:#fff; text-align:center; transform:translate(-50%,0); transition:0.3s; }
.underLinkUl > li > div ul li a:active::before,
.underLinkUl > li > div ul li a:focus::before,
.underLinkUl > li > div ul li a:hover::before { width:110%; background-color:#06c; }




.memberList { width:24rem;   }
.memberList ul li { width:33.333%; text-align:center;  }



.committeeList { width:24rem; }
.committeeList ul li { width:100%; text-align:center;  }






.mUnderLink .memberList { width:100%;   }
.mUnderLink .memberList ul { display:flex; justify-content:flex-start; flex-wrap:wrap; padding:0.8rem 0; background:#131b2a;   }
.mUnderLink .memberList ul li { width:33.333%; text-align:center;  }
.mUnderLink .memberList ul li a:link,
.mUnderLink .memberList ul li a:visited { padding:0.8rem 0; color:#ccc; font-size:1.6rem; display:inline-block; }
.mUnderLink .memberList ul li a:active,
.mUnderLink .memberList ul li a:focus,
.mUnderLink .memberList ul li a:hover { color:#fff; }


.mUnderLink .committeeList { width:100%; }
.mUnderLink .committeeList ul { display:flex; justify-content:flex-start; flex-wrap:wrap;  width:100%; padding:0.8rem 0; background:#131b2a;  }
.mUnderLink .committeeList ul li { width:100%; text-align:center;  }
.mUnderLink .committeeList ul li a:link,
.mUnderLink .committeeList ul li a:visited { padding:0.8rem 0; color:#ccc; font-size:1.6rem; display:inline-block; }
.mUnderLink .committeeList ul li a:active,
.mUnderLink .committeeList ul li a:focus,
.mUnderLink .committeeList ul li a:hover { color:#fff; }


/* 폰트크기 */
.fontSetting { position:relative; }
.fontSetting .abtn_fontSize:link,
.fontSetting .abtn_fontSize:visited { position:relative; top:-3px; padding-left:15px; color:#555; padding-right:20px; background:url(/images/common/blt_arrowDown.png) no-repeat right 50%; font-size:1.6rem; }
.fontSetting .abtn_fontSize:active,
.fontSetting .abtn_fontSize:focus,
.fontSetting .abtn_fontSize:hover { color:#113d8e; }

.fontSetting .fontSizeCont { position:absolute; left:50%; top:35px; width:100px; padding:16px; border-radius:12px; border:1px solid #ddd; background:#fff; transform:translate(-50%, 0); box-shadow:0 3px 5px rgba(0,0,0,0.1); display:none; z-index:100;  }
.fontSetting .fontSizeCont:before { content: ''; position: absolute; left: 50%; bottom: 100%; width: 1.6rem; height: 1.6rem; background:#fff; border:1px solid #E6E8EA; border-top-color: transparent; border-left-color: transparent; transform: translateX(-50%) rotate(-135deg); margin-bottom:-.8rem;}


.fontSetting .fontSizeCont li a:link,
.fontSetting .fontSizeCont li a:visited { width:100%; padding:4px; font-size:90%; text-align:center; margin:2px 0; }
.fontSetting .fontSizeCont li a:active,
.fontSetting .fontSizeCont li a:focus,
.fontSetting .fontSizeCont li a:hover { border-radius:4px; background:#EEF2F7; color:#233479; }


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







/* utilList */
.utilList { position:relative; display:flex; justify-content:flex-end; align-items:center; z-index:100;}
.utilList li { position:relative; display:flex; align-items:center; margin-right:3.0rem; }
.utilList li:last-child { margin-right:0; }
.utilList li.sns { margin-right:1.2rem; }
.utilList li:nth-child(2).sns { margin-right:3.0rem; } 

.utilList li a:link,
.utilList li a:visited { color:#333; font-weight:700; display:flex; align-items:center; }
.utilList li a:active,
.utilList li a:focus,
.utilList li a:hover { color:#225588; }

.utilList li.sns a:link,
.utilList li.sns a:visited { width:4rem; height:4rem; border: 1px solid #E1E1E1; border-radius:50%; text-align:center; display:flex; justify-content:center; align-items:center; }
.utilList li.sns a:active,
.utilList li.sns a:focus,
.utilList li.sns a:hover { background:#E1E1E1; }


/* 폰트셋팅, 유틸과 사이트바에 사용*/
li.fontSize { position:relative; }
li.fontSize ul { position:absolute; left:50%; top:5rem; width:10rem; padding:1.6rem; border-radius:1.2rem; border:1px solid #ddd; background:#fafafa; transform:translateX(-50%); text-align:center; box-shadow:0 0.4rem 1rem rgba(0,0,0,0.1); z-index:100;  display:none;   }
li.fontSize ul:before { content:''; position:absolute; left:50%; bottom:100%; width:1.6rem; height:1.6rem; background:#fff; border:1px solid #E6E8EA; border-top-color:transparent; border-left-color:transparent; transform:translateX(-50%) rotate(-135deg); margin-bottom:-.8rem; }

li.fontSize ul li { width:100%; display:block;}
li.fontSize ul li a:link,	
li.fontSize ul li a:visited { width:100%; line-height:1.8; padding:0; font-size:1.6rem; font-weight:500; text-align:center; display:block; }
li.fontSize ul li a:active,
li.fontSize ul li a:focus,
li.fontSize ul li a:hover { color:#c43858; }
	

@media (min-width:1025px) and (max-width:1280px){
	.utilList li { margin-right:2.0rem; }
}

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


















#bottom > .inner { padding:4rem 0 4rem; font-size:1.6rem; }

#bottom .f-logo { height:5.2rem; line-height:4.8rem; padding:0px 0 0 6.6rem; background:url(/images/common/mark.png) no-repeat; background-size:auto 5.2rem; display:inline-block; word-break:keep-all; margin-bottom:2.4rem; }
#bottom .f-logo strong { position:relative; top:-2px; color:#777; font-size:3.2rem; font-weight:700; }


#bottom .f-cnt { color:#666; display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:3.2rem;}

#bottom .f-cnt .f-info { display:flex; flex-direction:column; line-height:2.0; }
#bottom .f-cnt .f-info dl dt { float:left; width:70px; font-weight:700; }
#bottom .f-cnt .f-info dl dd { margin-left:70px; width:calc(100% - 70px); }

#bottom .f-cnt .f-link .link-go { display:flex; justify-content:flex-start; flex-direction:column; margin-bottom:3.2rem; }

#bottom .f-cnt .f-link .link-go a:link,
#bottom .f-cnt .f-link .link-go a:visited { line-height:3.2rem; color:#666; display:flex; justify-content:flex-start; align-items:center; gap:1rem; }
#bottom .f-cnt .f-link .link-go a:active, 
#bottom .f-cnt .f-link .link-go a:focus,
#bottom .f-cnt .f-link .link-go a:hover { color:#c43858; }


#bottom .f-cnt .f-link .link-sns { display:flex; justify-content:flex-start; gap:0.8rem;  }
#bottom .f-cnt .f-link .link-sns a:link,
#bottom .f-cnt .f-link .link-sns a:visited { width:4rem; height:4rem; border:1px solid #ddd; border-radius:50%; background:#F4F5F6; display:flex; justify-content:center; align-items:center; }
#bottom .f-cnt .f-link .link-sns a:active, 
#bottom .f-cnt .f-link .link-sns a:focus,
#bottom .f-cnt .f-link .link-sns a:hover { border:1px solid #284394; background:#284394; color:#fff; }


#bottom .f-btm { padding-top:3.2rem; border-top:.1rem solid #cdd0d5; color:#666;   }
#bottom .f-btm .f-btm-text { display:flex; justify-content:space-between;}
#bottom .f-btm .f-btm-text .f-menu { display:flex; justify-content:flex-start; gap:2rem; }

#bottom .f-btm .f-btm-text .f-menu a:link,
#bottom .f-btm .f-btm-text .f-menu a:visited { color:#666; }
#bottom .f-btm .f-btm-text .f-menu a:active,
#bottom .f-btm .f-btm-text .f-menu a:focus,
#bottom .f-btm .f-btm-text .f-menu a:hover { color:#c43858; }

#bottom .f-btm .f-btm-text .f-menu a:nth-child(1):link,
#bottom .f-btm .f-btm-text .f-menu a:nth-child(1):visited { color:#104574; }
#bottom .f-btm .f-btm-text .f-menu a:nth-child(1):active,
#bottom .f-btm .f-btm-text .f-menu a:nth-child(1):focus,
#bottom .f-btm .f-btm-text .f-menu a:nth-child(1):hover { color:#c43858; }

#bottom .f-btm .f-copy { font-size:1.5rem;  }



@media (max-width: 1400px) {
	#bottom > .inner { padding:4rem 2.8rem 4rem; font-size:1.6rem; }
}


@media (max-width: 1024px) {
	
}

@media (max-width: 768px) {
	#bottom > .inner { padding:4rem 1.6rem 4rem; font-size:1.5rem; word-break:keep-all; }
		
	#bottom .f-cnt { justify-content:flex-start; flex-wrap:wrap; }
	#bottom .f-cnt .f-info { width:100%; margin-bottom:2.8rem; }
	
	#bottom .f-btm .f-btm-text { justify-content:flex-start; flex-wrap:wrap; }
	#bottom .f-btm .f-btm-text .f-menu { width:100%; gap:0.4rem 1.6rem; flex-wrap:wrap; margin-bottom:1.6rem; }
}