/* 공통 */
.subTit {font-size:24px !important; color:#000; margin-bottom:20px;}
.tab {display:flex;}
.tab li {width:10%; padding:2px; text-align:center;}
.tab li a {display:block; color:#999; border:1px solid #999; background:#f7f7f7; padding:12px 13px; font-size:15px;}
.tab li.on a {color:#000; border:1px solid #000; background:#fff;}

/* 테이블 */
.tb_basic {width:100%;}
.tb_basic thead th {text-align:left; font-size:16px; color:#000; font-weight:500; transform:var(--text); border-bottom:1px solid #ddd; padding:15px 20px;}
.tb_basic tbody th {text-align:left; font-weight:400; color:#000; border-bottom:1px solid #ddd; padding:15px 20px; background:#f8f8f8; width:20%;}
.tb_basic tbody td {text-align:left; border-bottom:1px solid #ddd; padding:15px 20px;}
.tb_basic tbody td p {line-height:1.5; width:80%;}
.tb_basic tbody td p span {display:inline-block; font-weight:500; color:#000; transform:var(--text); position:relative; padding-left:10px;}
.tb_basic tbody td p span:before {position:absolute; content:''; display:block; width:3px; height:3px; background:#45a879; left:0; top:8px;}
.tb_basic tbody td .link {display:block; color:#000;}

.tb_basic.type2 tbody {}
.tb_basic.type2 tbody th {border-right:1px solid #e1e1e1;}
.tb_basic.type2 tbody td {}

@media screen and (max-width:768px){
	.list_common .view .inner {overflow-x:auto;}
	.tb_basic {min-width:700px;}
	.tb_basic thead tr {display:flex; flex-direction:column;}
	.tb_basic thead th {width:100%;}
	.tb_basic tbody tr {display:flex; flex-direction:column;}
	.tb_basic tbody th {width:100%; border-bottom:1px dotted #ddd;}
	.tb_basic tbody td {width:100%;}
}

/* intro - about SNI-MRC */
.about .subTit {margin-bottom:50px;}
.about .about-wrap {display:flex; gap:8%;}
.about .about-wrap .img {width:30%;}
.about .about-wrap .img img {box-shadow:0 10px 20px rgba(0,0,0,.15); max-width:100%;}
.about .about-wrap article {width:70%;}
.about .about-wrap article .top-txt {font-family:'NanumSquare'; font-size:24px; font-weight:700; transform:var(--text); color:#222; position:relative; padding:0 25px; line-height:1.4;}
.about .about-wrap article .top-txt:before {display:inline-block; position:absolute; left:-8px; top:-10px; content:''; background:url(../images/common/quote_left.png)no-repeat center; width:27px; height:24px;}
.about .about-wrap article .top-txt:after {display:inline-block; content:''; background:url(../images/common/quote_right.png)no-repeat center; width:27px; height:24px; margin-left:5px;}
.about .about-wrap article .top-txt span {color:var(--blue);}
.about .about-wrap article .top-txt+p {margin-top:20px;}
.about .about-wrap article p {line-height:1.7; color:#000;}
.about .about-wrap article .name {font-size:18px; font-weight:500; transform:var(--text); margin-top:20px;}

/* intro - contact */
.intro .contact {}
.intro .contact .map-txt {display:flex; margin-top:30px; gap:10px; justify-content:space-between;}
.intro .contact .map-txt article {display:flex; flex-direction:column; gap:20px;}
.intro .contact .map-txt h3 {font-family:'NanumSquare'; font-size:30px; font-weight:800; transform:var(--text); color:#3eb6a2; line-height:1.2;}
.intro .contact .map-txt ul {}
.intro .contact .map-txt ul li {display:grid; grid-template-columns:120px auto; color:#000; line-height:1.5;}
.intro .contact .map-txt ul li+li {margin-top:15px;}
.intro .contact .map-txt ul li span {font-weight:500; transform:var(--text);}
.intro .contact .map-txt ul li span img {margin-right:15px;}
.intro .contact .map-txt ul li a {color:#000;}
.intro .contact .map-txt .teacher {display:flex; gap:20px; justify-content:space-between; align-items:center; padding:20px; border:1px solid #dedede;} 
.intro .contact .map-txt .teacher img {width:140px; max-width:100%;}
.intro .contact .map-txt .teacher dl {}
.intro .contact .map-txt .teacher dl dt {font-size:18px; font-weight:500; transform:var(--text); color:#000;}
.intro .contact .map-txt .teacher dl dd {font-size:16px; color:#333; margin-top:10px;}
.intro .contact .map-txt .teacher dl dd b {color:#000; font-weight:500; transform:var(--text);}

/* research - group organization */
.organ .imgs {display:flex; justify-content:space-between; gap:30px;}
.organ .imgs img {max-width:50%;}
.organ .organization {margin-top:80px;}
.organ .organization img {max-width:100%;}

/* research - goals */
.goals div>img {max-width:100%;}
.goals div:nth-of-type(2) {margin-top:60px;}
.goals h3 {font-family:'NanumSquare'; font-size:24px; font-weight:700; color:#000; transform:var(--text); margin-top:50px; line-height:1.4; text-align:center;}
.goals h3 span {display:inline-block; position:relative; padding:0 25px;}
.goals h3 span:before {display:inline-block; position:absolute; left:-8px; top:-10px; font-family:'NEXON'; content:'“'; font-size:60px; color:#ccc;}
.goals h3 span:after {display:inline-block; position:absolute; right:-8px; top:-10px; font-family:'NEXON'; content:'”'; font-size:60px; color:#ccc;}
.goals h3 b {color:var(--blue);}


/* member - 공통 */
.member .member_common ul {display: flex; flex-wrap: wrap; justify-content: space-between;}
.member .member_common ul li {width:calc(50% - 15px); gap:30px; align-items:flex-start; min-height:245px; padding:25px; display:flex; border:1px solid #ddd; margin-bottom:30px; overflow:hidden; transition:.3s ease-in-out;}
.member .member_common ul li:hover {box-shadow:0 10px 25px rgba(0,0,0,.1);}
.member .member_common ul li .imgWrap {width:40%; height:auto; padding-right:0; border:1px solid #f5f5f5; overflow:hidden; aspect-ratio:1/1.4;}
.member .member_common ul li .imgWrap img {width:100%; height:100%; object-fit:cover;}
.member .member_common ul li .info {width:60%;}
.member .member_common ul li .info .name {position:relative; border-bottom:1px solid var(--line); padding-bottom:15px; margin-bottom:10px;}
.member .member_common ul li .info .name p {padding-left:0; margin-top:20px; font-size:15px;}
.member .member_common ul li .info h3 {font-size:22px; font-weight:500; color:#000; margin:5px 0; transform:var(--text);}
.member .member_common ul li .info h3 span {font-size:16px; font-weight:400; padding-left:5px;}
.member .member_common ul li .info h4 {display:grid; grid-template-columns:auto 1fr; gap:5px; align-items:center; color:var(--blue2); font-weight:500; font-size:16px; padding-top:15px; transform:rotate(0.3deg); margin-bottom:5px;}
.member .member_common ul li .info h4:before {content:''; display:inline-block; width:5px; height:1px; background:var(--blue2);}
.member .member_common ul li .info div p {padding-left:12px; line-height:1.4;}
.member .member_common ul li .info div p:empty,
.member .member_common ul li .info div p a:empty {display:block; height:22px;}
.member .member_common ul li .info .link_btn {padding-left:12px; margin-top:20px;}
.member .member_common ul li .info .link_btn>a {display:inline-block; background:#fff; color:#333; border:1px solid #999; padding:10px 20px; transition:.3s ease-in-out;}
.member .member_common ul li .info .link_btn .btn1 {margin-right:5px;}
.member .member_common ul li .info .link_btn>a:hover {color:#fff; background:var(--blue); border:1px solid var(--blue);}


/* list_common */
.list_common .board_info {font-size:13px; padding: 20px 0 10px 0;}
.list_common h3.year {font-size:24px; color:#000; font-weight:500; margin:20px 0 5px; padding:0;}
.list_common .inner {border-top:2px solid #333;}
.list_common .inner .list-wrap {position:relative; width:100%; display:grid; grid-template-columns:5% auto 77px; align-items:center; gap:20px; transition:.3s; border:1px solid var(--line); border-left:0; border-right:0; padding:25px 20px;}
.list_common .inner .list-wrap:hover {box-shadow: 0 15px 15px -20px rgb(0 0 0 / 20%) !important; transition: .3s;}
.list_common .inner .list-wrap+.list-wrap {border-top: 0;}
.list_common .inner .thum {width: 100%; max-width: 240px; padding: 4px; overflow: hidden; border: 1px solid var(--line);}
.list_common .inner .thum img {width:100%; object-fit:contain; transition:all .5s ease !important; -webkit-transition:all .5s ease !important; -moz-transition:all .5s ease !important;}
.list_common .inner .list-wrap:hover .thum img {transform:scale(1.1); transition:.5s;}
.list_common .inner .in-con h4 {
    font-size:18px; color:#222;
	font-weight:500;
    margin-bottom:12px; line-height:1.2;
    transform:rotate(0.03deg);
    -ms-word-break: keep-all;
    word-break:keep-all;
    height:auto;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    transition:all .5s ease !important; -webkit-transition:all .5s ease !important; -moz-transition:all .5s ease !important;
}
.list_common .inner .list-wrap:hover h4 {color: var(--blue); transition:.5s;}
.list_common .inner .in-con p {display: grid; grid-template-columns: auto 1fr; gap: 5px; max-height: 45px; overflow: hidden; line-height: 1.5; color: #666;}
.list_common .inner .in-con p span {color:#000; font-weight:500; transform:var(--text);}
.list_common .inner .in-con p span::before {display: inline-block; content: ""; width:3px; height:3px; background:#45a879; margin:0 5px 4px 0;}

.list_common .inner .in-con .sm-info {gap:20px;}
.list_common .inner .in-con .sm-info span {position:relative; color:#666; font-weight:400;}
.list_common .inner .in-con .sm-info span:last-of-type:before {display:block; content: ""; position:absolute; width:1px; height:15px; top:3px; left:-10px; background:#ccc;}

.list_common .inner .current {
    display: inline-block;
    width: 100%;
    max-width: 95px;
    font-size: 13px;
    padding: 10px 0;
    text-align: center;
    background: #f0f0f0;
    color: #8b93a1;
    transition: .3s;
    border-radius: 100px !important;
    font-weight: 600;
}
.list_common .inner .completed {
    display: inline-block;
    width: 100%;
    max-width: 95px;
    font-size: 13px;
    padding: 10px 0;
    text-align: center;
    background: var(--blue);
    color: #fff;
    transition: .3s;
    border-radius: 100px !important;
    font-weight: 600;
}

.list_common .inner .in-con div {margin-bottom: 5px; font-size: 14px; color: #666;}
.list_common .inner .number {font-size:14px; font-weight:500; color:#999; text-align:center;}
.list_common .inner .list-wrap .link-btn {position:absolute; top:20px; right:20px; padding:10px 20px; background:#fff; font-size:14px; color:#666; border:1px solid #999; transition:.2s;}
.list_common .inner .list-wrap:hover .link-btn {border:1px solid transparent; color:#fff; background:var(--blue2);}

/* list_common - view */
.list_common .view .inner .in-con p {max-height: 100%;}
.list_common .view .inner .list-wrap {grid-template-columns: 1fr 95px;}
.list_common .view .inner .in-con h4 {-webkit-line-clamp: 999999;}
.list_common .view .inner .list-wrap:hover {box-shadow:none !important;}

.list_common .view .btnBox {display: flex; justify-content: center; margin-top:20px;}
.list_common .view .btnBox a {display: inline-block; padding: 15px 40px; border-radius: 100px !important; border: 1px solid #aaa;}
.list_common .view .btnBox a:hover {box-shadow: rgba(136, 165, 191, 0.2) 6px 2px 16px 0px, rgba(255, 255, 255, 0.4) -6px -2px 16px 0px !important;}

.list_common .view .viewConBox {padding: 30px 0; border-bottom: 1px solid var(--line);}

.prevNextWrap {margin-top: 20px;}
.prevNextWrap div>* {display:inline-block; color: var(--base);}
.prevNextWrap>div {display: grid; grid-template-columns: auto auto 2fr; align-items: center; gap: 10px;}
.prevNextWrap i {margin-top:-5px; width:40px; height:40px; border-radius:50% !important; background-color:#fff; border:1px solid #e5e5e5; background-position:50%; background-repeat:no-repeat;}
.prevNextWrap i.prev {background-image:url(../images/common/board_prev.png)}
.prevNextWrap i.next {background-image:url(../images/common/board_next.png)}
.prevNextWrap .split {word-break: keep-all;
    height: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical; white-space: pre-wrap;}

/* performance-공용 */
.performance .inner {border:1px solid #000; border-left:0; border-right:0;}
.performance .inner a {display:flex; gap:25px; padding:20px 25px; border-bottom:1px solid #e5e5e5; align-items:center; transition:.4s;}
.performance .inner a:hover {background:#f8f8f8;}
.performance a .number {font-weight:500; color:#999; line-height:1; transition:.4s;}
.performance .inner a:hover .number {color:#000;}
.performance .inner a .title h3 {margin:5px 0 7px; font-size:19px; font-weight:500; transform:var(--text); line-height:1.2; color:var(--blue2); height:auto; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.performance .inner a .title .i-journal {font-size:15px; padding-left:25px; width:45%; background:url(../images/common/i-paper.png) no-repeat left center; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.performance .inner a .title .i-author {font-size:15px; padding-left:25px; background:url(../images/common/i-person.png) no-repeat left center;}
.performance .inner a .title span {color:#999; font-weight:500; padding-top:0px; display:inline-block;}
.performance .board_ebi .search_box .form-control::placeholder {color:#666;}

/* patent */
.patent .patentInner {margin-bottom:50px;}
.patent .patentInner .tit-year {font-size:24px; font-weight:500; transform:var(--text); color:#000; margin:10px 0 5px;}
.patent .patentInner ul {border-top:1px solid #000; border-bottom:1px solid #000;}
.patent .patentInner ul li {display:flex; gap:40px; padding:10px 20px; border-bottom:1px solid #e5e5e5; transition:.4s; align-items:center;}
.patent .patentInner ul li:hover {background:#f8f8f8;}
.patent .patentInner ul li .number {font-weight:500; color:#999; transition:.4s;}
.patent .patentInner ul li:hover .number {color:#000;}
.patent .patentInner .inner {width:100%; border:0;}
.patent .patentInner ul li .date {font-size:14px; color:#999; font-weight:500;}
.patent .patentInner ul li .title {margin:5px 0 7px; font-size:19px; font-weight:500; line-height:1.2; color:var(--blue2); transform:var(--text); height:auto; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.patent .patentInner ul li .info-in {display:flex; gap:30px;}
.patent .patentInner ul li .inventor {width:100%; max-width:175px; height:auto; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; font-size:15px; background:url(../images/common/i-person.png) no-repeat left center; padding-left:20px;}
.patent .patentInner ul li .app {position:relative; padding-left:12px; font-size:14px;}
.patent .patentInner ul li .app:before {position:absolute; top:10px; left:-1px; content:""; width:5px; height:2px; background:#7c7c7c;}
.patent .patentInner ul li .app span {position:relative; padding-left:20px;}
.patent .patentInner ul li .app span:before {position: absolute; top: 3px; left: 8px; content: ""; width: 2px; height: 12px; background: #d9d9d9;}

/* conference */
.performance .conference .inner a .title {width:100%;}
.performance .conference .inner a .title h3 {height:auto; padding-bottom:0;}
.performance .conference .inner a .title div {width:100%; display:flex; gap:0px; justify-content:space-between;}
.performance .conference .inner a .title .i-author {width:100%; max-width:271px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.performance .conference .inner a .title .confer-r {display:flex; align-items:center; width:13%; justify-content:flex-end;}

.performance .conference .inner a .title span {position:relative; padding-left:20px; font-size:14px;}
.performance .conference .inner a .title span:first-of-type {padding-left:0;}
.performance .conference .inner a .title span:before {position:absolute; content:''; display:block; top:5px; left:8px; width:2px; height:12px; background:#d9d9d9;}
.performance .conference .inner a .title span:first-of-type:before {display:none;}


/* ************************ 태블릿 (~991) ************************ */
@media (max-width: 991px) {
	/* 공통 */
	.subTit {font-size:21px !important; margin-bottom:15px;}
	.tab li {width:20%;}
	
    /* intro - contact */
	.intro .contact .map-txt {flex-direction:column; gap:30px;}
	.intro .contact .map-txt h3 {font-size:24px; line-height:1.5;}
	.intro .contact .map-txt .teacher {width:100%; gap:30px; justify-content:flex-start;}
	.intro .contact .map-txt .teacher img {width:30%; max-width:150px;}

	/* research - goals */
	.goals div {text-align:center;}
	.goals h3 {font-size:20px;}

	/* member - 공통 */
    .member .member_common ul li {width:100%;}
    .member .member_common ul li:last-child {margin-bottom:0;}

	/* list_common */
	.list_common h3.year {font-size:21px;}
    .list_common .inner .thum {max-width: 100%;}
    .list_common .inner .list-wrap {grid-template-columns:auto; gap: 10px; padding: 20px 10px;}
    .list_common .inner .current {order: -1;}
    .list_common .inner .completed {order: -1;}
	.list_common .inner .in-con h4 {font-size:16px;}
    .list_common .inner .in-con p {width: 100%; display: inline-block; max-height: 65px;}

    .list_common .inner .number {display: none;}
	.list_common .inner .list-wrap .link-btn {position:static; width:100px; text-align:center;}

    /* list_common - view */
    .list_common .view .inner .list-wrap {grid-template-columns: auto;}
	.list_common .inner .in-con .sm-info span:first-of-type {padding-right:20px;}

    .prevNextWrap>div {gap: 5px;}

	/* patent */
	.patent .patentInner ul li .info-in {flex-direction:column; gap:5px;}
	.patent .patentInner ul li .inventor {margin-bottom:0;}
	.patent .patentInner ul li .inventor, .patent .patentInner ul li .app {max-width:100%;}
	.patent .patentInner ul li .app {margin-left:0; padding-left:0; line-height:1.5;}
	.patent .patentInner ul li .app:before {display:none;}
	.patent .patentInner ul li .app span {display:block; padding-left:0;}
	.patent .patentInner ul li .app span:before {display:none;}
	
	/* conference */
	.performance .conference .inner a .title div {flex-direction:column; line-height:1.6;}
	.performance .conference .inner a .title .confer-r {justify-content:flex-start;}
	.performance .inner a .title .i-journal {width:100%;}
	
	
}

/* ************************ 모바일 (~767) ************************ */
@media (max-width: 767px) {

	.tab li {width:25%;}
	.tab li a {font-size:15px;}
	
	/* intro - about SNI-MRC */
	.about .subTit {margin-bottom:30px;}
	.about .about-wrap {gap:30px; flex-direction:column-reverse; margin-bottom:30px;}
	.about .about-wrap .img {width:100%; text-align:center;}
	.about .about-wrap article {width:100%;}
	.about .about-wrap article .top-txt {font-size:22px; padding:0 20px;}
	.about .about-wrap article .top-txt:before {left:-5px; top:-10px; height:18px; background-size:contain;}
	.about .about-wrap article .top-txt:after {height:18px; background-size:contain;}
	.about .about-wrap article .top-txt+p {margin-top:15px;}
	.about .about-wrap article p {font-size:15px;}
	.about .about-wrap article .name {font-size:17px; margin-top:15px;}
	
    /* intro - contact */
	.intro .contact .map-txt {margin-top:20px; gap:15px; flex-direction:column;}
	.intro .contact .map-txt h3 {font-size:22px; line-height:1.4;}
	.intro .contact .map-txt ul li {font-size:15px; grid-template-columns:repeat(1,1fr); gap:8px;}
	.intro .contact .map-txt ul li span img {margin-right:10px; height:18px;}
	.intro .contact .map-txt .teacher dl dt {font-size:16px;}
	.intro .contact .map-txt .teacher dl dd {font-size:14px; margin-top:5px;}
	
	/* research - group organization */
	.organ .imgs {flex-direction:column; gap:30px;}
	.organ .imgs img {max-width:100%;}
	.organ .organization {margin-top:50px;}
	
	/* research - goals */
	.goals div:nth-of-type(2) {margin-top:30px;}
	.goals h3 {font-size:18px; margin-top:30px;}
	.goals h3 span {padding:0 20px;}
	.goals h3 span:before {left:-5px; top:-10px; font-size:40px;}
	.goals h3 span:after {right:5px; top:-10px; font-size:40px;}
	
    /* member - 공통 */
    .member .member_common ul {flex-direction:column;}
    .member .member_common ul li {flex-direction:column; gap:10px;}
    .member .member_common ul li .imgWrap {max-width: 145px;}
	.member .member_common ul li .info {width:100%;}
    .member .member_common ul li .info h3 {margin: 0;}
	.member .member_common ul li .info .name {display:grid; grid-template-columns:1fr; gap:8px;}
    .member .member_common ul li .info .name p {padding-left:0; order:-1;}
	.member .member_common ul li .info .link_btn>a {font-size:15px;}

	/* patent */
	.patent .patentInner ul li {padding:10px 0;}
	.patent .patentInner ul li .title {font-size:18px; padding-top:5px; margin-bottom:10px;}
	
	/* conference */
    .performance .inner a {flex-direction:column; gap:10px; padding:20px 0;}
	.performance a .number {display:none;}
	.performance .board_ebi .search_box .search {top:80px;}
	
}