@charset "utf-8";
/* ************************ 레이아웃 설정 ************************ */
/* background fixed 사용시 버그 대응용 * 한 번 스크롤로 페이지 전체 넘김을 할 때는 html스타일에서 height속성 제거하기 */
/* html { overflow: hidden; height: 100%; } */
/* body { overflow: auto; height: 100%; } */

html body { font-family:var(--f_base1), sans-serif; font-size:var(--fs18); font-weight:400; line-height:1.6; color:#666; word-break:keep-all; overflow-x:hidden; } 
html body * {box-sizing:border-box;}

a,img,i,button { transition:all .3s ease; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; } 

.preWrap {padding:20px; background-color: #F7F7F7; border-radius:5px; border:1px solid var(--border1);}
.preWrap pre {
	height:60px; overflow-y:auto; padding:0; border:0;
	display: block; margin:0; font-family:var(--f_base1), sans-serif;
	font-size:var(--fs16); font-weight: 400; line-height: 1.6;
	letter-spacing: -0.48px; color: #666;word-break: break-all;
	word-wrap: break-word;
	white-space: pre-wrap; /* CSS3*/
	white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-all; /* Internet Explorer 5.5+ */ 
}

.ellipsis {text-overflow: ellipsis; white-space:nowrap;}
.ellipsis2 {text-overflow: ellipsis; display: -webkit-box; overflow: hidden; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.ellipsis3 {}

/* lnb 배경 */
.sub-visual {position:relative; width:100%; height:450px; background:#000 center /cover no-repeat;} 
/* .sub-visual .cover { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(2.5px); }  */

/*.sub-visual {background-image:url(/images/common/bg-research.webp);}
.sub-visual.research {background-image:url(/images/common/bg-research.webp)}
.sub-visual.project {background-image:url(/images/common/bg-project.webp)}
.sub-visual.professor {background-image:url(/images/common/bg-professor.webp)}
.sub-visual.member {background-image:url(/images/common/bg-member.webp)}
.sub-visual.publication {background-image:url(/images/common/bg-publication.webp)}
.sub-visual.awards {background-image:url(/images/common/bg-awards.webp)}
.sub-visual.lectures {background-image:url(/images/common/bg-lectures.webp)}
.sub-visual.board {background-image:url(/images/common/bg-board.webp)}
.sub-visual.contact {background-image:url(/images/common/bg-contact.webp)}*/


.site-route-wrap {padding-top:230px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:5px;}
.site-route-wrap h2 {font-size:var(--fs36); font-weight:700; text-align:left; color:#000;}
.site-route ul {display:flex; align-items:center; color:#888;}
.site-route ul li {font-size:var(--fs14); position:relative; }
.site-route ul li.home {padding-left:37px; display: flex; align-items:center; text-transform:uppercase; }
.site-route ul li.home:before {content:""; display:block; width:27px; height:27px; border:1px solid #ccc; border-radius:50%; background:url(/images/common/siteroute-home.svg) no-repeat center / 11px; position:absolute; left:0; }
.site-route ul li+li {padding-left:26px; padding-top:0; line-height:1; text-align:left;}
.site-route ul li+li:before {content:""; display:block; height:7px; width:1px; background:#ccc; transform:rotate(-45deg); position:absolute; left:13px; top:4px;}


/* ************************ 데스크탑 (1249~) ************************ */
@media screen and (min-width: 1200px), print {
	html,body {} 
	.mobile {display:none !important;}
	
	/* 페이징 PC*/
	.page_box {margin-top:60px; line-height:1; font-size:14px; text-align:center; position:relative; text-align:center; border:1px solid transparent;}
	.page_box .pagination.pc {display:flex; align-items:center; justify-content:center;}
	.page_box .pagination.pc>li {margin-left:-1px;}
	.page_box .pagination.pc>li>a {
		font-size:var(--fs18);font-weight: 700;
		color:#666; width:40px; height:40px; line-height:1;
		display: flex; align-items: center; justify-content: center;
	}
	.page_box .pagination.pc>li>a:hover {}
	.page_box .pagination.pc>li>a.active {color:var(--c_base2);}
	
	.page_box .pagination.pc>li>a.first {background-image:url(/images/common/icon_page_first.svg);}
	.page_box .pagination.pc>li>a.prev {background-image:url(/images/common/icon_page_prev.svg); margin:0 25px 0 10px;}
	.page_box .pagination.pc>li>a.next {background-image:url(/images/common/icon_page_next.svg); margin:0 10px 0 25px;}
	.page_box .pagination.pc>li>a.last {background-image:url(/images/common/icon_page_last.svg);}
	
	.page_box .pagination.pc>li>a.first:hover {background-image:url(/images/common/icon_page_first_on2.svg);}
	.page_box .pagination.pc>li>a.prev:hover {background-image:url(/images/common/icon_page_prev_on2.svg);}
	.page_box .pagination.pc>li>a.next:hover {background-image:url(/images/common/icon_page_next_on2.svg);}
	.page_box .pagination.pc>li>a.last:hover {background-image:url(/images/common/icon_page_last_on2.svg);}
	
	.page_box .btn.write {margin-left:20px;}
	
	/*컨텐츠*/
	.contents {padding:100px 0; padding-top:40px;}
	
	.w90vw { width:90vw; margin:0 auto!important; max-width:100%; } 
	.w1400 { max-width:1400px; margin:0 auto!important; width:100%; } 
	.w1600 { max-width:1600px; margin:0 auto!important; width:100%; } 
	.w1720 { max-width:1720px; margin:0 auto!important; width:100%; } 
	
	/* lnb */
	.sub-visual {}
	.sub-visual-wrap {padding:0 0 130px; height:100%; display:flex; justify-content:space-between; align-items:end;}
	.sub-visual-txt {}
	.sub-visual-txt h2 {color:var(--c_base3);font-size:var(--fs40);font-weight: 700;line-height: normal;letter-spacing: -1.2px;}
	
		.lnbH {height:70px;}
	.lnb {position:absolute; top:150px; left:0; width:100%; height:70px;background:#fff;   border-bottom:1px solid var(--border1);} 
	.lnb.fixOn {position:fixed; top:0;z-index:1000;box-shadow: rgba(0, 0, 0, 0.05) 0px 10px 20px -3px, rgba(0, 0, 0, 0.05) 0px 4px 8px -2px;}
	
	.lnb-wrap {display:flex; height:70px; align-items:center; position:relative;}
	.lnb-wrap h2 {
		padding-right:100px; color:#000; background:url(/images/common/icon_lnb_tit.svg)calc(100% - 50px) 0 no-repeat;
		font-size:var(--fs18);font-weight: 600; line-height:70px; 
	}
	.lnb-menu {height:100%;}
	.lnb-menu ul {display:flex; gap:30px;height:100%; align-items:center;}
	.lnb-menu ul li {height:100%; display:flex; align-items:center; border-bottom:3px solid transparent;}
	.lnb-menu ul li a {color: #000;font-size:var(--fs18);font-weight: 600;line-height: 100%;}
	.lnb-menu ul li.bar {width: 1px; height: 19px; background:var(--border1);}
	.lnb-menu ul li.on {border-color:var(--c_base3);}
	.lnb-menu ul li.on a {color:var(--c_base3);}
	/* .lnb-gotop {} */
	.lnb .gotop {
		padding:10px 0 0; width:60px; height:66px; line-height:66px; opacity:1 !important;
		position:absolute; right:0; top:0; text-align:center;
		background:url(/images/common/icon_gotop.svg)50% calc(50% - 10px) no-repeat;
		font-size:var(--fs12); font-weight:600; color:#000; 
	}
	
	
}

/* ************************ 태블릿 이하(~1249) ************************ */
@media screen and (max-width: 1199px) {
	
	.pc { display:none !important; } 
	
	.w90vw { padding:0!important; max-width:100%; } 
	
	/* 페이징 MOBILE */
	.page_box {position:relative; margin-top:50px; text-align:center;}
	.page_box .mobile {gap:10px; display:flex !important; align-items:center; justify-content:center;}
	.page_box .mobile label {display:none;}
	.page_box .mobile>li {margin-left:-1px;}
	.page_box .mobile>li>a {border:0; padding:0; color:#666; width:40px; height:40px; line-height:1; display: flex; align-items: center; justify-content: center;}
	.page_box .mobile>li>a img {height:10px;}
	.page_box .mobile>li>a:hover {background:#f0f0f0}
	.page_box .mobile>li>a.active {color:#fff; background:var(--c_base1); border:1px solid var(--c_base1);  font-weight:normal;}
	.page_box .mobile select {width:80px; height:40px; padding:0 0px 0 20px; background-position:calc(100% - 10px) 50%; border-radius: 10px; border-color: #e7e7e7;}
	
	.page_box .mobile>li>a.prev {background:url(/images/common/icon_page_prev.svg)center no-repeat;}
	.page_box .mobile>li>a.next {background:url(/images/common/icon_page_next.svg)center no-repeat;}
	
	.page_box .btn.write {width:auto; padding:10px 20px;}
	.page_box .btn.write:hover {background-color:#000;}
	
	/*컨텐츠*/
	.contents {padding:30px;}
	
	/* lnb */
	.sub-visual {height:auto;}
	.sub-visual-wrap {padding:200px 30px 100px; height:100%; display:flex; justify-content:space-between; align-items:end;}
	.sub-visual-txt {}
	.sub-visual-txt h2 {color: #FFF;font-size:var(--fs40);font-weight: 700;line-height: normal;letter-spacing: -1.2px;}
	
	/* .lnbH {height:70px;} */
	.lnb {
		position:absolute; top:400px; left:0; width:100%; height:100px; background:#fff; border-bottom:1px solid var(--border1);
		border-top: 1px solid rgba(255, 255, 255, 0.15); background: rgba(0, 0, 0, 0.10); backdrop-filter: blur(10px);
	}	
	.lnb.fixOn {position:fixed; top:0;z-index:1000;box-shadow: rgba(0, 0, 0, 0.05) 0px 10px 20px -3px, rgba(0, 0, 0, 0.05) 0px 4px 8px -2px;}
	
	.lnb-wrap {height:100%; display:flex; justify-content:space-between; align-items:center; position:relative;}
	.lnb-wrap h2 {
		padding-right:100px; color:var(--c_base2); background:url(/images/common/icon_lnb_tit.svg)calc(100% - 50px) 0 no-repeat;
		color: var(--c_base2);font-size:var(--fs18);font-weight: 600; line-height:70px; 
	}
	.lnb-menu {height:50px;}
	.lnb-menu ul {display:flex; gap:42px;height:100%; align-items:center;}
	.lnb-menu ul li {height:100%; display:flex; align-items:center; border-bottom:3px solid transparent;}
	.lnb-menu ul li a {color:#fff; font-size:var(--fs18);font-weight: 600;line-height: 100%;}
	.lnb-menu ul li.bar {width: 1px; height: 19px; background:var(--border1);}
	.lnb-menu ul li.on {border-color:var(--c_base1);}
	
	.lnb-nav {display:flex; gap:10px; align-items:center;}
	.lnb-nav p {color: #FFF; font-size:var(--fs14); line-height: normal;}
	.lnb-nav p.dot {width: 3px; height: 3px; background:#fff; border-radius:50%; }
	
	.site-route-wrap {padding:80px 30px 0 30px;}
	
}

/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
	
	body {}
	
	.sub-visual-wrap {padding:160px 20px 50px;}
	
	.contents {padding:40px 20px;}
	
}

/* ************************ 모바일 (0~500) ************************ */
@media screen and (max-width:500px) {
	
	
	
	
}