@charset "utf-8";

/* CSS Document */
button{display:inline-block;background:transparent;font-size:inherit;font-weight:normal;/* font-family:inherit; */color:inherit;cursor:pointer;}
.clearfix:after {display:block;visibility:hidden;clear:both;content:".";overflow:hidden;width:0;height:0;font-size:0;line-height:0;}
.clearfix {display:inline-block;}
* html .clearfix {height:1%;}
.clearfix {display:block;}
.clear {clear:both;}
.hide {display:none;}
.skip,.blind{position:absolute;width:1px;height:1px;margin:0;padding:0;background:none;font-size:3px;color:transparent;line-height:0;}
.hidden_txt{overflow:hidden;position:absolute;width:0;height:0;background:transparent;font-size:0;line-height:0;text-indent:-9999px;border:none !important;background:transparent !important;}


/* Dots */
.slick-dots{position:absolute;bottom: 214px;display:block;padding:0;margin:0;list-style:none;left: 50%; transform:translateX(-50%); z-index: 1000;/* background: #ccc; */}
.slick-dots li{position:relative;display:inline-block;margin:0 5px;padding:0;cursor:pointer;}
.slick-dots li button{font-size:0;line-height:0;display:block;width: 50px;height: 5px;opacity:1;cursor:pointer;background: #ccc;border:0;/* border-radius: 50%; *//* border: 4px solid #ffffff; */}
.slick-dots li.slick-active button{width: 50px;opacity:0.4;background: #327cff;opacity: 1;/* border-radius: 20px; */}


/**/
*{box-sizing: border-box;}
.m60{margin:60px auto;}
.p80{padding:80px 0;}
@media only all and (max-width:700px){
	.m60{margin:30px auto;}
	.p80{padding:40px 0;}
}

/*main_slide 영역*/
.main_img_container{position:relative; overflow: hidden;}
.main_img_container .Mainbg{height:850px!important;}
.main_img_container .slick-dots{display:none!important;}
.main_img_container .maintop{ width:1450px; overflow:hidden;text-align: center}
.main_img_container .maintopw{height:auto; top:35%; overflow:hidden; display: flex;align-items: center;justify-content: center;position: absolute; left:50%; transform:translateX(-50%);}
.main_img_container .main01sec-1{font:300 28px 'arial'; margin-bottom:15px; letter-spacing: -1px;line-height:100%; color: #ffffff;}
.main_img_container .main01sec-2{font-weight:600; line-height: 1.1; color:#fff; font-size: clamp(3rem, 4vw, 4rem); letter-spacing:-5px;}
.main_img_container .main01sec-2 span{font-weight:300;}
.main01secw{overflow:hidden;width: 100%;position:relative;/* text-align:left; */}
/*지원사업 규모 영역*/
.info_container{width: 100%; position: absolute; bottom:0; left:50%; z-index: 10; transform:translateX(-50%); border:1px solid #ffffff30; background:#22222210; backdrop-filter: blur(10px);}
.info_container ul{max-width:1500px; width:90%; margin:0 auto 0 calc((100% - 1400px) / 2); padding:35px 0; display: grid; grid-template-columns:25% 26% 25% 24%; justify-content:space-between; align-items: center;}
.info_container ul li{width:100%; display: grid; grid-template-columns:65px auto; column-gap: 3%; align-items: center;}
.info_container li .txt{
	& sup{font-size:var(--size-18); color:#fff; font-weight:300;}
	& h3{font-size:var(--size-26); margin-top:-6px; font-weight:700;}
	& p{font-size:14px; opacity:0.5; color:#fff; margin-top:5px;}
}
.info_container li:nth-of-type(1) h3{color:#17e3ea;} 
.info_container li:nth-of-type(2){margin:0 auto 0 -25px;}
.info_container li:nth-of-type(2) h3{color:#21eddc;} 
.info_container li:nth-of-type(3){margin:0 auto 0 40px;}
.info_container li:nth-of-type(3) h3{color:#17e3ea;} 
.info_container li:nth-of-type(4) h3{color:#21eddc;} 

@media only all and (max-width:1600px){
	.info_container ul{margin:0 auto; }
}
@media only all and (max-width:1380px){
	.info_container li:nth-of-type(2), .info_container li:nth-of-type(3){margin:0;}
}
@media only all and (max-width:1200px){
		.info_container ul{grid-template-columns: repeat(2, 1fr); row-gap: 15px;}
}
@media only all and (max-width:1024px){
	.main_img_container .Mainbg {height: 600px !important; }
	.main_img_container .Mainbg + .container{  width: 100%;     margin-left: 0;}
	.main_img_container .main01secw{width:97%;padding:0px;box-sizing:border-box;/* height:190px;*/ margin:0 1%;}
	.main_img_container .main01sec-1{font-size:var(--size-20);}
	.main_img_container .main01sec-2{ font-size: clamp(2rem, 3vw, 3rem); }
	.main_img_container .maintop{height:auto;}	
	.info_container li .txt h3{font-size:var(--size-22)}
}
@media only all and (max-width:600px){
	.main_img_container .Mainbg {height: 450px !important; }
	.main_img_container .maintopw{top:42%;}
	.main_img_container .main01sec-1{display: none;}
	.info_container ul{width:95%; padding:20px 0 5px; }
	.info_container li:nth-of-type(2) .txt h3{font-size:16px;}
	.info_container li:nth-of-type(2) .txt h3 span{display: none;}
	.info_container ul li{display: block;}
	.info_container ul li i, .info_container ul li .txt p{display: none;}
}

/*sec01_공지사항 영역*/
.main_tit_wrap{display: flex; justify-content: space-between; border-bottom:1px solid #eee;}
.main_tit{position: relative; margin-bottom:15px;}
.main_tit:after, .main_tab:after{position: absolute; bottom:-15px; display:block; content:""; height:3px; width:70px; background: #222; }
.main_tit h4, .main_tab h4{font-size:var(--size-24); }

.tabs{display: flex; flex-flow:row; align-items: center; }
.tabs li{cursor: pointer; color:#c4c4c4; position:relative; display: flex; align-items: center;}
.tabs li+li:before{display: inline-block; content: "•"; color:#c4c4c4; margin-left:12px; padding-right:12px;}
.tabs li.active{color:#222;}
.tab_content{position: relative;}
.tab_content .btn_more{position: absolute; top:-40px; right:0;}

#sec01{display: grid; grid-template-columns: 48% 48%; column-gap: 4%; }
#sec01 .notice_list li a{border-bottom:1px solid #eee; display: flex; align-items: center; justify-content: space-between; padding:16px 3px;}
#sec01 .notice_list li a h5{font-size:var(--size-18); font-weight:500;  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width:100%;}
#sec01 .notice_list li a .date{color:#cfcfcf; width:100px;}

.notice_container{grid-column: 1/3; margin-top:60px;}
.notice_list2{margin-top:20px;}
.notice_list2 li{background:#f8f8f8; border-radius: 15px; padding:35px 25px;}
.notice_list2 li a h5{ min-height:48px; font-size:var(--size-18); font-weight:500; overflow: hidden; text-overflow: ellipsis;  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; width:100%;}
.notice_list2 li a .txt{line-height: 1.5; color:#a5a5a5; margin:15px 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;}
.notice_list2 li a .date{color:#cfcfcf; width:100px;}
@media only all and (max-width:800px){
	/*#sec01{display: block;}*/
	#sec01 .notice_container{ width: 100%;}
	.main_tit h4, .main_tab h4{font-size:var(--size-22);}
}
@media only all and (max-width:600px){
	#sec01 .notice_list li a .date{display: none;}
}


/*sec02_연구성과*/
#sec02{width: 100%;}
#sec02 .main_tit {display: flex; }
#sec02 .main_tit h3{font-size:var(--size-24); margin-right:15px;}
#sec02 .tab_container{margin-top:25px;}
#sec02 .tab_container .btn_more{top:-65px;}
.rechSwiper .swiper-slide a{display: inline-block; padding:40px; border-radius: 15px; border:1px solid #22ac9f; }
.rechSwiper .swiper-slide .tags{display: flex; flex-flow:row wrap; column-gap: 5px;}
.rechSwiper .swiper-slide .tags li{border-radius: 30px; padding:3px 13px; font-size:14px;  margin-bottom:5px;}
.rechSwiper .swiper-slide .tags .tag1{color:#2db2c2; background:#e8f7f7;} 
.rechSwiper .swiper-slide .tags .tag2{color:#2d70c2; background:#e8f0f7;} 
.rechSwiper .swiper-slide .tags .tag3{color:#524cc2; background:#e9e8f7; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; } 
.rechSwiper .swiper-slide h5{font-size:var(--size-18); line-height: 1.4; font-weight:500; margin: 15px 0 20px;}

/*모바일에서 언론보도 - 연구성과 - 공지사항으로 순서변경*/
@media only all and (max-width:800px){
	#sec01{display: flex; flex-flow:column wrap;}
	#sec02.w1400{width: 100%; margin:40px 0 0;}
	.notice_container{ margin-top:40px;}
}

@media only all and (max-width:600px){
	#sec02{margin-top:40px;}
	#sec02 .main_tit_wrap{align-items: flex-end;}
	#sec02 .main_tit_wrap a{margin-bottom:16px; }
	#sec02 .main_tit{display: block;}
	#sec02 .main_tit h3{margin-bottom:15px;}
	.rechSwiper .swiper-slide a{padding:20px;}
}


/*sec03_퀵메뉴*/
#sec03{max-width:1500px; width:98%;}
.quick_container {display: flex; justify-content: space-between;}
.quick_container li{text-align: center; align-content: center; width:100%;}
.quick_container li+li{margin-left:10px; border-left:1px solid #ddd; padding-left:10px;}
.quick_container li dl{padding:20px 0;}
.quick_container li dl dd{font-size:var(--size-22); font-weight:500; margin-top:15px;}
@media only all and (max-width:1024px){
	.quick_container li.m_hide{display: none;}
}
@media only all and (max-width:720px){
	.quick_container{display: grid; grid-template-columns: repeat(3, 1fr);}
	.quick_container li+li{margin-left:0; border-left:none; padding-left:0}
}


/*sec04_지원사업*/
#sec04{background:#d8efff;}
.busi_container{max-width:1700px; width:98%; margin:0 auto;}
.busi_tit {text-align: center; margin-bottom:30px;}
.busi_tit h3{font-size:var(--size-36);}
.busi_tit p{font-size:var(--size-22); color:#969ba4; margin-top:3px;}

.busi_list{display: grid; grid-template-columns: repeat(5, 1fr); column-gap: 10px;}
.busi_list li{min-height:400px; }
.busi_list li a{transition:all 0.3s ease; color:#fff; display:flex; flex-flow:column wrap; justify-content: space-between;  padding:60px 50px; height:100%; border-radius: 30px 0; }
.busi_list li:nth-of-type(1) a{background:url(../img/main/busi_bg01.png) no-repeat center / cover;}
.busi_list li:nth-of-type(2) a{background:#2a9bdc;}
.busi_list li:nth-of-type(3) a{background:url(../img/main/busi_bg03.png) no-repeat center / cover;}
.busi_list li:nth-of-type(4) a{background:#3e7bcc;}
.busi_list li:nth-of-type(5) a{background:url(../img/main/busi_bg05.png) no-repeat center / cover;}
.busi_list li:hover a{box-shadow: 0 5px 10px rgba(0, 64, 128, 0.2);}
.busi_list li a .txt h4{font-size:var(--size-24); font-weight:500;}
.busi_list li a .txt p{font-weight:300; opacity: 0.7; line-height:1.6; margin-top:20px ;  }
.busi_list li a .txt+span{text-transform:uppercase; font-weight:300; letter-spacing:0px;}

@media only all and (max-width:1500px){
	.busi_list{grid-template-columns: repeat(auto-fill, minmax(300px, auto)); }
	.busi_list li{min-height:auto; margin-top:10px;}

}
@media only all and (max-width:1024px){
	.busi_list li a{padding:30px;}
	.busi_list li a .txt p{display: none;}
}

/*sec05_연구소*/
#sec05 h3.tit{font-size:var(--size-30); text-transform:uppercase; font-weight:600; letter-spacing: -1.5px; text-align: center; line-height: 1;}
#sec05 h3.tit b{font-size:var(--size-40); font-weight:700;}

.center_list{margin-top:30px; display:grid; grid-template-columns: repeat(4, calc((100% - 45px) / 4)); column-gap:15px;}
.center_list li{margin-top:15px;}
.center_list li a{min-height:236px; transition:all 0.2s ease; overflow: hidden; display: inline-block; border-radius: clamp(10px, 15px, 20px ); border:1px solid #ddd ;width:100%; padding:40px; filter:grayscale(1); position: relative;   isolation: isolate;}
.center_list li:nth-of-type(1) a{background:url(../img/main/center_ic01.png) no-repeat 85% 75%; }
.center_list li:nth-of-type(2) a{background:url(../img/main/center_ic02.png) no-repeat 85% 75%; }
.center_list li:nth-of-type(3) a{background:url(../img/main/center_ic03.png) no-repeat 85% 75%; }
.center_list li:nth-of-type(4) a{background:url(../img/main/center_ic04.png) no-repeat 85% 75%; }
.center_list li:nth-of-type(5) a{background:url(../img/main/center_ic05.png) no-repeat 85% 75%; }
.center_list li:nth-of-type(6) a{background:url(../img/main/center_ic06.png) no-repeat 85% 75%; }
.center_list li:nth-of-type(7) a{background:url(../img/main/center_ic07.png) no-repeat 85% 75%; }
.center_list li:nth-of-type(8) a{background:url(../img/main/center_ic08.png) no-repeat 85% 75%; }
.center_list li a:after{display: inline-block; content: ""; width:100%; height:100%; background:#ffffff; opacity: 0.9; position: absolute; z-index: -1; inset:0;}
.center_list li .txt:after{transition:all 0.2s ease; display: inline-block; content:""; width:38px; aspect-ratio: 1/1; background:url(../img/main/btn_arrow_off.png) no-repeat center;}
.center_list li .txt h5{font-size:var(--size-24);}
.center_list li .txt p{margin:10px 0 35px; opacity: 0.6;}
.center_list li:hover{
	& a{filter:grayscale(0); border-color:#22ac9f; box-shadow: 0 0 10px rgba(0,0,0,0.1);}
	& a:after{opacity: 0;}
	& .txt:after{background:url(../img/main/btn_arrow_on.png) no-repeat center; transform:translateX(5px);} 
	& .txt p{opacity: 1;}
}
@media only all and (max-width:1400px){
	.center_list{grid-template-columns: repeat(3, 32.5%); column-gap:1%;}
}
@media only all and (max-width:1024px){
	.center_list{grid-template-columns: repeat(2, 49.5%);}
}
@media only all and (max-width:600px){
	.center_list li{margin-top:0px;}
	.center_list li .txt p, .center_list li .txt:after{display: none;}
	.center_list li .txt h5{font-size:var(--size-20);}
	.center_list li a{padding:30px 20px; min-height:110px;  background-position: 110% 90%!important;}
	
}


