@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: 1024px) {
  .main-visual-txt-box .main-visual-txt1{font-size:4rem}
	.main-visual-txt-box .main-visual-txt1 em {font-size: 3rem;}
}


/* ******************  메인 컨텐츠 ********************** */
/* 헤더 */
.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("static/images/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;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠5 (Contact us) -------- */
@media all and (max-width:1280px){
	/*#contactModal {background: url("/images/main/main_bg.jpg") no-repeat bottom -20.7rem left 50% / cover;}*/
  /*#contactModal {padding-top: 8.5rem; background: none; position: absolute; top: 0; height: 70%; margin: 5rem 1.5rem}*/
	.main-contact-wrap {padding: 2rem 0; margin: 0 2rem;}
  .contact-modal-close {right: 0; top: -5rem;}
}
@media all and (max-width:800px){
	/* #contactModal {background: url("/images/main/main_bg.jpg") no-repeat bottom -32rem left 50% / cover;} */
	#contactModal {padding-top: 8.5rem; background: none; position: fixed; top: 0; height: 80%;}
  .main-contact-wrap-outer {display: block;}
	.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){
  #contactModal {padding-top: 10rem}
  /*.contact-modal-dialog {position: relative; display:flex; justify-content: center; width:80%; max-width: 1500px; height: 50vh; margin: 10px auto; background: #fff; border-radius: 12px; overflow: hidden; padding: 1rem;}*/
  .contact-modal-dialog {position: relative; display:flex; justify-content: center; width:80%; max-width: 1500px; height: 50vh; margin: 10px auto; background: #fff; border-radius: 12px; padding: 1rem;}
  .main-contact-wrap-outer {display: block;}
	.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;}
}




/* ******************  Privacy ********************** */
@media all and (max-width:1280px){
	/*#contactModal {background: url("/images/main/main_bg.jpg") no-repeat bottom -20.7rem left 50% / cover;}*/
  /*#privacyModal {padding-top: 8.5rem; background: none; position: absolute; top: 0; height: 70%;}*/
	.privacy-wrap {padding: 2rem 0; margin: 0 2rem;}
  .privacy-scrollbox {height: 50vh;}
}
@media all and (max-width:800px){
	/* #contactModal {background: url("/images/main/main_bg.jpg") no-repeat bottom -32rem left 50% / cover;} */
	#privacyModal {padding-top: 8.5rem; background: none; position: fixed; top: 0; height: 80%;}
}
@media all and (max-width:480px){
  #privacyModal {padding-top: 10rem}
  .privacy-modal-dialog {position: relative; display:flex; justify-content: center; width:80%; max-width: 1500px; height: 50vh; margin: 10px auto; background: #fff; border-radius: 12px; overflow: hidden; padding: 1rem;}
  .privacy-scrollbox {padding:1rem; height: 40vh;}
  .privacy-title-row {margin-bottom: 2rem;}
  .privacy-h1 {height: 2rem; font-size: 2rem;}
  .privacy-modal-close {bottom: 1.5rem;}
  .privacy-modal-close img {height: 2rem; width:2rem;}
}


/* footer */
@media (max-width: 1280px) {
  #footer {position: static; height: auto; padding: 60px 150px 80px; display: flex; flex-direction: column; border: 0; gap: 5rem;}
  .main-visual-txt-box {height: 60vh; display: flex; align-items: center;}
}

@media (max-width: 768px) {
  .footer-effect-btn .contact-btn {width: 240px; height: 56px;}
  .footer-effect-btn .contact-btn .cm-effect-svg {width: 240px; height: 50px;}
  .footer-effect-btn .contact-btn strong {font-size: 14px; line-height: 60px;}

  .footer-txt {width: 240px; padding-left: 20px}
  .footer-effect-btn .signature-dot {position: absolute; top: 21px; width: 0.5rem; height: 0.5rem; margin-left: 0.3rem;}
}

/*메인 타이틀*/
@media (max-width: 1024px) {
  #main-title {}
  .logo-row {display: flex; align-items: center; gap: 37px;}
  .logo-img {height: 100px; width: auto;}
  .region {font-size: 60px; margin-top: 20px}
}
@media (max-width: 768px) {
  #main-title {}
  .logo-row {display: flex; align-items: center; gap: 20px;}
  .logo-img {height: 75px; width: auto;}
  .region {font-size: 46px; margin-top: 17px}
}
@media (max-width: 480px) {
  .logo-img {height: 60px;}
  .logo-row {display: block;}
  .region {display: block; font-size: 36px; margin-top: 15px;}
}
