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

/* ******************  메인 비주얼 ********************** */
@media all and ( max-width: 1280px ){
	/* 공통 :: 레이아웃 */
	#fullpage .section:not(#mainVisual){height:auto !important;}
	#fullpage .fp-section:not(#mainVisual) .fp-tableCell{height:auto !important;}

	/* 메인 비주얼 :: 텍스트 */
	.main-visual-txt-inner .main-visiual-logo img{height:115px;}
	.main-visual-item:first-child .main-visual-txt-box .main-visual-txt1{font-size:50px; /* margin-top:20px; */}
}
@media all and ( max-width: 800px ){
	/* 메인 비주얼 :: 이미지 */
	/* 메인 비주얼 :: 텍스트 */
	.main-visual-txt-box {height:100%; align-items:center;}
	.main-visual-txt-box .main-visual-txt1{font-size:4rem; text-align:center;}
	.main-visual-item:first-child .main-visual-txt-box .main-visual-txt1{text-align:left; width:65%; font-size:30px; /* margin-top:1.5rem; */}
	.main-visual-txt-box .main-visiual-logo-wrap{width:35%;}
	.main-visual-txt-inner .main-visiual-logo{margin-right:0rem; text-align:center;}
	.main-visual-txt-inner .main-visiual-logo img{display: inline-block; width:70%; height:auto;}
	
	/* 메인 비주얼 :: 카운터 */
	.main-visual-counter {margin-top:13.34%;}
}
@media all and ( max-width: 380px ){
	.main-visual-item:first-child .main-visual-txt-box .main-visual-txt1{font-size:25px;}
}


/* ******************  메인 컨텐츠 :: 공통 ********************** */
@media all and (min-width:1281px){
	/* 공통 :: 우측 배경 */
	#fullpage .section {position:relative;}
	#fullpage .section:after {content:""; width:25%; max-width:480px; height:100%; background:#f4f4f4; position:absolute; right:0; top:0; z-index: -1;}
}
@media all and (min-width:801px){
	.main-tit-box .main-btn:hover {background-color:var(--main-color); border-color:var(--main-color); color:#fff;}
}
@media all and (max-width:800px){
	.main-tit-box .main-sub-tit {font-size:1.6rem;}
	.main-tit-box .main-tit {font-size:2.8rem; margin-top:2rem;}
	.main-tit-box .main-btn { margin-top:3rem;}
}

/* ******************  메인 컨텐츠 :: Company ********************** */
@media (max-width:1280px) and (min-width:801px){
	#mainCompanyCon .fp-tableCell{display: flex;}
	#mainCompanyCon .img-box{position: relative; top:auto; left:auto;}
	#mainCompanyCon .area-box{width:50%; box-sizing:border-box;}
	.main-company-con{height:100%;}
	.main-company-con .txt-box{width:100%; margin-left:0%;}
}
@media all and (max-width:1280px){
	/* #mainCompanyCon {padding:10.5rem 0 7rem;} */
	#mainCompanyCon .img-box{height:auto;}
	#mainCompanyCon .img-box .img{position: relative; top:auto; left:auto;}
	#mainCompanyCon .img-box .img img{position: relative; height:auto; top:auto; left:auto;}
}
@media all and (max-width:800px){
	#mainCompanyCon {padding:7rem 0 7rem;}
	#mainCompanyCon:before {width:63.1%; padding-top:58.73%;}
	#mainCompanyCon .fp-tableCell{display: block;}
	.main-company-con {display:block;}
	.main-company-con .img-box  {width:100%; max-width: 710px; padding-right:0;}
	.main-company-con .img-box .img { padding-right:0; padding-bottom:10px;}
	.main-company-con .img-box .img:before {width:57.1%; padding-top:35.51%; right:-10px; background-size:cover;}
	.main-company-con .txt-box {width:100%; padding-left:0; margin-top:4rem;}

	#mainCompanyCon .img-box{position: relative; width: 100%; margin:auto;}
	.main-company-con .txt-box{margin-left:0;}
}

/* ******************  메인 컨텐츠 :: Business ********************** */
@media (max-width:1280px) and (min-width:801px){
	#mainBusinessCon .fp-tableCell{display: flex;}
	#mainBusinessCon .area-box{width:50%; margin-left:0;}
	.main-business-con{height:100%;}
	.main-business-con .txt-box{width:100%;}
	#mainBusinessCon .slide-box{position: relative; width:50%; top:auto; right:auto; transform:none;}
}
@media all and (min-width:801px){
	.main-business-slide .slide-item .more-btn:hover .inner:after {transform:scale(1.1);}
}
@media all and (max-width:1280px){
	/* #mainBusinessCon {padding:7rem 0;} */
	.main-business-con .slide-box {padding-left:0;}
	#mainBusinessCon .slide-box{height:auto; }
	.main-business-slide .slide-item .inner-box{padding-top:97.96%;}

}
@media all and (max-width:800px){
	#mainBusinessCon {padding:0rem 0 7rem;}
	/* #mainBusinessCon .fp-tableCell{display: block;} */
	.main-business-con {flex-wrap:wrap; flex-direction:column-reverse;}
	.main-business-con .txt-box {width:100%; padding-right:0; margin-top:6rem;}
	.main-business-con .slide-box {width:100%; padding-left:0; }
	.main-business-con .main-slide-controls-box {margin-top:5rem}
	.main-business-slide-wrap:before {width:57.1%; padding-top:35.51%; height:auto; background-size:cover; right:-10px; bottom:-10px;}
	.main-business-slide .slide-item { padding-left:0; }
	.main-business-slide .slide-item .info-box {bottom:3.5rem; left:3.5rem;}
	.main-business-slide .slide-item .info-box .txt  {display:none;}
	.main-business-slide .slide-item .info-box .sub-tit  {font-size:1.6rem;}
	.main-business-slide .slide-item .more-btn {display:none;}

	#mainBusinessCon > div{display: flex; flex-direction: column-reverse;}
	#mainBusinessCon .slide-box{position: relative; width: 100%; margin:auto; top:auto; right:auto; transform:none;}
}

/* ******************  메인 컨텐츠 :: Summary ********************** */
@media all and (max-width:800px){
	#mainSummaryCon {padding:7rem 0;}
	.main-summary-con .bg {background-image:url("/images/main/main_summary_bg_m.jpg");}
	.main-summary-con {padding:7rem 1.7rem;}
	.main-summary-con .tit-box  {padding-bottom:3rem;}
	.main-summary-con .tit-box .sub-tit {font-size:1.6rem;}
	.main-summary-con .tit-box .tit {font-size:5.6rem;}
	.main-summary-con .bottom-box  {display:block; margin-top:6rem;}
	.main-summary-con .txt-box  {display:none;}
	.main-summary-con .count-box {display:block;}
	.main-summary-con .count-box .count-item {width:100%; height:12rem; margin-left:0; margin-top:1.9rem;}
	.main-summary-con .count-box .count-item:first-child {margin-top:0;}
}


/* ******************  메인 컨텐츠 :: News ********************** */
@media all and (min-width:801px){
	.main-news-slide li a:hover:before {opacity:1; }
	.main-news-slide li a:hover .thumb-box {opacity:0;}
	.main-news-slide li a:hover .over-box {opacity:1; top:50px; }

	.main-news-slide .slick-list {position:relative;  padding-right:8rem; padding-left:20px; box-sizing: border-box; }
	.main-news-slide .slick-track {padding:50px 0;}
	.main-news-slide li { opacity:0; visibility:hidden; padding-top:13.6rem;}
	.main-news-slide li.slick-active {opacity:1; visibility:visible;}
	.main-news-slide li.slick-current {padding-bottom:13.6rem; padding-top:0;}

	.section.active-effect .main-news-slide li.slick-active {animation: active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
	.section.active-effect .main-news-slide li.slick-current {animation: active-animation-reverse 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
}

@media all and (max-width:1280px){
	#mainNewsCon {padding:7rem 0;}
	.main-news-con .slide-box {padding:0;}
	.main-news-slide .slick-list {padding-right:4rem;}
}
@media all and (max-width:800px){
	.main-news-con {display:block;}
	.main-news-con .txt-box {width:100%; padding-right:0; }
	.main-news-con .txt-box .main-slide-controls-box {}
	.main-news-con .slide-box {width:100%; margin-top:5.5rem;}
	.main-news-slide {margin:0;}
	.main-news-slide .slick-list {overflow:visible;}
	.main-news-slide li dt{padding-top:66.66%;}
	.main-news-slide li {width:280px;}
	.main-news-slide li dd{padding:20px 10px;}	
	.main-news-slide li .tit {font-size:2.2rem; margin-top:1rem}
	.main-news-slide li .thumb-box .date {margin-top:5rem; margin-top:2rem;}

	.main-news-slide li .tit{}

	.main-news-slide-wrap {opacity:0;}
	.section.active-effect .main-news-slide-wrap {animation: active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both 0.3s;}
}

/* ******************  메인 컨텐츠 :: Recruit ********************** */
@media all and (min-width:801px){
	.main-recruit-con .left-box .more-btn:hover {background-color:var(--main-color); border-color:var(--main-color); }
}
@media all and (max-width:1280px){
	#mainRecruitCon {padding:6rem 0 8.5rem;}
	#mainRecruitCon .area-box {padding:0;}
	.main-recruit-con {display:block; text-align:center;}
	.main-recruit-con .left-box {display:block; width:100%; border-right:0;}
	.main-recruit-con .left-box .con-box {position:relative; width:100%; padding-top:0; padding-left:0; border-left:0; border-top:1px solid rgba(255,255,255,0.1); }
	.main-recruit-con .left-box .con-box:before {content:""; position:absolute; left:50%; top:0; margin-top:0; margin-left:-13.5px; width:27px; height:3px; background-color:#fff; }
	.main-recruit-con .left-box .icon {padding-top:3rem;}
	.main-recruit-con .left-box .icon:before {display:none;}
	.main-recruit-con .left-box .tit {font-size:2.5rem; margin-top:2rem;}
	.main-recruit-con .left-box .txt {font-size:1.6rem; margin-top:2rem;}
	.main-recruit-con .left-box .more-btn {margin:3.5rem auto 7.5rem;}
	.main-recruit-con .right-box {display:block; width:100%; padding:3rem 0 0;}
	.main-recruit-con .main-tit-box .main-sub-tit {font-size:1.6rem; }
	.main-recruit-con .main-tit-box .main-tit {font-size:2.8rem; }
	.main-recruit-con .main-tit-box .main-tit .point {display:block;}
}


/* ******************  메인 오른쪽 퀵메뉴 (Fullpage) ********************** */
@media all and (max-width:1536px){
	#fp-nav{display:none !important;}
}
