@charset "utf-8";
/* *******************************************************
 * filename : main_responsive.css
 * description : 메인 레이아웃 및 컨텐츠 반응형 CSS
 * date : 2020-11-25
******************************************************** */


/* ******************  메인 레이아웃(Fullpage)  ********************** */
@media all and (max-width:1780px){
	#fullpage .section:before {display:none;}
}
@media all and ( min-width: 1025px ) and (max-height: 800px) {
	#fullpage .section:not(#mainFooter){position:relative; height:auto !important;}
	#fullpage .section .fp-tableCell{height:100% !important;}
}

/* ******************  메인 비주얼 ********************** */
@media all and ( min-width: 1025px ) and (max-height: 800px) {
	#fullpage .section#mainVisual {height:100vh !important;}
}
@media all and ( max-width: 1024px ){
	/* 공통 :: 레이아웃 */
	#fullpage .section:not(#mainVisual){height:auto !important;}
	#fullpage .fp-section .fp-tableCell{padding-top:0; height:0 !important;}
}

@media all and ( max-width: 800px ){
	/* 메인 비주얼 :: 이미지 */
	.main-visual-item .main-visual-pc-img{display:none;}
	.main-visual-item .main-visual-m-img{display:block; height:100%; background-size:cover !important;}
	.main-visual-m-img img{width:100%;}
	/* 메인 비주얼 :: 텍스트 */
	.main-visual-item .main-visual-txt-con{padding-bottom:80px; -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	 box-sizing: border-box; }
	.main-visual-item .main-visual-txt-box {align-items: flex-end;}
	.main-visual-item .main-visual-txt-con .main-visual-txt1{font-size:45px; margin-bottom:15px;}
	.main-visual-item .main-visual-txt-con .main-visual-txt2{font-size:17px; margin-left:3px;}
	/* 메인 비주얼 :: 스크롤아이콘 */
	.main-scroll-icon {bottom:30px;}
	.main-scroll-icon .scroll-circle-box {margin:0 auto 0 15px; }
	.main-scroll-icon .txt{display:none}
}

/* ******************  메인 컨텐츠 :: 공통 ********************** */
@media all and (max-width:800px){
	/* 공통 :: 타이틀 */
	.main-tit-box .main-tit {font-size:35px; /* font-size:50px; */}
	.main-tit-box .main-sub-txt {font-size:20px; margin-top:15px; margin-bottom:10px;}
	.main-tit-box .main-txt {font-size:13px;}
	/* 공통 :: 기술레이아웃 */
	.main-tech-con {flex-direction: column-reverse; }
	.main-tech-con .img-con {width:100%;}
	.main-tech-con .txt-con {width:100%;}
	/* 버튼 */
	.main-more-btn {width:50px; height:50px;}
	.main-more-btn .circle {width:40px; height:40px; margin:-20px 0 0 -20px;}
	.main-more-btn .icon {font-size:17px; line-height: 50px;}
	.main-more-btn:before  {width:70px; height:70px; margin:-36px 0 0 -36px;}
}

/* ******************  메인 컨텐츠 :: Press Release ********************** */
@media all and ( min-width: 1025px ) and (max-height: 900px) and (min-height:801px){
	#mainPrCon .main-tit-box {margin-bottom:30px;}
	.main-pr-list .slick-dots {bottom:-50px;}
} 
@media all and ( min-width: 1025px ) and (max-height: 800px) {
	#mainPrCon {padding:100px 0 170px;}
} 
@media all and (max-width:1536px){
	.main-pr-list {padding:0 110px;}
	.main-pr-list .slick-track > li {width:307px; }
	.main-pr-list .slick-arrow.slick-prev {margin-left:0;}
	.main-pr-list .slick-arrow.slick-next {margin-right:0;}
	.main-pr-list a .txt-box {padding:39.5px 30px 37.5px;}
	.main-pr-list a .tit {margin-top:30px;}
	.main-pr-list a .date {margin-top:30px;}
}
@media all and (max-width:1024px){
	#mainPrCon {padding:100px 0 150px;}
	.main-pr-list .slick-dots {bottom:-50px;}
}
@media all and (max-width:800px){
	#mainPrCon {padding:79px 0 85px;}
	#mainPrCon .main-tit-box {text-align:left; margin-bottom:30px;}
	#mainPrCon .main-tit-box .main-sub-tit {font-size: 15px;}
	#mainPrCon .main-tit-box .main-tit {font-size: 30px;}
	.main-pr-list {padding:0 0 74px;} 
	.main-pr-list .slick-track > li {width:280px; } 
	.main-pr-list .slick-arrow {top:auto; bottom:0; width:50px; height:50px; z-index:99;}
	.main-pr-list .slick-arrow i {font-size:17px; line-height:50px;}
	.main-pr-list .slick-arrow.slick-prev i {margin-left:-2px;}
	.main-pr-list .slick-arrow.slick-next i {margin-right:-2px;}
	.main-pr-list .slick-arrow.slick-prev {left:auto; right: 60px; }
	.main-pr-list .slick-arrow.slick-next {right:0;}
	.main-pr-list .slick-dots {bottom:20px; text-align:left;}
	.main-pr-list .slick-dots li {margin:0 10px;}
	.main-pr-list .slick-dots li:first-child {margin-left:0;}
	.main-pr-list .slick-dots li button:before {width:20px; height:20px; margin:-10px 0 0 -10px;}
	.main-pr-list a .txt-box {padding:40px 23px;}
	.main-pr-list a .category {font-size:12px;}
	.main-pr-list a .tit {font-size: 20px; margin-top:18px;}
	.main-pr-list a .txt {font-size: 12px; line-height:1.583em; height:4.749em;}
	.main-pr-list a .date {font-size:12px;}
	/* 이미지버전 */
	.main-pr-list a .img-wrap + .txt-box {padding:15px 23px;}
	.main-pr-list a .img-wrap + .txt-box .category {left:23px;}
	.main-pr-list a .img-wrap + .txt-box .tit  {font-size:17px;}
}


/* ******************  메인 컨텐츠 :: Aptamer ********************** */
@media all and ( min-width: 1025px ) and (max-height: 800px) {
	#mainAptamerCon .fp-tableCell {padding-top:0;}
	#mainAptamerCon .main-tech-con .txt-con {padding-left:50px;}
	#mainAptamerCon .main-tech-con .main-more-btn {margin-top:50px;}
} 
@media all and (max-width:1600px){
	#mainAptamerCon .main-tech-con .img-wrap:before {left:-15px; bottom:15px;}
} 
@media all and (max-width:1024px){
	#mainAptamerCon {padding:100px 0;}
	#mainAptamerCon .main-tech-con .img-wrap {padding-left:15px; padding-bottom:15px;}
	#mainAptamerCon .main-tech-con .img-wrap:before {bottom:0; left:0;}
	#mainAptamerCon .main-tech-con .txt-con {padding-left:50px;} 
	#mainAptamerCon .main-tech-con .main-more-btn {margin-top:50px;}
}
@media all and (max-width:800px){
	#mainAptamerCon {padding:112px 0 39px;}
	#mainAptamerCon .main-tech-con {display:block;}
	#mainAptamerCon .main-tech-con .txt-con {position:relative; padding-left:0px; padding-bottom:60px;} 
	#mainAptamerCon .main-tech-con .main-more-btn {position:absolute; bottom:-25px; right:40px ;margin-top:0; z-index:99;}
}


/* ******************  메인 컨텐츠 :: BiFAp ********************** */
@media all and ( min-width: 1025px ) and (max-height: 800px) {
	#mainBiFApCon {padding:70px 0;}
	#mainBiFApCon .fp-tableCell {padding-top:0;}
}
@media all and (max-width:1260px) and (min-width:801px){
	#mainBiFApCon .main-bifap-con .txt-con .main-tit-box .main-tit {/* font-size:6.3492vw; */ font-size:5.1587vw;}
	#mainBiFApCon .main-tech-con .txt-con .tit {font-size:3.6508vw}
}
@media all and (max-width:1024px){
	#mainBiFApCon {padding:100px 0;}
	#mainBiFApCon .fp-tableCell {padding:0;}
	.main-bifap-con {display:block;}
	.main-bifap-con .txt-con {width:100%;}
	.main-bifap-con .link-con {width:100%; padding-left:0;}
	#mainBiFApCon .main-tech-con {display:block;}
	#mainBiFApCon .main-tech-con .img-con {display:block; width:100%;}
	#mainBiFApCon .main-tech-con .img-con .img-wrap {position:relative; padding-top:43.75%;}
	#mainBiFApCon .main-tech-con .txt-con {display:block; width:100%; -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	 box-sizing: border-box; }
}
@media all and (max-width:800px){
	#mainBiFApCon {padding:70px 0 45px;}
	#mainBiFApCon .main-tech-con {display:block; margin-top:30px;}
	#mainBiFApCon .main-tech-con .img-con {display:block; width:100%; }
	#mainBiFApCon .main-tech-con .txt-con {display:block; width:100%; padding:30px 20px;}
	#mainBiFApCon .main-tech-con .txt-con .tit {font-size:28px;}
	#mainBiFApCon .main-tech-con .txt-con .txt {font-size:14px;}
/* 	#mainBiFApCon .main-tech-con .txt-con .main-tit-box {display:block; position:relative; padding-top:37.5%;}
	#mainBiFApCon .main-tech-con .txt-con .main-tit-box .main-tit {display:block; position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); font-size:40px;} */
	.main-bifap-con .txt-con .tit {font-size:27px;}
	.main-bifap-con .txt-con .txt {font-size:14px;}
	.main-bifap-con .link-con {padding-right: 15px;margin-top:0; /*  margin-top:20px; */}
	.main-bifap-con .link-con .inner:before {width:calc(100% - 95px);}
}

/* ******************  메인 컨텐츠 :: PIPELINE ********************** */
@media all and (max-width:1920px){
	.main-tech-pipe-con {margin-top: 4.6875vw;}
}
@media all and (min-width: 1025px) and (max-height: 900px){
	.main-pipe-con {padding-top:70px;}
}
@media all and (min-width: 1025px) and (max-height: 800px){
	.main-pipe-con {padding-top:0;}
	#mainPipeCon {padding:70px 0 0;}
}
@media all and (max-width:1024px){
	#mainPipeCon{padding-top:92px;}
	.main-tech-pipe-con .main-pipe-list{width:50%; margin-bottom:30px;}
	.main-tech-pipe-con .main-pipe-list:last-child{margin-bottom:0;}
}
@media all and (max-width:800px){
	#mainPipeCon{padding-top:39px;}
	.main-tech-pipe-con{margin-top:30px;}
	.main-tech-pipe-con .main-pipe-list .img-wrap{margin-bottom:15px;}
	.main-tech-pipe-con .main-pipe-list .sub-tit{font-size:20px; margin-bottom:10px;}
	.main-tech-pipe-con .main-pipe-list .main-txt{font-size:14px; margin-bottom:10px;}
	.main-tech-pipe-con .main-pipe-list .main-txt-02{font-size:13px;}
	.main-tech-pipe-con .main-pipe-list .main-txt-02:before{top:8px;}
}
@media all and (max-width:480px){
	.main-tech-pipe-con{display: block;}
	.main-tech-pipe-con .main-pipe-list{width:100%; margin-bottom:20px;}
}

/* ******************  메인 컨텐츠 :: Lung ********************** */
@media all and (min-width: 1025px) and (max-height: 800px){
	#mainLungCon {min-height:auto !important; height:auto !important; padding:70px 0;}
}
@media all and (max-width:1024px){
	#mainLungCon {padding:100px 0;}
}
@media all and (max-width:800px){
	#mainLungCon {padding:68px 0 45px;}
	#mainLungCon .main-tech-con {flex-wrap:wrap; flex-direction:row; align-items:normal; }
	#mainLungCon .main-tech-con .img-con {width:100%; margin-top:57px;}
	#mainLungCon .main-tech-con .txt-con {width:100%; padding-right:0;}
	#mainLungCon .main-tech-con .txt-con .main-tit-box .main-tit {line-height:1.2;}
}
/* ******************  메인 오른쪽 퀵메뉴 (Fullpage) ********************** */
@media all and (max-width:1780px){
	#fp-nav{display:none !important;}
}