@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Kanit:300,400,500,600,700');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700');
@import url('https://fonts.googleapis.com/css?family=Titillium+Web:300,400,600,700');
@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700,900&display=swap');

/*
font-family: 'Nanum Gothic', sans-serif;
font-family: 'Noto Sans KR', sans-serif;
font-family: 'Kanit', sans-serif;
font-family: 'Montserrat', sans-serif;
font-family: 'Titillium Web', sans-serif;
font-family: 'Roboto', sans-serif;
*/

/* 공통 */
div.wrapper{overflow-x:hidden; font-family:'Noto Sans KR'}
@media screen and (max-width:1280px){
	#gnb{background-image:linear-gradient(45deg,#0067b2,#000170)}
}
@media screen and (min-width:1281px){
	#top > .topBtn.login{margin:0}
	#top a.btn.register{display:none; background-image:linear-gradient(90deg,#0067b2,#000170) !important}
	#top a.btn.register:hover{background-image:linear-gradient(90deg,#0094ff,#0002ff) !important}
	#header h1.logo{width:248px}
	#lnb{display:none}
}
@media screen and (min-width:1281px) and (max-width:1399px){
	#gnb ul.gnb > li.depth0{width:140px}
}
@media screen and (min-width:1400px) and (max-width:1599px){
	#gnb ul.gnb > li.depth0{width:160px}
}
@media screen and (min-width:1600px) and (max-width:1679px){
	#gnb ul.gnb > li.depth0{width:180px}
}
@media screen and (min-width:1680px) and (max-width:1919px){
	#gnb ul.gnb > li.depth0{width:200px}
}
@media screen and (min-width:1920px) and (max-width:2559px){
	#gnb ul.gnb > li.depth0{width:220px}
}
@media screen and (min-width:2560px){
	#gnb ul.gnb > li.depth0{width:240px}
}
/* 공통 */

/* 메인페이지(main) */
div.mainLink{position:relative; background-color:#002255; color:#fff}
ul.mainLink{position:relative; display:flex; flex-wrap:nowrap; text-align:center}
ul.mainLink > li{position:relative; width:20%}
ul.mainLink > li:before{content:''; position:absolute; top:0; right:0; bottom:0; left:0; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -o-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out}
ul.mainLink > li:hover:before{background-color:rgba(0,0,0,.3)}
ul.mainLink > li a{position:relative; display:block; width:100%; height:100%}
ul.mainLink > li svg{position:relative; display:block; width:100%; height:100%; fill:#00abe1}
ul.mainLink > li div.txt{position:relative; font-weight:300; color:#fff}
@media screen and (max-width:1280px){
	ul.mainLink > li a{padding:16px 0}
	ul.mainLink > li div.ico{max-width:90px; padding:0 18px; margin:auto; box-sizing:border-box}
	ul.mainLink > li svg{width:100%; height:100%}
	ul.mainLink > li div.txt{padding:8px 0 0 0; font-size:13px}
}
@media screen and (min-width:1281px){
	ul.mainLink > li a{padding:20px 0}
	ul.mainLink > li div.ico{padding:0 94px}
	ul.mainLink > li svg{width:52px; height:52px}
	ul.mainLink > li div.txt{padding:12px 0 0 0; font-size:16px}
}

div.mainSect{position:relative}
div.mainSect.sect0{background-color:#fff}
div.mainSect div.research{position:relative}
div.mainSect div.header{display:flex; align-items:center; box-sizing:border-box; background-image:linear-gradient(45deg,#0067b2,#000170); color:#fff}
div.mainSect div.header h2{font-weight:300}
div.mainSect div.header div.btns{position:absolute; display:flex; align-items:center}
div.mainSect div.header button.fa{border-style:solid; border-color:#fff; color:#fff}
div.mainSect div.header button.fa:hover{background-color:#000}
div.mainSect div.header button.fa-angle-left{border-width:1px 0 1px 1px}
div.mainSect div.header button.fa-angle-right{border-width:1px}
div.mainSect ul.research{display:flex; flex-wrap:nowrap; flex-direction:row; will-change:transform}
div.mainSect ul.research > li{position:relative; flex:none; width:100%; background-color:#fff}
div.mainSect ul.research > li.swiper-slide-active{z-index:2}
div.mainSect ul.research > li div.txt{position:relative; z-index:2; display:flex; flex-direction:column; justify-content:center; box-sizing:border-box}
div.mainSect ul.research > li div.txt span.no{position:absolute; line-height:0.9em; color:#ddd; font-weight:900}
div.mainSect ul.research > li div.txt div.desc{font-weight:300; color:#666}
div.mainSect ul.research > li a.view{display:block; border-style:solid; border-color:#353d5e; color:#353d5e; text-align:center; font-weight:300; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -o-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out}
div.mainSect ul.research > li a.view:hover{background-color:#353d5e; color:#fff}
div.mainSect ul.research > li div.img{box-sizing:border-box; background-position:50% 50%; background-repeat:no-repeat; background-size:cover}
@media screen and (max-width:1280px){
	div.mainSect.sect0{padding:30px 10px}
	div.mainSect div.header{position:relative; height:50px; padding:0 0 0 12px}
	div.mainSect div.header h2{font-size:24px}
	div.mainSect div.header div.btns{top:6px; right:6px}
	div.mainSect div.header button.fa{width:38px; height:38px; font-size:16px}
	div.mainSect ul.research > li{border-width:0 1px 1px 1px; border-style:solid; border-color:rgba(0,0,0,.2); box-sizing:border-box}
	div.mainSect ul.research > li div.txt{padding:20px}
	div.mainSect ul.research > li div.txt span.no{top:0; left:20px; font-size:100px}
	div.mainSect ul.research > li div.txt div.text{position:relative; z-index:2}
	div.mainSect ul.research > li div.txt h3.title{font-size:20px; color:#222; font-weight:900; line-height:1em}
	div.mainSect ul.research > li div.txt div.desc{margin:20px 0 0 0; font-size:14px; color:#666}
	div.mainSect ul.research > li a.view{width:100px; padding:10px 0; border-width:1px; margin:20px 0 0 0; font-size:14px}
	div.mainSect ul.research > li div.img{position:absolute; right:20px; bottom:20px; width:140px; height:140px; opacity:0.2}
}
@media screen and (min-width:1281px){
	div.mainSect{padding:60px 0}
	div.mainSect div.header{position:absolute; z-index:3; top:0; right:0; width:468px; height:70px; padding:0 0 0 20px}
	div.mainSect div.header h2{font-size:30px}
	div.mainSect div.header div.btns{top:13px; right:13px}
	div.mainSect div.header button.fa{width:44px; height:44px; font-size:28px}
	div.mainSect ul.research > li{display:flex; flex-wrap:nowrap}
	div.mainSect ul.research > li div.txt{width:calc(100% - 468px); padding:0 50px 0 0}
	div.mainSect ul.research > li div.txt span.no{top:0; left:0; font-size:220px}
	div.mainSect ul.research > li div.txt div.text{position:relative; z-index:2}
	div.mainSect ul.research > li div.txt h3.title{font-size:50px; color:#222; font-weight:900; line-height:1em}
	div.mainSect ul.research > li div.txt div.desc{margin:30px 0 0 0; font-size:18px; color:#666}
	div.mainSect ul.research > li a.view{width:300px; padding:14px 0; border-width:1px; margin:36px 0 0 0; font-size:16px}
	div.mainSect ul.research > li div.img{position:relative; width:468px; height:398px; border-width:0 1px 1px 1px; border-style:solid; border-color:rgba(0,0,0,.2); margin:70px 0 0 0}
}

div.mainSect.sect1{position:relative; display:flex}
div.mainSect.sect1 div.img{box-sizing:border-box; background-position:50% 50%; background-repeat:no-repeat; background-size:cover}
div.mainSect.sect1 p.sub{color:#3f51b5; font-weight:900}
div.mainSect.sect1 h2{font-weight:500; color:#222}
div.mainSect.sect1 div.txt div.desc{font-weight:300; color:#666}
div.mainSect.sect1 div.txt div.desc p:last-child{margin:0}
div.mainSect.sect1 a.view{display:block; border:1px solid #353d5e; color:#353d5e; text-align:center; font-weight:300; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -o-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out}
div.mainSect.sect1 a.view:hover{background-color:#353d5e; color:#fff}
@media screen and (max-width:1280px){
	div.mainSect.sect1{flex-direction:column; padding:30px 10px}
	div.mainSect.sect1 div.img:before{content:''; display:block; padding:30% 0}
	div.mainSect.sect1 div.text{padding:20px 0 0 0}
	div.mainSect.sect1 p.sub{margin:0 0 12px 0; font-size:16px}
	div.mainSect.sect1 h2{font-size:20px}
	div.mainSect.sect1 div.txt div.desc{margin:12px 0 0 0; font-size:13px}
	div.mainSect.sect1 div.txt div.desc p{margin:0 0 5px 0}
	div.mainSect.sect1 a.view{padding:10px 0; margin:12px 0 0 0; font-size:14px}
}
@media screen and (min-width:1281px){
	div.mainSect.sect1{padding:0} /* img:42, text:58 */
	div.mainSect.sect1 div.imgW{position:relative; width:40%}
	div.mainSect.sect1 div.img{position:absolute; top:0; right:0; bottom:0; left:0}
	div.mainSect.sect1 div.text{width:60%}
	div.mainSect.sect1 div.txt{width:calc(100% - 50vw + 600px); padding:80px 0 80px 80px; box-sizing:border-box}
	div.mainSect.sect1 p.sub{margin:0 0 20px 0; font-size:20px; color:#3f51b5; font-weight:900}
	div.mainSect.sect1 h2{font-size:26px; font-weight:500; color:#222}
	div.mainSect.sect1 div.txt div.desc{margin:30px 0 0 0; font-size:18px}
	div.mainSect.sect1 div.txt div.desc p{margin:0 0 8px 0}
	div.mainSect.sect1 a.view{width:300px; padding:14px 0; margin:36px 0 0 0; font-size:16px}
}

div.mainSect.sect2{background-color:#fff}
div.mainSect.sect2 h2.title{color:#222; font-family:'Titillium Web', sans-serif; font-weight:700; text-align:center}
#mainNotice{position:relative; display:flex}
#mainNotice > li a{position:relative; display:block; -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -o-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out}
#mainNotice > li a:hover{box-shadow:0 0 12px 4px rgba(0,0,0,.1)}
#mainNotice > li div.mask{border-color:rgba(0,0,0,.1); -webkit-transition:all 0.45s ease-in-out; -moz-transition:all 0.45s ease-in-out; -o-transition:all 0.45s ease-in-out; -ms-transition:all 0.45s ease-in-out; transition:all 0.45s ease-in-out}
#mainNotice > li a:hover div.mask{border-color:#3f51b5}
#mainNotice > li div.img{overflow:hidden}
#mainNotice > li div.thumb{height:100%; background-position:50% 50%; background-repeat:no-repeat; background-size:cover; -webkit-transition:all 0.6s cubic-bezier(.5,.24,0,1); transition:all 0.6s cubic-bezier(.5,.24,0,1)}
#mainNotice > li a:hover div.thumb{-webkit-transform:scale(1.2); transform:scale(1.2)}
#mainNotice > li div.date{color:#b2b1b1}
#mainNotice > li div.cate{font-weight:500; color:#3f51b5}
#mainNotice > li div.title{overflow:hidden; font-weight:500; color:#222}
#mainNotice > li div.desc{overflow:hidden; font-weight:300; color:#666}
@media screen and (max-width:320px){
	#mainNotice{flex-direction:column; flex-wrap:wrap}
	#mainNotice > li{width:100%; margin:0 0 10px 0}
	#mainNotice > li:last-child{margin:0}
	#mainNotice > li div.desc{height:32px}
}
@media screen and (min-width:321px) and (max-width:360px){
	#mainNotice{flex-direction:column; flex-wrap:wrap}
	#mainNotice > li{width:100%; margin:0 0 10px 0}
	#mainNotice > li:last-child{margin:0}
	#mainNotice > li div.desc{height:32px}
}
@media screen and (min-width:361px) and (max-width:428px){
	#mainNotice{flex-direction:column; flex-wrap:wrap}
	#mainNotice > li{width:100%; margin:0 0 10px 0}
	#mainNotice > li:last-child{margin:0}
	#mainNotice > li div.desc{height:32px}
}
@media screen and (min-width:429px) and (max-width:767px){
	#mainNotice{flex-direction:column; flex-wrap:wrap}
	#mainNotice > li{width:100%; margin:0 0 10px 0}
	#mainNotice > li:last-child{margin:0}
	#mainNotice > li div.desc{height:32px}
}
@media screen and (min-width:768px) and (max-width:1024px){
	#mainNotice{flex-wrap:nowrap}
	#mainNotice > li{width:calc(100% / 3)}
	#mainNotice > li.thumb div.desc{height:32px}
	#mainNotice > li.thumbNo div.desc{height:192px}
}
@media screen and (min-width:1025px) and (max-width:1280px){
	#mainNotice{flex-wrap:nowrap}
	#mainNotice > li{width:calc(100% / 3)}
	#mainNotice > li.thumb div.desc{height:32px}
	#mainNotice > li.thumbNo div.desc{height:192px}
}
@media screen and (max-width:1280px){
	div.mainSect.sect2{padding:30px 10px}
	div.mainSect.sect2 h2.title{margin:0 0 20px 0; font-size:22px}
	#mainNotice{left:-5px; width:calc(100% + 10px)}
	#mainNotice > li{padding:0 5px}
	#mainNotice > li div.img{height:160px}
	#mainNotice > li div.txt{padding:8px}
	#mainNotice > li div.date{font-size:13px}
	#mainNotice > li div.cate{margin:8px 0 0 0; font-size:14px}
	#mainNotice > li div.title{height:38px; margin:6px 0 0 0; line-height:19px; font-size:15px}
	#mainNotice > li div.desc{margin:8px 0 0 0; line-height:16px; font-size:12px}
}
@media screen and (min-width:1281px){
	div.mainSect.sect2 h2.title{margin:0 0 30px 0; font-size:40px}
	#mainNotice{left:-15px; width:calc(100% + 30px)}
	#mainNotice > li{width:calc(100% / 3); padding:0 15px}
	#mainNotice > li div.img{height:240px}
	#mainNotice > li div.txt{padding:30px}
	#mainNotice > li div.date{font-size:14px}
	#mainNotice > li div.cate{margin:16px 0 0 0; font-size:14px}
	#mainNotice > li div.title{height:52px; margin:10px 0 0 0; line-height:26px; font-size:18px}
	#mainNotice > li div.desc{margin:16px 0 0 0; line-height:20px; font-size:14px}
	#mainNotice > li.thumb div.desc{height:40px}
	#mainNotice > li.thumbNo div.desc{height:280px}
}
/* 메인페이지(main) */

/* 인사말(Greet) */
#contents.about{position:relative; background-color:#fff; font-weight:300}
#contents.about div.sect:nth-child(2){border-top:1px dashed #3f51b5}
#contents.about div.sect p{color:#444}
#contents.about div.sect p.greet{color:#3f51b5}
#contents.about div.sect h1.title{color:#3f51b5; font-weight:300}
#contents.about div.sect h2{color:#3f51b5; font-weight:300}
#contents.about div.sect p:last-child{margin:0}
#contents.about div.sect p.adrKor{color:#000}
#contents.about div.sect p.adrEng{color:#777}
#contents.about ul.about > li{position:relative; color:#444}
#contents.about ul.about > li:before{content:''; position:absolute; left:0; background-color:#0077ff; border-radius:50%}
@media screen and (max-width:1280px){
	#contents.about{padding:20px 10px; font-size:13px}
	#contents.about div.sect:nth-child(2){padding:20px 0 0 0; margin:20px 0 0 0}
	#contents.about div.sect.contact{margin:20px 0 0 0}
	#contents.about div.sect p.greet{font-size:15px}
	#contents.about div.sect h1.title{margin:0 0 10px 0; font-size:20px}
	#contents.about div.sect h2{margin:0 0 10px 0; font-size:20px}
	#contents.about div.sect p{margin:0 0 8px 0}
	#contents.about ul.about{padding:0 0 0 8px}
	#contents.about ul.about > li{line-height:20px; text-indent:10px}
	#contents.about ul.about > li:before{top:8px; width:4px; height:4px}
	#contents.about #map{height:300px}
}
@media screen and (min-width:1281px){
	#contents.about{padding:60px 0; font-size:19px}
	#contents.about div.sect:nth-child(2){padding:30px 0 0 0; margin:30px 0 0 0}
	#contents.about div.sect.contact{margin:30px 0 0 0}
	#contents.about div.sect p.greet{font-size:26px}
	#contents.about div.sect h1.title{margin:0 0 40px 0; font-size:32px}
	#contents.about div.sect h2{margin:0 0 10px 0; font-size:32px}
	#contents.about div.sect p{margin:0 0 10px 0}
	#contents.about ul.about{padding:0 0 0 10px}
	#contents.about ul.about > li{line-height:28px; text-indent:12px}
	#contents.about ul.about > li:before{top:11px; width:6px; height:6px}
	#contents.about #map{height:500px}
}
/* 인사말(Greet) */

/* 프로젝트 상세(projectView) */
@media screen and (max-width:1280px){
	#contents.projectView{padding:20px 10px}
}
@media screen and (min-width:1281px){
	#contents.projectView{padding:60px 0}
}
/* 프로젝트 상세(projectView) */

/* 장비현황(Facility) */
#contents.facility{position:relative}
#contents.facility ul.facility{position:relative; display:flex; flex-wrap:wrap}
#contents.facility ul.facility > li{box-sizing:border-box}
#contents.facility ul.facility > li div.box{background-color:#fff; box-shadow:2px 2px 12px rgba(0,0,0,.1)}
#contents.facility ul.facility > li div.title{display:flex; flex-direction:column; justify-content:center}
#contents.facility ul.facility > li h3.kor{font-weight:500}
#contents.facility ul.facility > li h3.eng{color:#555; font-weight:300}
#contents.facility ul.facility > li div.img{position:relative; background-color:#000}
#contents.facility ul.facility > li div.img:before{content:''; display:block; padding:50% 0}
#contents.facility ul.facility > li div.img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); max-width:100%; max-height:100%}
#contents.facility ul.facility > li div.desc{height:11em; overflow-y:auto; background-color:#f8f8f8; font-weight:300}
#contents.facility ul.facility > li div.desc div.sub{margin:0 0 0.4em 0}
#contents.facility ul.facility > li div.desc div.sub:last-child{margin:0}
#contents.facility ul.facility > li div.desc p{position:relative; margin:0 0 0.4em 0; font-size:1em; line-height:1.5em; text-indent:0.8em}
#contents.facility ul.facility > li div.desc p.d1{margin:0 0 0.26em 0; text-indent:1.2em}
#contents.facility ul.facility > li div.desc p:last-child{margin:0}
#contents.facility ul.facility > li div.desc p:before{content:''; position:absolute; top:0.55em; left:0; width:0.4em; height:0.4em; border-radius:50%; background-color:#0077ff}
#contents.facility ul.facility > li div.desc p.d1:before{top:0.68em; left:0.4em; width:0.4em; height:0.14em; border-radius:0}
@media screen and (max-width:320px){
	#contents.facility{font-size:12px}
	#contents.facility ul.facility > li{width:100%}
	#contents.facility ul.facility > li:last-child{margin:0}
}
@media screen and (min-width:321px) and (max-width:360px){
	#contents.facility{font-size:12px}
	#contents.facility ul.facility > li{width:100%}
	#contents.facility ul.facility > li:last-child{margin:0}
}
@media screen and (min-width:361px) and (max-width:428px){
	#contents.facility{font-size:13px}
	#contents.facility ul.facility > li{width:50%}
	#contents.facility ul.facility > li:nth-child(2n+1):nth-last-child(-n+2), #contents.facility ul.facility > li:nth-child(2n+1):nth-last-child(-n+2) ~ li{margin-bottom:0}
}
@media screen and (min-width:429px) and (max-width:767px){
	#contents.facility{font-size:14px}
	#contents.facility ul.facility > li{width:calc(100% / 3)}
	#contents.facility ul.facility > li:nth-child(3n+1):nth-last-child(-n+3), #contents.facility ul.facility > li:nth-child(3n+1):nth-last-child(-n+3) ~ li{margin-bottom:0}
}
@media screen and (min-width:768px) and (max-width:1024px){
	#contents.facility{font-size:14px}
	#contents.facility ul.facility > li{width:25%}
	#contents.facility ul.facility > li:nth-child(4n+1):nth-last-child(-n+4), #contents.facility ul.facility > li:nth-child(4n+1):nth-last-child(-n+4) ~ li{margin-bottom:0}
}
@media screen and (min-width:1025px) and (max-width:1280px){
	#contents.facility{font-size:15px}
	#contents.facility ul.facility > li{width:25%}
	#contents.facility ul.facility > li:nth-child(4n+1):nth-last-child(-n+4), #contents.facility ul.facility > li:nth-child(4n+1):nth-last-child(-n+4) ~ li{margin-bottom:0}
}
@media screen and (max-width:1280px){
	#contents.facility{padding:20px 10px}
	#contents.facility ul.facility{left:-5px; width:calc(100% + 10px)}
	#contents.facility ul.facility > li{padding:0 5px; margin:0 0 10px 0}
	#contents.facility ul.facility > li div.title{height:6.16em; padding:8px}
	#contents.facility ul.facility > li h3{font-size:1.1em; line-height:1.4em}
	#contents.facility ul.facility > li div.desc{padding:8px}
}
@media screen and (min-width:1281px){
	#contents.facility{padding:60px 0; font-size:15px}
	#contents.facility ul.facility{left:-10px; width:calc(100% + 20px)}
	#contents.facility ul.facility > li{width:25%; padding:0 10px; margin:0 0 20px 0}
	#contents.facility ul.facility > li:nth-child(4n+1):nth-last-child(-n+4), #contents.facility ul.facility > li:nth-child(4n+1):nth-last-child(-n+4) ~ li{margin-bottom:0}
	#contents.facility ul.facility > li div.title{height:78px; padding:10px}
	#contents.facility ul.facility > li h3{font-size:18px}
	#contents.facility ul.facility > li div.desc{padding:10px}
}
/* 장비현황(Facility) */

/* 소프트웨어(Software) */
#contents.software{position:relative}
#contents.software ul.software > li{display:flex; margin:0 0 1.4em 0; border-radius:0.4em; background-color:#fff; box-shadow:2px 2px 12px rgba(0,0,0,.1)}
#contents.software ul.software > li:last-child{margin:0}
#contents.software ul.software > li div.img{position:relative; box-sizing:border-box; overflow:hidden}
#contents.software ul.software > li div.img div.in{position:relative; width:100%; height:100%}
#contents.software ul.software > li div.img img{display:block; max-width:100%; max-height:100%}
#contents.software ul.software > li div.txt{padding:1em; box-sizing:border-box}
#contents.software ul.software > li div.txt h3{font-size:1.3em; font-weight:500}
#contents.software ul.software > li div.txt div.desc{margin:0.5em 0 0 0; font-size:1em; font-weight:300; color:#444}
@media screen and (max-width:1280px){
	#contents.software{padding:20px 10px; font-size:13px}
	@media (max-aspect-ratio: 1/1) {
		#contents.software ul.software > li{flex-direction:column; text-align:center}
		#contents.software ul.software > li div.img{display:flex; justify-content:center; align-items:center; padding:1em}
		#contents.software ul.software > li div.txt{padding:0 1em 1em 1em}
	}
	@media (min-aspect-ratio: 1/1) {
		#contents.software ul.software > li{align-items:stretch}
		#contents.software ul.software > li div.img{width:20%; padding:1em}
		#contents.software ul.software > li div.img img{position:absolute; left:-100%; right:-100%; top:-100%; bottom:-100%; margin:auto}
		#contents.software ul.software > li div.txt{width:80%; padding:1em}
	}
}
@media screen and (min-width:1281px){
	#contents.software{padding:60px 0; font-size:16px}
	#contents.software ul.software > li{align-items:stretch}
	#contents.software ul.software > li div.img{width:20%; padding:1em}
	#contents.software ul.software > li div.img img{position:absolute; left:-100%; right:-100%; top:-100%; bottom:-100%; margin:auto}
	#contents.software ul.software > li div.txt{width:80%; padding:1em}
}
/* 소프트웨어(Software) */

/* 연구분야(Research) */
#contents.research{position:relative; background-color:#fff; font-weight:300}
#contents.research h1.title{border-bottom:1px dashed #3f51b5; color:#3f51b5; font-weight:300}
#contents.research h2{font-weight:300}
#contents.research div.sect:last-child{margin:0}
#contents.research div.sect p{position:relative; color:#444}
#contents.research div.sect p:last-child{margin:0}
#contents.research div.sect p:before{content:''; position:absolute; left:0; background-color:#0077ff; border-radius:50%}
@media screen and (max-width:1280px){
	#contents.research{padding:20px 0; font-size:13px}
	#contents.research h1.title{padding:0 0 10px 0; margin:0 10px 10px 10px; font-size:20px}
	#contents.research h2{margin:0 0 8px 0; font-size:17px}
	#contents.research div.sect{padding:0 10px; margin:0 0 20px 0}
}
@media screen and (min-width:1281px){
	#contents.research{padding:60px 0; font-size:19px}
	#contents.research h1.title{padding:0 0 30px 0; margin:0 0 30px 0; font-size:36px}
	#contents.research h2{margin:0 0 16px 0; font-size:27px}
	#contents.research div.sect{margin:0 0 40px 0}
	#contents.research div.sect p{margin:0 0 10px 0; text-indent:12px}
	#contents.research div.sect p:before{top:11px; width:6px; height:6px}
	#contents.research div.sect img{display:block; max-width:100%; margin:auto}
}

#contents.research div.imgList{position:relative; overflow:hidden}
#contents.research ul.imgList{position:relative; z-index:1; display:flex; flex-wrap:wrap}
#contents.research ul.imgList > li{position:relative; display:flex; flex-shrink:0; justify-content:center; align-items:center; box-sizing:border-box}
#contents.research ul.imgList > li img{display:block; width:100%}
@media screen and (max-width:1280px){
	#contents.research div.sect.imgList{padding:0}
	#contents.research ul.imgList{left:-5px; width:calc(100% + 10px)}
	#contents.research ul.imgList > li{padding:0 5px}
	#contents.research ul.imgList.imgList1 > li{width:100%}
	#contents.research ul.imgList.imgList2 > li{width:50%}
	#contents.research ul.imgList.imgList3 > li{width:calc(100% / 3)}
	#contents.research ul.imgList.imgList4 > li{width:25%}
	#contents.research ul.imgList.imgList5 > li{width:20%}
}
@media screen and (min-width:1281px){
	#contents.research ul.imgList{left:-20px; width:calc(100% + 40px)}
	#contents.research ul.imgList > li{padding:0 20px}
	#contents.research ul.imgList.imgList1 > li{width:100%}
	#contents.research ul.imgList.imgList2 > li{width:50%}
	#contents.research ul.imgList.imgList3 > li{width:calc(100% / 3)}
	#contents.research ul.imgList.imgList4 > li{width:25%}
	#contents.research ul.imgList.imgList5 > li{width:20%}
}

div.diagram{display:flex; padding:3em 0; background-color:#eee; line-height:1.5em}
div.diagram div.col{width:50%}
div.diagram div.box{position:relative; height:1.5em; padding:1em 0; border-radius:0.4em; border:2px solid #0067b6; margin:0 auto 1.25em auto; background-color:#fff; text-align:center}
div.diagram div.box.proc{border-radius:0; border-color:#d9c300}
div.diagram div.box.box1{height:1.5em}
div.diagram div.box.box2{height:3em}
div.diagram div.box.box3{height:4.5em}
div.diagram div.box.blank{border-color:#eee; background-color:#eee}
div.diagram div.box:last-child{margin:0 auto}
div.diagram div.box div.txt{display:flex; flex-direction:column; justify-content:center; align-items:center}
div.diagram div.box div.down{position:absolute; z-index:2; left:50%; width:2px; margin:0 0 0 -1px; background-color:#ee7d02}
div.diagram div.box div.down11{bottom:-1.25em; height:calc(1.25em - 2px)}
div.diagram div.box div.down21{bottom:calc(-6em - 6px); height:calc(6em + 4px)} /* h:1.5; p:2; m:2.5; border4px */
div.diagram div.box div.down23{bottom:calc(-9em - 6px); height:calc(9em + 4px)} /* h:4.5; p:2; m:2.5; border4px */
div.diagram div.box div.down div.arrow-down{position:absolute; bottom:-1px; left:-7px; width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent; border-top:10px solid #ee7d02}
div.diagram div.box div.right{position:absolute; z-index:2; top:50%; left:calc(100% + 2px); height:calc(50% + 1px); border-top:2px solid #ee7d02; border-right:2px solid #ee7d02; margin:-1px 0 0 0}
div.diagram div.box div.left{position:absolute; z-index:2; top:50%; right:calc(100% + 2px); height:2px; margin:-1px 0 0 0; background-color:#ee7d02}
div.diagram div.box div.left div.arrow-left{position:absolute; top:-7px; left:-1px; width:0; height:0; border-top:8px solid transparent; border-bottom:8px solid transparent; border-right:10px solid #ee7d02}
div.diagram div.box div.return{position:absolute; z-index:2; bottom:calc(50% - 1px); right:calc(100% + 2px); display:flex; justify-content:center; align-items:flex-end; height:calc(50% + 1.25em + 1px); border-bottom:2px solid #ee7d02; border-left:2px solid #ee7d02}
div.diagram div.box div.return:after{content:''; position:absolute; top:-1px; left:-9px; width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent; border-bottom:10px solid #ee7d02}
@media screen and (max-width:1280px){
	#contents.research div.sect.diagramW{padding:0}
	div.diagram{font-size:11px}
	div.diagram div.box{width:80%; font-weight:300}
	div.diagram div.box div.right{width:calc(75% - 3px)}
	div.diagram div.box div.left{width:calc(75% - 3px)}
	div.diagram div.box div.return{width:calc(60% - 3px)}
	div.diagram div.box div.return div.desc{position:absolute; top:100%; left:-30px; right:6px; font-size:10px; letter-spacing:-1px; text-align:right}
}
@media screen and (min-width:1281px){
	div.diagram{font-size:16px}
	div.diagram div.box{width:50%; font-weight:500}
	div.diagram div.box div.right{width:calc(150% - 3px)}
	div.diagram div.box div.left{width:calc(150% - 3px)}
	div.diagram div.box div.return{width:calc(130% - 3px)}
}

ul.iecre{position:relative}
ul.iecre > li{display:flex; align-items:stretch; margin:0 0 0.4em 0; font-family:'Titillium Web', sans-serif}
ul.iecre > li:last-child{margin:0}
ul.iecre > li.header{justify-content:center; align-items:center; padding:0.5em; background-image:linear-gradient(90deg,#0067b2,#000170); color:#fff; font-size:1.4em; font-weight:900}
ul.iecre > li.tr{padding:0.6em 0.4em}
ul.iecre > li.td{border-radius:0.4em; background-color:#ddd}
ul.iecre > li div.blank{box-sizing:border-obx}
ul.iecre > li div.lbl{display:flex; justify-content:center; align-items:center; box-sizing:border-box; font-weight:700; font-size:1.2em}
ul.iecre > li div.td{padding:0 0.2em; box-sizing:border-box}
ul.iecre > li div.td div.txt{padding:0.3em 0.4em; background-image:linear-gradient(90deg,#0067b2,#000170); color:#fff}
ul.iecre > li strong{display:block; text-align:center; font-size:1.1em}
ul.iecre > li span{display:block}
ul.iecre > li.th span{text-align:center}
@media screen and (max-width:320px){
	ul.iecre{left:-10px; width:calc(100% + 20px); font-size:9px}
	ul.iecre > li div.blank{width:16%}
	ul.iecre > li div.lbl{width:16%}
	ul.iecre > li div.td{width:28%}
	ul.iecre > li span{font-size:8px}
}
@media screen and (min-width:321px) and (max-width:360px){
	ul.iecre{left:-10px; width:calc(100% + 20px); font-size:10px}
	ul.iecre > li div.blank{width:16%}
	ul.iecre > li div.lbl{width:16%}
	ul.iecre > li div.td{width:28%}
	ul.iecre > li span{font-size:9px}
}
@media screen and (min-width:361px) and (max-width:384px){
	ul.iecre{left:-10px; width:calc(100% + 20px); font-size:11px}
	ul.iecre > li div.blank{width:16%}
	ul.iecre > li div.lbl{width:16%}
	ul.iecre > li div.td{width:28%}
	ul.iecre > li span{font-size:10px}
	ul.iecre > li.th span{height:}
}
@media screen and (min-width:385px) and (max-width:428px){
	ul.iecre{left:-10px; width:calc(100% + 20px); font-size:12px}
	ul.iecre > li div.blank{width:16%}
	ul.iecre > li div.lbl{width:16%}
	ul.iecre > li div.td{width:28%}
	ul.iecre > li span{font-size:11px}
}
@media screen and (min-width:429px) and (max-width:767px){
	ul.iecre{font-size:12px}
	ul.iecre > li div.blank{width:16%}
	ul.iecre > li div.lbl{width:16%}
	ul.iecre > li div.td{width:28%}
	ul.iecre > li span{font-size:11px}
}
@media screen and (min-width:768px) and (max-width:1024px){
	ul.iecre{font-size:13px}
	ul.iecre > li div.blank{width:25%}
	ul.iecre > li div.lbl{width:25%}
	ul.iecre > li div.td{width:25%}
	ul.iecre > li span{font-size:12px}
}
@media screen and (min-width:1025px) and (max-width:1280px){
	ul.iecre{font-size:14px}
	ul.iecre > li div.blank{width:25%}
	ul.iecre > li div.lbl{width:25%}
	ul.iecre > li div.td{width:25%}
	ul.iecre > li span{font-size:13px}
}
@media screen and (max-width:1280px){
	ul.iecre > li div.td{flex:1}
	ul.iecre > li div.td div.txt{height:100%; box-sizing:border-box}
}
@media screen and (min-width:1281px){
	ul.iecre > li div.blank{width:25%}
	ul.iecre > li div.lbl{width:25%}
	ul.iecre > li div.td{width:25%}
}
/* 연구분야(Research) */

/* 연구진소개 상세페이지(people.view) */
#contents.peopleView section.desc p{position:relative}
#contents.peopleView section.desc p:before{content:''; position:absolute; left:0; background-color:#0077ff; border-radius:50%}
@media screen and (max-width:1280px){
	#contents.peopleView section.desc p{padding:0 0 0 8px; line-height:19px}
	#contents.peopleView section.desc p:before{top:7px; width:3px; height:3px}
}
@media screen and (min-width:1281px){
	#contents.peopleView section.desc p{padding:0 0 0 12px; font-size:18px; line-height:26px}
	#contents.peopleView section.desc p:before{top:11px; width:4px; height:4px}
}
/* 연구진소개 상세페이지(people.view) */

/* 저널(journals) */
#page_zISqGrO5yA1{position:relative; background-color:#fff; font-weight:300}
#contents.journals{position:relative; background-color:#fff; font-weight:300}
ul.journals > li{border-bottom:1px solid #ddd}
ul.journals > li:last-child{border-bottom:0}
ul.journals > li div.box{position:relative}
ul.journals > li div.head{display:flex; align-items:center}
ul.journals > li div.head p.date{font-weight:500; color:#999}
ul.journals > li div.head p.register{padding:0.1em 0.5em; border-radius:1em; background-color:#999; color:#fff; font-weight:400}
ul.journals > li i.journal{display:block; font-style:normal; color:#2c94ff; font-weight:500}
ul.journals > li h2.title{font-weight:500}
ul.journals > li div.author{font-weight:400; color:#666}
ul.journals > li div.info{color:#666}
ul.journals > li a.more{position:absolute; top:50%; right:0; width:36px; height:36px; border:1px solid #ddd; margin:-19px 0 0 0; overflow:hidden; background-color:#fff; transition:all 0.4s cubic-bezier(.5,.24,0,1)}
ul.journals > li a.more:hover{width:126px; border-color:red; color:red}
ul.journals > li a.more i.fa{position:absolute; z-index:2; top:0; right:0; display:flex; justify-content:center; align-items:center; width:36px; height:36px; background-color:#fff}
ul.journals > li a.more span{position:absolute; top:0; right:0; display:flex; justify-content:center; align-items:center; width:156px; height:36px}
@media screen and (max-width:1280px){
	#page_zISqGrO5yA1{padding:20px 10px; font-size:12px}
	#contents.journals{padding:20px 10px; font-size:12px}
	ul.journals{border-top:2px solid #353d5e; border-bottom:2px solid #353d5e}
	ul.journals > li{padding:10px 0}
	ul.journals > li div.box{padding:0 48px 0 0}
	ul.journals > li div.head{position:relative; margin:0 0 4px 0}
	ul.journals > li div.head p.date{font-size:17px}
	ul.journals > li div.head p.register:nth-child(2){margin:0 0 0 0.2em}
	ul.journals > li i.journal{margin:0 0 4px 0}
	ul.journals > li h2.title{margin:0 0 4px 0; font-size:14px}
	ul.journals > li div.author{margin:0 0 4px 0}
}
@media screen and (min-width:1281px){
	#page_zISqGrO5yA1{padding:60px 0; font-size:14px}
	#contents.journals{padding:60px 0; font-size:14px}
	ul.journals{border-top:2px solid #353d5e; border-bottom:2px solid #353d5e}
	ul.journals > li{padding:12px}
	ul.journals > li div.box{padding:0 48px 0 130px}
	ul.journals > li div.head{position:absolute; top:0; bottom:0; left:0; flex-direction:column; justify-content:center; width:100px}
	ul.journals > li div.head:after{content:''; position:absolute; top:50%; right:0; width:1px; height:2em; margin:-1em 0 0 0; background-color:#ccc}
	ul.journals > li div.head p.date{font-size:22px}
	ul.journals > li div.head p.register:nth-child(2){margin:0.2em 0 0 0}
	ul.journals > li i.journal{margin:0 0 6px 0}
	ul.journals > li h2.title{margin:0 0 6px 0; font-size:16px}
	ul.journals > li div.author{margin:0 0 6px 0}
}
/* 저널(journals) */

/* 국내 컨퍼런스(conference) */
#contents.conference{position:relative; background-color:#fff; font-weight:300}
#page_E5uVMA-7G9E{position:relative; background-color:#fff; font-weight:300}
@media screen and (max-width:1280px){
	#contents.journals{padding:20px 10px; font-size:12px}
	#page_E5uVMA-7G9E{padding:20px 10px; font-size:12px}
}
@media screen and (min-width:1281px){
	#contents.conference{padding:60px 0; font-size:14px}
	#page_E5uVMA-7G9E{padding:60px 0; font-size:14px}
}
/* 국내 컨퍼런스(conference) */

/* 게시판(community) */
#contents.communityList{position:relative; background-color:#fff}
#contents.communityView{position:relative; background-color:#fff}
@media screen and (max-width:1280px){
	#contents.communityList{padding:20px 10px; font-size:13px}
	#contents.communityView{padding:20px 10px}
}
@media screen and (min-width:1281px){
	#contents.communityList{padding:60px 0; font-size:15px}
}
/* 게시판(community) */

/* Honors and Awards(honors) */
#contents.honors{position:relative; background-color:#fff; font-weight:300}
#page_FGPBLpC_sr6{position:relative; background-color:#fff; font-weight:300}
#contents.honors h1.title{border-bottom:1px dashed #3f51b5; color:#3f51b5; font-weight:300}
#page_FGPBLpC_sr6 h1.title{border-bottom:1px dashed #3f51b5; color:#3f51b5; font-weight:300}
@media screen and (max-width:1280px){
	#contents.honors{padding:20px 10px; font-size:13px}
	#page_FGPBLpC_sr6{padding:20px 10px; font-size:13px}
	#contents.honors h1.title{padding:0 0 10px 0; margin:0 0 10px 0; font-size:20px}
	#page_FGPBLpC_sr6 h1.title{padding:0 0 10px 0; margin:0 0 10px 0; font-size:20px}
	#contents.honors p{margin:0 0 8px 0}
	#page_FGPBLpC_sr6 p{margin:0 0 8px 0}
}
@media screen and (min-width:1281px){
	#contents.honors{padding:60px 0; font-size:19px}
	#page_FGPBLpC_sr6{padding:60px 0; font-size:19px}
	#contents.honors h1.title{padding:0 0 30px 0; margin:0 0 30px 0; font-size:36px}
	#page_FGPBLpC_sr6 h1.title{padding:0 0 30px 0; margin:0 0 30px 0; font-size:36px}
	#contents.honors p{margin:0 0 10px 0}
	#page_FGPBLpC_sr6 p{margin:0 0 10px 0}
}
/* Honors and Awards(honors) */

/* 강의소개(lecture) */
#page_VOsEMCC9v38{position:relative}
#contents.lecture{position:relative}
ul.lecture > li{padding:1em; margin:0 0 1em 0; background-color:#fff; box-shadow:0 0 1em 0.4em rgba(0,0,0,.1)}
ul.lecture > li:last-child{margin:0}
ul.lecture > li div.box{position:relative}
ul.lecture > li div.img{position:absolute; top:0; bottom:0; left:0; background-color:#eee; background-position:50% 50%; background-repeat:no-repeat; background-size:cover}
ul.lecture > li div.txt{padding:0 0 0 1em}
ul.lecture > li div.cate{font-weight:500; color:#3f51b5}
ul.lecture > li h3.title{font-weight:500; font-size:1.2em; color:#222}
ul.lecture > li div.desc{font-weight:300; color:#666}
@media screen and (max-width:1280px){
	#page_VOsEMCC9v38{padding:20px 10px; font-size:13px}
	#contents.lecture{padding:20px 10px; font-size:13px}
	ul.lecture > li div.box{padding:0 0 0 80px}
	ul.lecture > li div.img{width:80px}
}
@media screen and (min-width:1281px){
	#page_VOsEMCC9v38{padding:60px 0; font-size:16px}
	ul.lecture > li div.box{padding:0 0 0 110px}
	ul.lecture > li div.img{width:110px}
}
/* 강의소개(lecture) */

/* 문의하기(request) */
#contents.request{position:relative; background-color:#fff}
@media screen and (max-width:1280px){
	#contents.request{padding:20px 10px; font-size:13px}
}
@media screen and (min-width:1281px){
	#contents.request{padding:60px 0; font-size:15px}
}
/* 문의하기(request) */