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

/* ******************  메인 레이아웃(Fullpage) ********************** */
@media all and (max-width: 1280px) {
	#fullpage #mainVisual {height: 100vh !important;}
}

/* ******************  메인 비주얼 ********************** */
@media all and ( max-width: 1280px ){
	/* 공통 :: 레이아웃 */
	#fullpage .section:not(#mainVisual){height:auto !important;}
	#fullpage .fp-section .fp-tableCell{height:auto !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;} */
	/* 메인 비주얼 :: 텍스트 */
	.main-visual-txt-box .main-visual-txt1{font-size:4rem}
	.main-visual-txt-box .main-visual-txt1 em {font-size: 3rem;}
	/* 메인 비주얼 :: Dots */
	.main-visual-con .slick-dots-wrapper{text-align:center; bottom:10px;}
	/* 메인 비주얼 :: 화살표 */
	.main-visual-con .slick-arrow{display:none !important;}
	/* 메인 비주얼 :: 스크롤아이콘 */
	.main-scroll-icon{display:none}
	/* 메인 하단 */
	.main-nav-btn {right: 2rem;}
	/* .main-nav-btn.on {bottom: 2rem;}
	.main-nav-btn.contact-btn.on {bottom: 9rem;} */
}

/* ******************  메인 컨텐츠 ********************** */
/* 헤더 */
.main-wrap.active #header {top: 0; height: auto;}

/* .main-content-container {display: none; background: url("/images/main/main_bg_m.jpg") no-repeat top 0 left 50% / cover;} */

/* -------- 메인 컨텐츠 :: 공통 -------- */
@media all and ( max-width: 800px ){
	.main-wrap {background: none;}
	#fullpage {background: bottom / 100% 100% no-repeat url("/images/main/main_bg_m.jpg")}
	/* #fullpage {background: url("/images/main/main_bg_m.jpg") no-repeat top 100vh left 50% / 100% calc(100% - 100vh);} */
	#mainContent1, #mainContent2, #mainContent3, #mainContent4 {background: none;}

	/* 공통 :: 슬라이드 프로그레스바 */
	.history-arrow-box {display: none;}
	.main-swiper-pagination .swiper-pagination-progressbar {width: 100%;}

	/* 공통 :: 타이틀 */
	.main-tit-box{margin-bottom:30px;}
	.main-tit-box .main-tit{font-size:24px;}
	.main-tit-box .main-sub-tit{font-size:13px;}
	.main-tit-box .main-sub-tit span{display:block;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠1 (About US) -------- */
@media all and (max-width:800px){
	#mainContent1 .main-tit-box{padding-top: 13.5rem;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠2 (Use cases) -------- */
@media all and (max-width: 1280px) {
	#mainContent2 {padding: 13.5rem 0 14rem 0;}
	.main-use-con .accordion-list-box .accordion-list {display: flex; flex-direction: column; height: auto; gap: 2rem 0;}
	.main-use-con .accordion-list-container {margin-left: 0;}
	.main-use-con .accordion-list .accordion-item {width: 100% !important; height: 12rem !important; transition: all 0.3s}
	.main-use-con .accordion-list .accordion-item .accordion-inner {margin-left: 0; transition: all 0.3s}
	.main-use-con .reference-list-con {padding-left: 2.7rem;}
	.accordion-item .accordion-info-box .inner {min-width: auto;}
	.accordion-item .accordion-info-box .txt-box .tit {font-size: 3rem;}
	.accordian-tit-box .accordian-tit {margin-left: 0; transform: translateX(-50%)}
	.accordian-tit-box .accordian-tit strong {writing-mode: initial;}
	.accordian-tit-box:before {transform: rotateZ(-90deg)}

	.main-use-con .accordion-list .accordion-item.active {height: auto !important;}
	.accordion-item.active .accordion-info-box {position: static;}

	.slide-container-partner {bottom: 2rem;}
	.main-partners-list .partner-item {margin: 0 2rem;}
}

@media all and (max-width: 800px) {
	.main-use-con .accordion-list-container {margin: 0 -2rem 3.5rem -2rem;}
	.main-use-con .accordion-list-box .accordion-list {flex-direction: initial;}
	.main-use-con .accordion-list .accordion-item {height: auto !important; box-sizing: border-box;}
	.main-use-con .accordion-list .accordion-item .accordion-inner {margin: 0 2rem;}
	.main-use-con .reference-list-con {padding-left: 0;}
	.accordion-item .accordian-tit-box, .accordion-item .accordion-info-box {position: static; height: 100%; opacity: 1 !important;}
	.accordion-item .accordion-info-box .txt-box .tit br {display: none;}
	.accordion-item .accordion-info-box .inner {flex-direction: column; opacity: 1; padding: 2rem 2rem 2.5rem 2rem;}
	.accordion-item .accordion-info-box .img-box {width: 100%;}
	.accordion-item .accordion-info-box .txt-box {display: flex; flex-direction: column; justify-content: space-between; flex-grow: 1; width: 100%; padding-left: 0; margin-top: 2rem; padding: 0 1.5rem;}

	.accordian-tit-box {display: none;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠3 (Solution) -------- */
@media all and (max-width: 800px) {
	#mainContent3 {padding-top: 10rem;}
	#mainContent3 .details-list-con {margin-bottom: 5rem;}
	#mainContent3 .details-list-wrap {display: flex !important; grid-gap: 0;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠4 (News) -------- */
@media all and (max-width: 800px) {
	#mainContent4 {padding-top: 6.7rem;}
	#mainContent4 .swiper-container {overflow: visible;}
	.main-news-list li a .txt-box .date {margin-top: 2.5rem;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠5 (Contact us) -------- */
@media all and (max-width:1280px){
	#mainContent5 {background: url("/images/main/main_bg.jpg") no-repeat bottom -20.7rem left 50% / cover;}
	.main-contact-wrap {padding: 5rem 0;}
}
@media all and (max-width:800px){
	/* #mainContent5 {background: url("/images/main/main_bg.jpg") no-repeat bottom -32rem left 50% / cover;} */
	#mainContent5 {padding-top: 8.5rem; background: none;}
	.main-contact-con {display: block;}
	.main-contact-con .left-con {width: 100%; padding-right: 0;}
	.main-contact-con .left-con .main-tit-box {text-align: center;}
	.main-contact-con .right-con {width: 100%;}
}
@media all and (max-width:480px){
	.main-inquiry-row {flex-wrap: wrap;}
	.main-inquiry-row {margin: 0 0 1rem;}
	.main-inquiry-row .main-inquiry-item {margin: 0 0 1rem; width: 100% !important;}
	.main-inquiry-row .main-inquiry-item:last-of-type {margin-bottom: 0;}

	.main-inquiry-bottom {flex-wrap: wrap;}
	.main-inquiry-bottom .agree-check-box {width: 100%; margin-bottom: 4rem;}
	.main-inquiry-btn {margin: 0 auto;}
}

/* ******************  메인 오른쪽 퀵메뉴 ********************** */
@media all and ( max-width: 1440px ){
	#rightBar{right:-56px;}
	#rightBar.fixed{visibility:hidden;opacity:0;}
}
/* ******************  메인 오른쪽 퀵메뉴 (Fullpage) ********************** */
@media all and (max-width:1366px){
	#fp-nav{right:10px;}
}
@media all and (max-width:1024px){
	#fp-nav{display:none;}
}