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

/* ========================================================
 * Main Visual  
======================================================== */
/* ******************  Main Visual :: 텍스트 ********************** */
@media all and (max-width:1920px){
	.main-visual-slogan-item{font-size: 7.2917vw;}
	.main-visual-slogan-item.small{font-size:3.1250vw}
}
@media all and (max-width:1500px){
	.main-visual-slogan-txt{left:5%; right:5%; bottom:5%;}
}

/* ========================================================
 * Main Contents 
======================================================== */
/* ******************  메인 :: 공통 ********************** */
@media all and (max-width:1920px){
	#mainContent{font-size:0.7813vw}
	/* 메인 공통 :: 타이틀 */
	.main-cm-tit{font-size:3.333vw}
}
@media all and (max-width:1500px){
	#mainContent{font-size:13px; font-size:1.0156vw }
}
@media all and (max-width:1280px) {
	/* 메인 공통 :: 카테고리 */
	.main-cm-category{font-size:12px;}
	/* 메인 공통 :: 타이틀 */
	.main-cm-tit{font-size:4.2969vw}
}
@media all and (max-width:768px){
	#mainContent{font-size:12px; }
	/* 메인 공통 :: 타이틀 */
	.main-cm-tit{font-size:2.615em;}
}

/* ******************  메인 :: 회사소개 ********************** */
@media all and (max-height:768px) and (min-width:1281px){
	#mainCompanyContent{height:auto; padding:7vw 0;}
}
@media all and (max-width:1920px) {
	.main-company-intro-num dd{font-size:3.1250vw}
	.main-company-intro-num dd .num{font-size:5.7292vw}
}
@media all and (max-width:1280px) {
	#mainCompanyContent{height:auto; padding:7vw 0;}
	.main-company-tit-box .main-company-intro-txt,
	.main-company-intro-num dt{font-size:14px}
}

/* ******************  메인 :: 카테고리 메뉴 ********************** */
@media all and (max-width:1280px) {
	#mainQuickContent{height:auto; padding:5% 0;}
	.main-quick-menu-container{padding:0 70px;}
	.main-quick-menu-inner .main-quick-menu-item{padding:0 5px;}
	.main-quick-menu-inner .main-quick-menu-item .quick-menu-icon{height:50px;}
	.main-quick-menu-inner .main-quick-menu-item .quick-menu-tit{font-size:14px; height:2.4em; align-items:center;}
	.main-quick-menu-container .quick-menu-control-btn span{font-size:14px;}
}

/* ******************  메인 :: Select Work 프로젝트 ********************** */
@media all and (max-width:1500px){
	.main-project-tit-box .read-more-btn{right:5%;}
}
@media all and (max-width:1280px) {
	#mainProjectContent{height:auto;}
	/* -------- 메인 프로젝트 :: 타이틀영역 -------- */
	.main-project-tit-box{height:auto !important; margin:5% 0; display:table !important;}
	/* -------- 메인 프로젝트 :: 아코디언영역 -------- */
	.main-project-list-container{position:relative; bottom:auto; left:auto; right:auto; padding-top:0}
	.accordion-wrapper{position:static;}
	/* 아코디언 오버영역 레이아웃 */
	.accordion-over-container{position:static;}
	.accordion-over-list{position:static;}
	.accordion-over-item{width:50%; background:#000; height:0; padding-top:30%; background-size:cover !important;}
	.accordion-over-item .accordion-inner-con{position:absolute; top:0; left:0; width:100%; height:100%; }
	.accordion-over-item .accordion-detail-con{display:none;}
	.accordion-over-item .accordion-off-tit-box{transform:none !important; opacity:1 !important; visibility:visible !important;}
}
@media all and (max-height:768px){
	.main-project-list-container{position:relative; top:auto; left:auto; right:auto;}
	.main-project-tit-box{padding:5vw 0;}
}

/* ******************  메인 :: 게시판영역 ********************** */
@media all and (max-width:1500px){
	#mainBoardContent{padding:9.3750vw 5% 4.68vw}
	.main-board-list-con{margin-bottom:4.6875vw}
}

/* ******************  메인 :: Social Hub 영역 ********************** */
@media all and (max-width:1500px){
	#mainPortfolioContent{margin-bottom:9.3750vw}
	.portfolio-list-con{margin-bottom:4.6875vw}
}
@media all and (max-width:1280px) {
	/* .portfolio-list-con .portfolio-item{width:calc(50% - 20px); }
	.portfolio-list-con .portfolio-item:nth-child(1),
	.portfolio-list-con .portfolio-item:nth-child(2){margin-bottom:20px} */
	.portfolio-list-con .portfolio-item{width:calc(25% - 10px); margin:0 5px}
	.portfolio-list-con .portfolio-info-box{padding:15px 10px; box-shadow:4px 3px 10px 0px rgb(0 0 0 / 10%)}
}

/* ******************  메인 Search영역 ********************** */
 @media all and (max-width:1500px){
	#mainSearchContent{padding:9.3750vw 0}
 }
@media all and (max-width:1280px){
	 .total-search-control-box .search-select-con, 
	 .total-search-control-box .search-word-con, 
	 .total-search-control-box .search-btn-con{width:150px}
	 .total-search-control-box .search-word-con{width:calc(100% - 300px);}
	 .total-search-control-box .search-select-con .custom-option-item{padding:10px 15px;}
	 .total-search-control-box .search-select-con .custom-option-drop-list{max-height:140px}
 }