@charset "utf-8";



/* 레이아웃 기본공통영역  /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
html {
	/* 반응형 폰트사이즈 */
	font-size:62.5%;
	
	/* 모바일 웹폰트 크기 자동조정 문제 */
	-webkit-text-size-adjust:none; /* 크롬/사파리/오페라 신버전 */
	-moz-text-size-adjust:none; /* 파이어폭스 */
	-ms-text-size-adjust:none; /* 익스 */
	-o-text-size-adjust:none; /* 오페라 구버전 */
	text-size-adjust:none;
}
@media screen and (max-width: 1024px) {
	html {font-size:60%;}
}
@media screen and (max-width: 480px) { 
	html {font-size:57%;}
}

body {min-width:280px;} /* 반응형일때 최소넓이 */

/* PC-모바일 반응형 화면출력여부  */
.pcOnly {}
.mobOnly {display:none;}
@media screen and (max-width: 1025px) {
	.pcOnly {display:none !important;}
	.mobOnly {display:block;}
}




/* 기본 레이아웃[틀]  /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.innerUsr {max-width:1500px; margin:0 auto; padding:0 5rem;}
.innerGnb {/* max-width:1920px; */ width: 100%; margin:0 auto; padding:0 5rem;}
@media screen and (max-width: 1200px){
	.innerGnb {width:100%; padding:0 2rem;}
}

@media screen and (max-width: 1025px){
	.innerUsr {width:100%; padding:0 2rem;}
}

@media screen and (max-width: 769px){
}

@media screen and (max-width: 481px){
}



/* 상단영역 */
#headerUsr {position:relative; z-index:99; width:100%; min-width: 320px; height:10rem; background: #fff; border-bottom: 1px solid #ddd; }

.gnbUsr {display:flex; flex-wrap:wrap; height:100%; justify-content:space-between; align-items:center;}
.gnbUsr h1 a {display:block;}

.gnbUsr .menuUsrPC {display:flex; flex-wrap:wrap; justify-content:center; /* width:calc(100% - 330px); */}
.gnbUsr .menuUsrPC > ul {display:flex; flex-wrap:wrap;}
.gnbUsr .menuUsrPC > ul li > a {position:relative; margin:0 3rem; font-size:2rem; color:#333; letter-spacing: -0.07em; font-weight: 500; }
.gnbUsr .menuUsrPC > ul li > a:hover { color: #0f4fa1; }

.gnbUsr .topNaviUsr { display: flex; gap: 0.8rem; }
.gnbUsr .topNaviUsr > a { display:inline-flex; padding: 0 1.2em; height: 4rem; flex-wrap:wrap; justify-content:center; align-items:center; flex-direction:column; border-radius: 50em; border: 1px solid; font-size: 1.5rem; color:#444; letter-spacing: -0.07em; }
.gnbUsr .topNaviUsr > a:hover { background: #333; color: #fff; }
.gnbUsr .topNaviUsr > a.adm { background: #0f4fa1; color: #fff; }
.gnbUsr .topNaviUsr > a.adm:hover { background: #0c4389; }

/* 모바일-햄버거메뉴 */
.hmgBtn {display:none;}

/* 모바일-메뉴선택시 배경 */
.coverBG {display:none; position:fixed; width:100vw; height:100vh; top:0; left:0; margin:0; background:rgba(0,0,0,0.6);}

/* 모바일-메뉴영역 */
#mobMENU {display:none; position:fixed; top:0; right:0; z-index:999; width:100vw; height:100vh; font-size:1.6rem; background:#fff; overflow-y:scroll; -ms-overflow-style:none;}
#mobMENU::-webkit-scrollbar {display:none;} 

@media screen and (max-width: 1400px){
	.gnbUsr .menuUsrPC > ul li > a {font-size:1.8rem; margin:0 1.2rem;}
}

@media screen and (max-width: 1200px){
	/* 웹메뉴 상단영역*/
	#headerUsr {padding:0 2rem;}
	
	.gnbUsr .menuUsrPC {display:none;}
	.gnbUsr .topNaviUsr {display:none;}
	
	/* 모바일-메뉴/닫기 영역 */
	.hmgBtn, .hmgBtn span {display:inline-block; transition:all 0.4s; box-sizing:border-box; cursor:pointer;}
	.hmgBtn {position: relative; z-index:1000; width: 36px; height: 24px; padding:0; border:none; background:none;}
	.hmgBtn span {position:absolute; right:0; height:3.2px; width: 100%; background:#222;}
	.hmgBtn span:nth-child(1) { top: 0; }
	.hmgBtn span:nth-child(2) { top: 50%; transform: translateY(-50%); }
	.hmgBtn span:nth-child(3) { bottom: 0; }
	.hmgBtn.view span:nth-child(1) {width:100%; transform:translateY(11px) rotate(-45deg);}
	.hmgBtn.view span:nth-child(2) {opacity:0;}
	.hmgBtn.view span:nth-child(3) {transform:translateY(-10px) rotate(45deg);}
	
	/* 모바일-메뉴선택시 배경 */
	.coverBG.view {display:block;}
	
	/* 모바일-메뉴영역 */
	#mobMENU.view { display: flex; flex-direction: column; }
	#mobMENU {width:48rem; min-width:320px;}
	#mobMENU .mobBoxInfo {width:100%; padding:0 4rem; background:#f6f6f6;}
	#mobMENU .mobBoxInfo .mob_loginout {padding: 5rem 0 3rem 0;}
	#mobMENU .mobBoxInfo .mob_loginout > p {font-size:1.5rem; line-height:1.4; color:#666; margin-bottom:2rem; word-break:keep-all;}
	#mobMENU .mobBoxInfo .mob_loginout > p span {display:block; margin-bottom:0.5rem;}
	#mobMENU .mobBoxInfo .mob_loginout > p strong {font-size:1.6rem; color:#222;}
	#mobMENU .mobBoxInfo .mob_loginout > div { display: flex; flex-wrap: wrap; gap: 1.5rem; }
	#mobMENU .mobBoxInfo .mob_loginout > div a { display:inline-flex; padding: 0.8em 0; flex-wrap:wrap; flex: 1; align-items:center; justify-content: center; font-size:1.6rem; font-weight:500; color:#fff; letter-spacing: -0.05em; border-radius: 50em; }
	#mobMENU .mobBoxInfo .mob_loginout > div .mob-login { background: #678be7; }
	#mobMENU .mobBoxInfo .mob_loginout > div .mob-join { background: #444; }
	#mobMENU .mobBoxInfo .mob_loginout > div .mob-logout { background: #e14a40; }
	
	.menuBoxMob {position:relative; padding:3rem 4rem; background:#fff;}
	.menuBoxMob > ul > li {width:100%;}
	.menuBoxMob > ul > li > a {width:100%; height:6rem; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;}
	.menuBoxMob > ul > li > a span {font-size:1.8rem; color:#333; font-weight: 500; letter-spacing: -0.05em;}
	.menuBoxMob > ul > li > a i {font-size:1.2rem; color:#74798e;}
	.menuBoxMob > ul > li > ul {padding-bottom:2.5rem; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;}
	.menuBoxMob > ul > li > ul > li {width:100%;}
	.menuBoxMob > ul > li > ul > li > a {position:relative; width:100%; height:4.5rem; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:end; padding:0 1rem;}
	.menuBoxMob > ul > li > ul > li > a span {font-size:1.6rem; color:#555;}
	.menuBoxMob > ul > li > ul > li > a i {font-size:1.2rem; color:#74798e;}
	.menuBoxMob > ul > li > ul > li > a i.change {display:none;}
	.menuBoxMob > ul > li > ul > li > ul > li {width:100%;}
	.menuBoxMob > ul > li > ul > li > ul > li > a {
		position:relative; width:100%; min-height:4rem; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:start; 
		font-size:1.5rem; line-height:1.4; color:#74798e; padding:2rem 2rem 0 4rem; word-break:keep-all;
	}
	.menuBoxMob > ul > li > ul > li > ul > li > a:after {content:""; display:block; position:absolute; left:2rem; top:3rem; width:8px; height:1px; background:#74798e;}
	.menuBoxMob > ul > li > ul > li > ul > li > a:hover {color:#294cb5;}
}

@media screen and (max-width: 1200px){
	#headerUsr { height:8rem; }
	.gnbUsr h1 a img { height: 3.8rem; }
}

@media screen and (max-width: 1025px){
}

@media screen and (max-width: 769px){
	.hmgBtn { width: 26px; height: 17px; }
	.hmgBtn.view span:nth-child(1) { transform: translateY(7px) rotate(-45deg); }
	.hmgBtn.view span:nth-child(3) { transform: translateY(-7px) rotate(45deg); }
}

@media screen and (max-width: 481px){
	#headerUsr {height:7rem;}
	.gnbUsr h1 a img { height: 3.3rem; }
	#mobMENU { width: 100%; }
	#mobMENU .mobBoxInfo { padding: 0 2rem; }
}



/* 하단영역 */
footer { display:flex; position: relative; flex-direction:column; align-items:center; width:100%; background:#222; /* overflow:hidden; */}
footer em { color: #fff; }
footer .info_wrap { display: flex; width: 100%; padding: 5rem 0; font-size: 1.6rem; color: #a8acb1; word-break:keep-all; justify-content: space-between; flex-wrap: wrap; gap: 2rem; }
footer .fL { display: flex; flex-direction: column; gap: 3rem; flex-wrap: wrap; }
footer .fL ul, footer .fL li {display:flex; flex-wrap:wrap; align-items:center; gap: 0.3em 0; }
footer .fL li::after {content: ""; width:1.4px; height:0.8em; margin: 0 1rem; background:currentcolor; border-radius:50rem;}
footer .fL li:last-child::after {content: none;}
footer .fL li a { transition:0.2s; color: #eee; letter-spacing: -0.07em; }
footer .fL li a:hover { text-decoration: underline; }
footer .fL div { display: flex; gap: 0.5em; color: #acacac; flex-direction: column; }
footer .fL div b { color: #eee; font-weight: 500; }
footer .fL div span { display: inline-flex; position: relative; align-items: center;  }
footer .fL div span::after { content: ""; width:1.4px; height:0.8em; margin: 0 1rem; background:currentcolor; border-radius:50rem;}
footer .fL div span:last-child::after { content: none; }
footer .fR { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; }
footer .gotopBtn { display: flex; width:50px; height:50px; border-radius: 10px; border:none; background: linear-gradient(45deg, #1d4e93, #1d936c); justify-content: center; align-items: center; font-size: 12px; color: #fff; }
footer .gotopBtn::before { content: "\f062"; font-family: 'FontAwesome'; color: #fff; font-size: 14px; }
footer .gotopBtn:hover { box-shadow: 0px 1px 20px rgba(0, 0, 0, 0.4); }

@media screen and (max-width: 1200px){
}

@media screen and (max-width: 1025px){
	footer .fL, footer .fR { width: 100%; align-items: center; }
	footer .fL ul, footer .fL li { justify-content: center; }
	footer .fL div { grid-template-columns: none; text-align: center; }
	footer .fL div p:first-child { line-height: 1.2em; }
	footer .family-site { width: 100%; }
	footer .family-site > button { width: 100%; }
	footer .fR { display: none; }
	footer .info_wrap { padding: 4rem 0; }
}

@media screen and (max-width: 769px){
}

@media screen and (max-width: 481px){
}



/* 본문 영역 */
.contUsr {display:flex; flex-wrap:wrap; align-content: flex-start; max-width:1500px; margin:0 auto 6rem auto; padding:0 5rem;}
.contUsr #left {width:100%; overflow:hidden;}
.contUsr #right {width: 100%; }

@media screen and (max-width: 1200px){
	.contUsr {padding: 0 2rem 6rem 2rem;}
	.contUsr #right { /* border-top: 1px solid #ddd;  */}
}

@media screen and (max-width: 1025px){
	#subVisual > div {  }
}

@media screen and (max-width: 769px){
	#content #left {display:none;}
}

@media screen and (max-width: 481px){
}

/* 좌측메뉴 */
.leftMenu {display:flex; justify-content:center; width:100%; transition:top 0.3s ease-in;}
.leftMenu p {display:none;}
.leftMenu dl {overflow:hidden; margin-bottom: 5rem;}
.leftMenu dl dt {width:100%; padding:0 15px;}
.leftMenu dl dt a {display:block; position:relative; font-size:2rem; font-weight:bold; color:#bebebe; padding:8px 0; text-align:center;}
.leftMenu dl dt a:after {content:""; position:absolute; left:-50%; right:-50%; bottom:0; width:0; height:3px; margin:0 auto; visibility:hidden; background:#005aa0; transition:0.3s all cubic-bezier(0.075,0.82,0.165,1);}
.leftMenu dl dt a:hover {color:#005aa0;}
.leftMenu dl dt a:hover:after {width:100%; visibility:visible;}
.leftMenu dl dt a.on {color:#005aa0;}
.leftMenu dl dt a.on:after {width:100%; visibility:visible;}
.leftMenu dl dd {display:flex; margin-top:12px;}
.leftMenu dl dd a {font-size:1.6rem; font-weight:500; color:#999; padding:8px 15px; margin:0 5px; text-align:center; border-radius:30rem; border:1px solid #e5e5e5; background:#f0f0f0;}
.leftMenu dl dd a:hover {color:#fff; border-color:#005aa0; background:#005aa0;}
.leftMenu dl dd a.on {color:#fff; border-color:#005aa0; background:#005aa0;}

/* 서브이미지 */
#subVisual {width:100%; max-width:1340px; padding:0 20px; margin:0 auto; overflow:hidden;}
#subVisual > div {display:flex; flex-direction:column; align-items:center; position:relative; margin:5.2rem 0 4rem 0;}
#subVisual > div h1 { margin-bottom: 2rem; font-weight:700; font-size:4.6rem; letter-spacing:-0.28rem; color: #1f1f1f; }
#subVisual > div h2 {font-weight:300; font-size:1.8rem; letter-spacing:-0.1rem; text-align:center; color:#888; word-break:keep-all;}

@media screen and (max-width: 1025px){
	#subVisual > div { margin: 4.2rem 0 3rem 0; }
	#subVisual > div h1 { font-size: 4rem; }
	/* #content #right { padding: 4rem 2rem 6rem 2rem; } */
}

@media screen and (max-width: 767px) {
	#subVisual { display: none; }
	#subVisual > div {margin:4rem 0;}
	#subVisual > div h1 {font-size:3.2rem;}
	#subVisual > div h2 {font-size:1.6rem;}
}


/* 타이틀/네비 */
.titleNaviNew {position:absolute; left:0; top:24rem; width:100%; height:5.5rem; border-bottom:1px solid #eee; background:#f8f8f8; display: none; }
.titleNaviNew > div > div {display:flex; flex-wrap:wrap; width:100%; align-items:center; font-size:1.5rem; color:#333; padding:1.85rem 0;}
.titleNaviNew > div > div > i {margin-right:0.5rem;}
.titleNaviNew > div > div > span {font-weight:bold; margin-left:0.5rem; color:#294cb5;}

.subTitleUsr {
	display:none;
}

@media screen and (max-width: 1200px){
}

@media screen and (max-width: 1025px){
	.titleNaviNew {top:20rem;}
}

@media screen and (max-width: 769px){
	.titleNaviNew {display:none;}
	
	.subTitleUsr { display: flex;  position: relative; margin: 4rem 0; padding: 0 0 3rem 1.2em; font-size: 2.8rem; font-weight: 600; letter-spacing: -0.05em; border-bottom: 1px dashed #ddd; color: #1f1f1f; align-items: center; }
	.subTitleUsr::before { content: ""; position: absolute; display: inline-block; width: 0.5em; height: 0.5em; left: 0; border-radius: 50%; background: rgba(68, 127, 255, 0.7); }
	.subTitleUsr::after { content: ""; position: absolute; display: inline-block; width: 0.5em; height: 0.5em; left: 0; border-radius: 50%; background: rgba(59, 146, 43, 0.7); transform: translateX(60%); }
}

@media screen and (max-width: 481px){
}



/* 로그인 */
.loginLayer {left:50%; top:50%; width:640px; border-top:5px solid #294cb5; background:#fff; z-index:10;}
.loginLayer > p {position:absolute; margin:-5px 0 0 600px;}
.loginLayer > p a {display:inline-flex; flex-wrap:wrap; justify-content:center; align-items:center; width:40px; height:40px; background:#294cb5;}
.loginLayer > p a i {font-size:2.2rem; color:#fff;}
.loginLayer > div > h1 {margin-top:7rem; text-align:center; font-size:3.6rem; color:#333; font-weight:500;}
.loginLayer > div > h1 span {font-weight:bold; color:#294cb5;}
.loginLayer > div > h2 {margin-top:2rem; text-align:center; font-size:1.7rem; color:#555; font-weight:normal;}
.loginLayer > div > div {width:90%; margin:50px auto 0 auto; padding-top:2rem; text-align:center; border-top:1px solid #ddd;}
.loginLayer > div div.loginBox {width:330px; margin:1rem auto 6rem auto; overflow:hidden;}
.loginLayer > div div.loginBox > p {text-align:center; margin-bottom:2rem;}
.loginLayer > div div.loginBox > p label {font-size:1.5rem; margin:0 1rem;}
.loginLayer > div div.loginBox > ul {width:100%; overflow:hidden;}
.loginLayer > div div.loginBox > ul li {margin-bottom:0.5rem; width:328px; border:1px solid #ddd;}
.loginLayer > div div.loginBox > ul li input {width:100%; height:5rem; border:none;}
.loginLayer > div div.loginBox > ul li input.lgID {background:url('../images/content/icn_id.jpg') 15px center no-repeat; padding-left:4.5rem;}
.loginLayer > div div.loginBox > ul li input.lgPW {background:url('../images/content/icn_pwd.jpg') 15px center no-repeat; padding-left:4.5rem;}
.loginLayer > div div.loginBox > div {width:330px; margin-top:1rem;}
.loginLayer > div div.loginBox > div a {display:block; width:100%; font-size:1.8rem; text-align:center; color:#fff; padding:1.5rem 0; border:none; background:#294cb5;}

@media screen and (max-width: 1200px){
}

@media screen and (max-width: 1025px){
}

@media screen and (max-width: 769px){
	.login_pop_inner {width:100% !important; min-width:100% !important; height:auto !important;}
	.loginLayer {width:100%; height:100%; min-height:500px; padding:0 2rem; text-align:center;}
	.loginLayer > p {right:10px; margin:-0.5rem 0 0 0;}
	.loginLayer > div > div {margin-top:3rem;}
	.loginLayer > div > h1 {font-size:3.2rem; word-break:keep-all;}
	.loginLayer > div > h2 {font-size:1.5rem; word-break:keep-all;}
	.loginLayer > div div.loginBox {width:80%; margin:0 auto 7rem auto;}
	.loginLayer > div div.loginBox > ul li {width:100%; box-sizing:border-box;}
	.loginLayer > div div.loginBox > div {width:100%; margin-top:1rem;}
}

@media screen and (max-width: 481px){
	.loginLayer {padding:0 1.5rem;}
	.loginLayer > div > h1 {font-size:2.2rem;}
}



/* 세부공통영역  /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* 검색영역-검색조건이 많을 경우 */
.searchBox {display:flex; align-items:center; width:100%; /* height:100%; */ margin-bottom:30px; border-radius:5px; border:1px solid #ddd; background:#fff; /* box-shadow:1px 1px 5px 1px rgba(0,0,0,0.05); */ overflow:hidden;}
.searchBox > div.srchForm {width:calc(100% - 170px); padding:20px;}
.searchBox > div.srchForm p {margin-top:20px;}
.searchBox > div.srchForm p:first-child {margin-top:5px;}
.searchBox > div.srchForm p:after {content:""; display:block; clear:both;}
.searchBox > div.srchForm p span {position:relative; float:left; display:block; padding:0 3px;}

.searchBox label {position:absolute; top:-12px; left:8px; font-size:13px; line-height:13px; padding:0 5px; color:rgba(0,0,0,0.4); background:#fff;}
.searchBox input.floating-input, .searchBox select.floating-select {display:block; width:100%; height:40px; border-radius:3px;}
.searchBox input.floating-input:-webkit-autofill, 
.searchBox input.floating-input:-webkit-autofill:hover, 
.searchBox input.floating-input:-webkit-autofill:focus, 
.searchBox input.floating-input:-webkit-autofill:active {
	transition:background-color 5000s ease-in-out 0.5s;
	-webkit-text-fill-color:#727272 !important;
} /*크롬 input 자동완성 배경색 제거 */
.searchBox input.floating-input:focus, .searchBox select.floating-select:focus {outline:none; border:1px solid #294cb5;}
.searchBox input.floating-input:focus ~ label, .searchBox select.floating-select:focus ~ label {color:#294cb5;}

.searchBox > div.srchForm p.dvid1 span {width:100%;}
.searchBox > div.srchForm p.dvid2 span {width:calc(100% / 2);}
.searchBox > div.srchForm p.dvid3 span {width:calc(100% / 3);}
.searchBox > div.srchForm p.dvid4 span {width:calc(100% / 4);}
.searchBox > div.srchForm p.dvid5 span {width:calc(100% / 5);}

.searchBox > div.srchForm p .divdInner {padding:0;}
.searchBox > div.srchForm p .divdInner span.divdSM {width:calc((100% / 3) * 1);}
.searchBox > div.srchForm p .divdInner span.divdLG {width:calc((100% / 3) * 2);}
.searchBox > div.srchForm p .divdInner span.divdSame {width:calc(100% / 2);}

.searchBox > div.srchForm p .divdDate {display:flex; /* justify-content:center; */ align-items:center;/*  padding:0; */}
.searchBox > div.srchForm p .divdDate input {width:calc(((100% - 10px) / 2) - 25px);}
.searchBox > div.srchForm p .divdDate img {width:25px; height:25px;}
.searchBox > div.srchForm p .divdDate span.wave {width:10px !important; margin: 0;}

.searchBox > div.srchForm p .divdEqual {padding:0;}
.searchBox > div.srchForm p .divdEqual span.equal {width:calc(100% / 2);}

.searchBox > div.srchBtn {width:170px; display:flex; justify-content:center; padding:20px 0; border-left:1px solid #e5e5e5;}
.searchBox > div.srchBtn > a {display:block; width:130px; height:45px; font-size:15px; line-height:45px; letter-spacing:0; font-weight:500; color:#fff; text-align:center; margin:0 auto; border-radius:50px; transition:0.5s ease all; background:#222;}
.searchBox > div.srchBtn > a:hover {background:#002050;}

@media screen and (max-width :1024px) {
	.searchBox {flex-direction:column;}
	.searchBox > div.srchForm {width:100%; padding:20px 10px;}
	.searchBox > div.srchBtn {width:100%; padding:10px 0; border-left:none; border-top:1px solid #e5e5e5;}
}
@media screen and (max-width :768px) {
	.searchBox > div.srchForm p.dvid3 span {width:calc(100% / 2);}
	.searchBox > div.srchForm p.dvid3 span:last-child {width:100%;}
	.searchBox > div.srchForm p.dvid4 span {width:calc(100% / 2);}
	.searchBox > div.srchForm p.dvid5 span {width:calc(100% / 2);}
	.searchBox > div.srchForm p.dvid5 span:last-child {width:100%;}
	
	.searchBox > div.srchForm p span:nth-child(1), .searchBox > div.srchForm p span:nth-child(2) {margin:0;}
	.searchBox > div.srchForm p span {margin-top:20px;}
	
	.searchBox > div.srchForm p .divdEqual {width:100% !important; margin-bottom:20px !important;}
	.searchBox > div.srchForm p .wide {width:100% !important;}
}
@media screen and (max-width :480px) {
	.searchBox > div.srchForm p span {width:100% !important;}
	.searchBox > div.srchForm p span:nth-child(2) {margin:20px 0 0 0;}
	
	.searchBox > div.srchForm p .divdInner span.divdLG {margin-top:5px;}
	.searchBox > div.srchForm p .divdInner span.divdLG label {display:none;}
	
	.searchBox > div.srchForm p .divdEqual {margin-bottom:0 !important;}
	
}

/* 검색영역-검색조건이 적을 경우(게시판) */
.search {display:inline-flex; flex-wrap:wrap; width:100%; justify-content:end;}
.search > div select {width:8rem; height:4.5rem; border-radius:3px 0 0 3px;}
.search > div input {width:22rem; height:4.5rem; border-left:none; border-radius:0;}
.search > div button {display:flex; flex-direction:column; justify-content:center; align-items:center; width:6rem; height:4.5rem; color:#fff; border-radius:0 3px 3px 0; background:#333;}
.search > div button > i {font-size:1.6rem;}
.search > div button > span {letter-spacing:1px;}

/* 탭버튼 */
.tab * {font-size:1.6rem;}
.tab-button {display:flex; flex-wrap:wrap; margin-bottom:3rem; border:1px solid #ddd;}
.tab-button li {border-right:1px solid #ddd;}
.tab-button li:last-child {border:none;}
.tab-button.divd1 li {width:100%;}
.tab-button.divd2 li {width:calc(100% / 2);}
.tab-button.divd3 li {width:calc(100% / 3);}
.tab-button.divd4 li {width:calc(100% / 4);}
.tab-button.divd5 li {width:calc(100% / 5);}
.tab-button.divd6 li {width:calc(100% / 6);}
.tab-button li a {position:relative; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; font-size:1.5rem; font-weight:500; padding:2rem 1rem;}
.tab-button li a:hover {color:#fff; background:#294cb5;}
.tab-button li a:hover:after {content:""; position:absolute; width:0; height:0; left:50%; border-bottom:5px solid #fff; border-left:5px solid transparent; border-right:5px solid transparent; bottom:0; transform:translate(-50%);}
.tab-button li a.on {color:#fff; background:#294cb5;}
.tab-button li a.on:after {content:""; position:absolute; width:0; height:0; left:50%; border-bottom:5px solid #fff; border-left:5px solid transparent; border-right:5px solid transparent; bottom:0; transform:translate(-50%);}
.tab-select { display: none; }
/* #tabBox {margin-bottom:40px; box-sizing:border-box; border-left:1px solid #ddd; overflow:hidden;}
#tabBox > li {float:left; width:20%; box-sizing:border-box; border-top:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
#tabBox > li a {display:block; height:60px; font-size:15px; line-height:60px; color:#8e9297; text-align:center; background:#f7f8fc;}
#tabBox > li a:hover {color:#fff; background:#355cb9;}
#tabBox > li a.on {color:#fff; background:#355cb9;} */

@media screen and (max-width: 1199px){
}

@media screen and (max-width: 989px){
}

@media screen and (max-width: 769px){
	.tab-button {display:none;}
	.tab-button.tab-button-adm {display:block;}
	.tab-select {display:block; margin-bottom: 3rem; }
	.tab-select select {width:100%; height:50px;}
	.tab-select select option {color:#555;}
}
@media screen and (max-width: 479px){
}


/* 서약 */
.vow * {color:#333; word-break:keep-all;}
.vow {margin-top:3rem;}
.vow h1 {margin:4rem 0; font-size:2.4rem; font-weight:500; text-align:center;}
.vow h2 {margin:3rem 0; font-size:2rem; font-weight:500; text-align:center;}
.vow h3 {padding:2rem; font-size:1.7rem; text-align:center;}
.vow p {padding:2rem; font-size:1.7rem; text-align:center;}
.vow div.userSign {display:flex; justify-content:flex-end; margin:0.8rem 0;}
.vow div.userSign > div {font-size:1.7rem; margin-left:1rem;}
.vow div.userSign > div span, .vow div.userSign > div label, .vow div.userSign > div a {margin-left:0.5rem;}
.vow div.userSign > div span {font-style:italic; font-weight:bold;}


/* 동의서 */
.agreement * {word-break:keep-all;}
.agreement {overflow:hidden;}
.agreement h3 {font-size:2.4rem; font-weight:bold; color:#222; margin-bottom:3rem;}
.agreement p.agree_final_text {margin-top:5rem; font-size:1.8rem; text-align:center; padding:0 2rem; word-break:keep-all;}
.agreement .agreeBox {margin-top:3rem; padding:2rem; border-radius:1rem; border:1px solid #ddd; background:#fff;}
.agreement .agreeBox > h4 {display:flex; align-items:center; margin-bottom:2rem;}
.agreement .agreeBox > h4 span {display:flex; justify-content:center; align-items:center; width:3rem; height:3rem; font-size:1.4rem; font-weight:bold; color:#fff; border-radius:50%; background:#005aa0;}
.agreement .agreeBox > h4 strong {width:calc(100% - 3rem); padding-left:8px; font-size:1.8rem; line-height:1.1;}
.agreement .agreeBox > .agreeCont {font-size:1.6rem; color:#555; padding:2rem; border-radius:1rem; background:#f7f8fc;}
.agreement .agreeBox > .agreeCont p {padding-bottom:1rem; font-weight:500; color:#222;}
.agreement .agreeBox > .agreeCont p:last-child {padding:0;}
.agreement .agreeBox > .agreeCont ol > li {padding:0.5rem 0;}
.agreement .agreeBox > .agreeCont ol > li > ul {padding:0 0 0 1rem;}
.agreement .agreeBox > .agreeCont ul > li {position:relative; padding:0.3rem 0 0.3rem 1.2rem;}
.agreement .agreeBox > .agreeCont ul > li:after {content:""; display:inline-block; position:absolute; left:0; top:12px; width:6px; height:1px; background:#777;}
.agreement .agreeBox > .agreeChk {margin-top:2rem;}
.agreement .agreeBox > .agreeChk > p {font-size:1.6rem; color:#333; font-weight:500; text-align:center;}
.agreement .agreeBox > .agreeChk > span {display:block; font-size:1.4rem; line-height:1.1; color:#d83318; margin-top:1rem; text-align:center;}
.agreement .agreeBox > .agreeChk > div {display:flex; justify-content:center; align-items:center; margin:3rem auto 0 auto; font-size:1.6rem;}
.agreement .agreeBox > .agreeChk > div span {padding:1rem 1.5rem; border-radius:3rem; background:#eaeaea;}
.agreement .agreeBox > .agreeChk > div span label {padding:0 0.5rem;cursor: pointer; }
.agreement .todayDate {margin:4rem 0; font-size:2.4rem; text-align:center;}
.agreement .signArea {display:flex; justify-content:center; align-content:center; align-items:center; margin:0 auto; padding:1rem 0; text-align:center;}
.agreement .signArea dl {display:inline-flex; align-items:center; padding:0 5px;}
.agreement .signArea dl dt {font-size:1.8rem; margin-right:2rem;}
.agreement .signArea dl dd {font-size:2rem;}
.agreement .signArea dl dd .userNM, .practice_agreement .signArea dl dd .compNM  {font-size:2rem; line-height:1.2; font-weight:bold; color:#777; margin-right:1rem;}
.agreement .signArea dl dd .userSign {font-size:2rem; font-style:italic; font-weight:bold; margin-right:1rem;}



/* 달력 */
.calendar {width:100%; min-width:600px;}
.calendar .date-slide {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; padding:2rem; border-bottom:3px solid #ddd;}
.calendar .date-slide > a {display:flex; flex-wrap:wrap; justify-content:center; align-items:center; width:2rem;}
.calendar .date-slide > a i {font-size:2rem; color:#999;}
.calendar .date-slide > div {width:calc(100% - 4rem); font-size:2rem; font-weight:bold; color:#222; text-align:center;}
.calendar table {width:100%; table-layout:fixed; overflow-x:scroll;}
.calendar table thead th {font-size:1.8rem; font-weight:bold; color:#222; padding:2rem 1rem; opacity:0.6;}
.calendar table thead th span {font-size:1.8rem; font-weight:bold; font-weight:bold;}
.calendar table .saturday {color:#2b65e5;}
.calendar table .sunday {color:#d74831;}
.calendar table tbody td {position:relative; z-index:1; vertical-align:top; padding:1.5rem 1rem;}
.calendar table tbody td p {font-family:"Poppins"; font-size:1.6rem; font-weight:bold; color:#222; text-align:center; margin-bottom:1rem;}
.calendar table tbody td ul li {text-align:center; padding:0.2rem; margin-bottom:0.5rem; border-radius:0.3rem; border:1px solid #ddd; background:#fff;}
.calendar table tbody td ul li:last-child {margin:0;}
.calendar table tbody td ul li strong {font-weight:bold; color:#222;}
.calendar table tbody td .today {position:absolute; left:0; top:0; z-index:-1; width:100%; height:100%; background:rgba(249,243,245,0.8);}


/* 페이징 */
.listPaging {display:flex; justify-content:center; width:100%; margin-top:3rem; text-align:center;}
.listPaging a {margin:0 0.2rem; overflow:hidden;}
.listPaging a img {width:3.5rem; height:3.5rem;}
.listPaging a span {display:block; width:3.5rem; height:3.5rem; text-align:center; font-size:1.2rem; line-height:1.4rem; padding:1rem 0; border:1px solid #ddd;}
.listPaging a span:hover {color:#333; border:1px solid #333; background:#fff;}
.listPaging a span.on {color:#fff; border:1px solid #333; background:#333;}

/* 파일리스트 */
.fileList li {padding:0.3rem 0;}

/* 파일리스트(이미지 보여지는 영역(*캡스톤 디자인 신청/수정 페이지에서 사용*)) */
.fileListShow { display: flex; flex-wrap: wrap; margin-top: 1rem; gap: 1.4rem; }
.fileListShow li { flex: 0 48%; padding: 2rem; border-radius: 3px; border: 1px solid #ddd; }
.fileListShow li .fileListImg { display: block; max-height: 170px; height: 100%; width: 100%; padding: 2rem; /* margin-bottom: 1.4rem; */ border: 1px dashed #dddddd; object-fit: contain; }
.fileListShow li .fileImgWrap { width: 100%; }
.fileListShow li .fileImgTit { margin-top: 1.4rem; }
@media screen and (max-width: 768px){
	.fileListShow li { flex: 1 0 100%; }
}



/* 문구 공통영역  /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* 타이틀 */
.sub-title-wrap { display: flex; flex-wrap: wrap; gap: 6rem; margin: 8rem 0 6rem; justify-content: space-between; }
.sub-title-wrap > * { margin: 0 !important; }
.sub-title1 {position:relative; font-size:2.8rem; font-weight:bold; color:#222; margin-bottom:3rem; word-break:keep-all; letter-spacing: -0.07em;}
.sub-title1 span { font-weight: 400; }
.sub-title2 {position:relative; font-size:2rem; font-weight:bold; color:#333; margin-bottom:2rem; padding:0 0 0 3rem; word-break:keep-all;}
.sub-title2:after {content:""; display:block; position:absolute; left:0; top:6px; width:2.2rem; height:1.4rem; background:url('../images/common/icn_title1.png') no-repeat;}
.sub-title3 {font-size:1.8rem; font-weight:500; color:#333; margin-bottom:2rem; word-break:keep-all;}

@media screen and (max-width: 1199px){
}

@media screen and (max-width: 989px){
}

@media screen and (max-width: 769px){
	.sub-title1 {font-size:2.4rem;}
}

@media screen and (max-width: 479px){
}



/* 안내문구(좌-우) */
.info-sect {display:flex; justify-content:space-between; align-items:center; margin-bottom:1.5rem;}
.info-sect .left {width:100%; text-align:left; margin-right:1rem; font-size:1.4rem; color:#555;}
.info-sect .right {width:100%; display:inline-flex; flex-wrap:wrap; justify-content:flex-end;}

@media screen and (max-width: 1199px){
}

@media screen and (max-width: 989px){
}

@media screen and (max-width: 769px){
	.info-sect {flex-direction:column;}
}

@media screen and (max-width: 479px){
}

/* 중요-경고 문구 */
.warn {position:relative; font-size:1.5rem; padding:0.2rem 0 0.2rem 2rem;  word-break:keep-all;}
.warn:after {content:"\f06a"; display:block; position:absolute; left:0; top:3px; font-family:"FontAwesome"; color:#d02258;}
.warn span, .warn strong {color:#d02258;}

/* 목록 카운트 */
.count {font-size:1.5rem; color:#999; padding:0.2rem 0;}
.count strong {color:#222;}

/* 내용 리스트 */
.sub-list > li {position:relative; font-size:1.6rem; line-height:1.3; color:#555; padding:0.4rem 0 0.4rem 2rem; word-break:keep-all;}
.sub-list > li:after {content:""; display:block; position:absolute; left:5px; top:1.5rem; width:6px; height:1px; background:#999;}
.sub-list > li > ul {padding:0.5rem 0 0 0;}
.sub-list > li > ul > li {padding:0.3rem 0 0.3rem 1.2rem; font-size:1.55rem; background:url('../images/btnIcn/icn_dot1.gif') 0 1rem no-repeat;}

/* 설명박스 */
.explain-box {width:100%; padding:20px; font-size:1.6rem; border:1px solid #ddd; background:#f8fafd; overflow:hidden; word-break:keep-all;}
.explain-box h3 {font-size:18px; font-weight:bold; color:#333;}
.explain-box > ul > li {position:relative; font-size:15px; line-height:1.2; color:#333; padding:0.3rem 0 0.3rem 1.5rem;}
.explain-box > ul > li:after {content:""; display:block; position:absolute; left:0; top:1.2rem; width:8px; height:1px; background:#999; word-break:keep-all;}
.explain-box > ul > li span {display:block; color:#e42612; padding-top:5px;}


/* 정의내용리스트 */
.define-list * {word-break:keep-all;}
.define-list {margin-top:1.5rem; padding-top:1.5rem; border-top:1px dashed #ddd; overflow:hidden;}
.define-list:first-child {margin:0; padding:0; border:none;}
.define-list > dt {font-weight:bold; color:#333;}
.define-list > dd {color:#555; margin-top:0.5rem;}
.define-list > dd strong {font-weight:500; color:#333;}


/* 박스영역 */
.boxarea {font-size:1.6rem; padding:2rem; border:1px solid #ddd; background:#f7f8fc;}

/* 달력 */
.calendar {overflow:hidden;}
.calendar .calYM {width:100%; margin:0 auto 20px auto; overflow:hidden;}
.calendar .calYM > dt {float:left; width:20%;}
.calendar .calYM > dt:last-child {text-align:right;}
.calendar .calYM > dd {float:left; width:60%; text-align:center; font-size:24px; line-height:30px; font-weight:bold; color:#000;}

.calendar .calDate {height:59px; background:url('../images/img/cal_dateBg.gif') no-repeat; background-size:cover;}
.calendar .calDate {width:100%; overflow:hidden;}
.calendar .calDate > dt {float:left; width:600px;}
.calendar .calDate > dt > dl {width:100%; overflow:hidden;}
.calendar .calDate > dt > dl > dt {float:left; width:100px; padding-top:18px; font-size:14px; font-weight:500;}
.calendar .calDate > dt > dl > dt a {color:#fff;}
.calendar .calDate > dt > dl > dd {float:left; width:400px; padding-top:15px; font-size:22px; line-height:26px; color:#fff; text-align:center;}
.calendar .calDate > dd {float:left; width:180px; padding:14px 20px 0 0; text-align:right;}
.calendar .calDate > dd:first-child {padding:14px 0 0 20px; text-align:left;}

.calendar table tbody td dl {overflow:hidden;}
.calendar table tbody td dl dt.ScolorRed {padding:8px 0 8px 0; margin-top:5px; text-align:center; color:#fff; background:#d21010; border:#e4e4e4 1px solid;}
.calendar table tbody td dl dt.ScolorOrange {padding:8px 0 8px 0; margin-top:5px; text-align:center; color:#fff; background:#e74c00; border:#e4e4e4 1px solid;}
.calendar table tbody td dl dt.ScolorGreen {padding:8px 0 8px 0; margin-top:5px; text-align:center; color:#fff; background:#129b23; border:#e4e4e4 1px solid;}
.calendar table tbody td dl dt.ScolorBlue {padding:8px 0 8px 0; margin-top:5px; text-align:center; color:#fff; background:#0969b3; border:#e4e4e4 1px solid;}


/* 이력서 등...사용자 증명사진 영역 */
.resume_photo {width:120px; height:160px; text-align:center; margin:0 auto; padding:8px; border:1px solid #ddd; background:#fff;}
.resume_photo span {display:block; position:relative; width:104px; height:144px; background:#d7dce5;}
.resume_photo .fileList, .resume_photo .fileList li {width:100%; height:100%;}
.resume_photo .fileList li {position:relative; margin:0;}
.resume_photo .fileList li > img {position:absolute; width:100%; height:100%; left:0; top:0; object-fit:contain;}
.resume_photo .fileList li > a {position:absolute; right:0; top:0; line-height:1em;}



/* 테이블 내부 리스트 */
.bbsInnerListBox, .bbsInnerListBox > * {display:flex; flex-wrap:wrap; justify-content:space-between;}
.bbsInnerListBox li {width:49%; margin-top:1rem; padding:1.5rem; border-radius:0.5rem; border:1px solid #ddd; background:rgba(247,248,252,0.5);}
.bbsInnerListBox li:nth-child(1), .bbsInnerListBox li:nth-child(2) {margin-top:0;}
.bbsInnerListBox li > dl {display:flex; flex-wrap:wrap; align-items:center; width:50%; font-size:1.6rem; padding:0.5rem;}
.bbsInnerListBox li > dl dt {font-weight:500; color:#222; margin-right:1rem;}

@media screen and (max-width: 1199px){
}

@media screen and (max-width: 989px){
	.bbsInnerListBox {flex-direction:column;}
	.bbsInnerListBox li {width:100%;}
	.bbsInnerListBox li:nth-child(2) {margin-top:1rem;}
}

@media screen and (max-width: 769px){
}

@media screen and (max-width: 479px){
	.bbsInnerListBox li > dl {width:100%;}
}



/* 테이블 내부 추가-삭제 리스트 */
.addDelBox {width:100%;}
.addDelBox li {display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:2rem; border-radius:0.5rem; border:1px solid #ddd;}
.addDelBox li:first-child {margin-top:0;}
.addDelBox li > div.form-wrap {width:calc(100% - 10rem);}
.addDelBox li > div.form-wrap > dl {padding:1.5rem; border-top:1px dashed #ccc;}
.addDelBox li > div.form-wrap > dl:first-child {border:none;}
.addDelBox li > div.form-wrap > dl dt {font-size:1.5rem; font-weight:500; color:#222; margin-bottom:1rem;}
.addDelBox li > div.add-del {display:flex; flex-wrap:wrap; flex-direction:column; justify-content:center; align-items:center; padding:1rem; width:10rem; border-left:1px solid #ddd; background:#f7f8fc;}

@media screen and (max-width: 1199px){
}

@media screen and (max-width: 989px){
}

@media screen and (max-width: 769px){
	.addDelBox li {flex-direction:column;}
	.addDelBox li > div.form-wrap {width:100%;}
	.addDelBox li > div.add-del {width:100%; flex-direction:row; border-top:1px solid #ddd; border-left:none;}
}

@media screen and (max-width: 479px){
}


/* 만족도조사 */
.satisfaction {width:100%; font-size: 1.5rem;}
.satisfaction .sfInfo {padding:25px; border:#e3e3e3 1px solid; background:#f7f8fc;}
.satisfaction .sfInfo h1 {width:100%; margin-bottom:15px; padding-bottom:2rem; font-size:2rem; font-weight:500; color:#333; border-bottom:#e4e4e4 1px solid;}
.satisfaction .sfInfo div {font-size:1.6rem;}
.satisfaction .sfCtn {padding:2.5rem; border-left:#e5e5e5 1px solid; border-right:#e5e5e5 1px solid;}
.satisfaction .sfCtn div {margin-bottom:2rem; padding-bottom:2rem; border-bottom:#e5e5e5 1px solid;}
.satisfaction .sfCtn div h1 {padding:0 0 5px 2rem; font-size:1.6rem; font-weight:500; color:#333; background:url('../images/btnIcn/icn_title2.png') 0 2px no-repeat;}
.satisfaction .sfCtn div p {padding:10px 0; font-size:1.6rem; color: #1f1f1f; }
.satisfaction .sfCtn div ul {width:100%; overflow:hidden;}
.satisfaction .sfCtn div ul li {padding:3px 0;}
.satisfaction .sfEnd {padding:2.5rem; border:#e3e3e3 1px solid; background:#f7f8fc;}


/* 툴팁 2018-04-09 */
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 170px;
    background-color: #5391fe;
    color: #fff;
    word-break:keep-all;
    text-align: left;
    border-radius: 3px;
    padding: 8px;
    position: absolute;
    z-index: 1;
    bottom: -100%;
    right: 100%;
    margin-right:20px;
    opacity: 0;
    transition: opacity 0.3s;
}

.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -25px;
    padding: 0px;
    margin-right: 15px;
    margin-bottom: 0px;
    width: auto;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent #5391fe;
    transform: translateY(-50%);
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}
.tooltip:hover .tooltiptext * { font-size: 13.5px; }