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

/* ******************  메인 비주얼 :: 처음들어왔을 때 효과 ********************** */
@media all and ( max-width: 800px ){
	.active-page .main-wrap #rightBar{bottom: 40px;}
}
/* ******************  메인 비주얼 ********************** */
/* @media all and ( max-width: 1920px ){
	.main-scroll-icon .wide-box{margin-right: 145px;}
}
@media all and (max-width:1700px){
	.main-scroll-icon .wide-box{margin: 0; padding:0 145px 0 var(--area-padding);}
} */
@media all and ( max-width: 1260px ){
	.main-visual-txt-con .main-visual-txt1,
	.main-visual-txt-con .main-visual-txt2{font-size: 50px;}
	.main-visual-txt-con .main-visual-more-btn{margin-top: 40px;}
	.main-visual-txt-con .main-visual-more-btn a{width: 170px; height: 55px; font-size: 16px; line-height: 55px;}
	/* .main-scroll-icon .wide-box{padding:0 175px 0 var(--area-padding);} */
}
@media all and ( max-width: 1024px ){
	.main-visual-txt-con .main-visual-txt1,
	.main-visual-txt-con .main-visual-txt2{font-size: 45px;}
	.main-visual-txt-con .main-visual-more-btn{margin-top: 35px;}
	.main-visual-txt-con .main-visual-more-btn a{width: 150px; height: 50px; font-size: 15px; line-height: 50px;}
}
@media all and ( max-width: 800px ){
	/* 메인 비주얼 :: 텍스트 */
	.main-visual-txt-con .main-visual-txt-box{padding-top: 0;}
	.main-visual-txt-inner{padding-bottom: 80px;}
	.main-visual-txt-con .main-visual-txt1,
	.main-visual-txt-con .main-visual-txt2{font-size: 35px;}
	.main-visual-txt-con .main-visual-more-btn{margin-top: 35px;}
	.main-visual-txt-con .main-visual-more-btn a{width: 140px; height: 40px; font-size: 12px; line-height: 40px;}
	/* 메인 비주얼 :: 스크롤아이콘 */
	.main-scroll-icon{bottom: 40px;}
	.main-scroll-icon .wide-box{text-align: left; text-align: center; padding:0 var(--area-padding);}
	.main-scroll-icon .scroll-icon{width:10px; height:18px; border:2px solid #fff;}
	.main-scroll-icon .scroll-icon:before{ left:4.5px; top:5px; width:2px; height:2px;}
	.main-scroll-icon .scroll-txt{margin-left: 10px; font-size: 11px;}
	/* 메인 비주얼 :: 컨트롤러 */
	#mainVisualControls{position:absolute; top: 50%; margin-top: 100px; bottom: auto; text-align: center;}
	/* 컨트롤러 :: 이전,다음 */
	#mainVisualControls .main-visual-arrow{margin-right: 0;}
	#mainVisualControls .main-visual-arrow:before{position: absolute; top: 50%; left: 50%; margin-top: -6px; margin-left: 0; display: block; content: ''; width: 2px; height: 14px; background-color: rgba(255,255,255,0.2);}
	#mainVisualControls .main-visual-arrow button{top: 0; margin-top: 0; display: inline-block; position: static; color:#fff; font-size:24px; text-align:center; width: 34px; height: 34px; background: none;}
	#mainVisualControls .main-visual-arrow button:after{display: none;}
	#mainVisualControls .main-visual-arrow button + button{margin-left: 25px;}
	#mainVisualControls .main-visual-arrow i{display: inline-block; vertical-align: middle;}
	/* 컨트롤러 :: 진행바 */
	.main-visual-swiper .main-visual-pagination.swiper-pagination{display: none !important;}
}
@media all and ( max-width: 480px ){
	
}

/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
@media all and ( max-width: 800px ){
	/* 공통 :: 타이틀 */
	.main-tit-box{margin-bottom:30px;}
	.main-tit-box .main-tit{padding-left: 45px; font-size:12px;}
	.main-tit-box .main-sub-tit{margin-top:20px; font-size:27px;}
	.main-tit-box .main-sub-txt{margin-top:15px; font-size:14px;}
	.animated .main-tit:before, .active-section .main-tit:before {width: 35px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠1(BUSINESS AREA) -------- */
@media all and ( max-width: 1260px ){
	.main-product-list .main-product-item .overlay .txt{display: none;}
}
@media all and ( max-width: 1024px ){
	#mainBusinessCon{padding:120px 0 140px;}
	#mainBusinessCon .main-tit-box{position: relative; padding-right: 0; padding-bottom: 80px;}
	.main-business-tab-wrapper {bottom: 0; right: auto; left: 50%; transform: translateX(-50%) !important; margin-left: -20px;}
	.main-product-list .main-product-item {width:50%;}
	.main-product-list .main-product-item .overlay .txt{display: block;}
}
@media all and ( max-width: 800px ){
	#mainBusinessCon{padding: 40px 0 65px;}

	/* 탭 */
	#mainBusinessCon .main-tit-box{padding-bottom: 60px; margin-bottom: 20px;}
	.main-business-tab-wrapper{margin-left: -15px; width: 300px;}
	.main-business-tab{}
	.main-business-tab li{padding-left:30px;}
	.main-business-tab li:before{margin-top: -2px; left: 15px; width: 4px; height: 4px;}
	.main-business-tab li a{font-size: 14px; line-height: 30px;}
	.main-business-tab-wrapper .move-line{top: 23px;}
	.main-business-tab-wrapper .move-line span i{font-size: 13px;}

	/* Direction Hover */
	.main-product-list .main-product-item .overlay .inner-box {padding:15px;}
	.main-product-list .main-product-item .overlay .tit {font-size: 19px;}
	.main-product-list .main-product-item .overlay .txt {display: none;}
	.main-product-list .main-product-item .overlay .btn{margin-top: 15px; width: 100%;}
	.main-product-list .main-product-item .overlay .btn ul{margin: 0 -4px; display: flex; justify-content: center;}
	.main-product-list .main-product-item .overlay .btn li{max-width: 80px; width: calc(50% - 8px); margin: 0 4px;}
	.main-product-list .main-product-item .overlay .btn li a{height: 32px; line-height: 30px; font-size: 11px;}
	.main-product-list .main-product-item .overlay .btn li a i{top: 1px; margin-left: 5px; font-size: 12px; line-height: 30px;}
}
@media all and ( max-width: 480px ){
	.main-product-list .main-product-item .overlay .inner-box {padding:10px;}
	.main-product-list .main-product-item .overlay .btn ul{margin: -2.5px; flex-direction: column; align-items: center;}
	.main-product-list .main-product-item .overlay .btn li{max-width: 80px; width: calc(100% - 5px); margin: 2.5px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠2(HOMESCARE SERVICE) -------- */
@media all and ( max-width:1560px ){
	.main-homescare-txt .pc-br{display: none;}
}
@media all and ( max-width: 1024px ){
	#mainHomescareCon{padding:120px 0 155px;}
}
@media all and ( max-width: 800px ){
	#mainHomescareCon{padding:50px 0 80px;}
	.main-homescare-item a{padding-top: 450px;}
	.main-homescare-txt .num{font-size: 45px;}
	.main-homescare-txt .num:after{margin: 20px 0; width: 15px; height: 2px;}
	.main-homescare-txt .tit{font-size: 20px;}
	.main-homescare-txt .txt{margin-top: 25px; font-size: 12px;}
	.main-homescare-txt .btn{margin-top: 20px; font-size: 11px;}
	.main-homescare-txt .btn i{top: 2px; margin-left: 5px; font-size: 12px;}

	.main-homescare-list .slick-dots{bottom: -40px;}
	.main-homescare-list .slick-dots li{margin-left:8px;}
	.main-homescare-list .slick-dots li button{width:8px; height:8px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠3(REVIEW) -------- */
@media all and ( max-width:1720px ){
	.main-review-list .slick-arrow{top: auto; left: 50%; right: auto; bottom: -80px; margin-top: 0;}
	.main-review-list .slick-prev{margin-left: -100px;}
	.main-review-list .slick-next{margin-left: 50px;}
	.main-review-list .slick-dots{visibility: visible;}
}
@media all and ( max-width:1560px ){
	.main-review-txt .pc-br{display: none;}
}
@media all and ( max-width: 800px ){
	#mainReviewCon {padding: 50px 0 80px;}
	
	.main-review-item a{padding: 40px 11% 45px;}
	.main-review-txt .tit{font-size: 20px;}
	.main-review-txt .txt{margin-top: 20px; font-size: 13px;}
	.main-review-info{margin-top: 45px; padding-right: 90px;}
	.main-review-info em{font-size: 11px;}
	.main-review-info .btn{font-size: 11px;}
	.main-review-info .btn i{top: 2px; margin-left: 3px; font-size: 12px;}

	.main-review-list .slick-arrow{bottom: -53px; width: 40px; height: 40px;}
	.main-review-list .slick-prev{margin-left: -95px;}
	.main-review-list .slick-next{margin-left: 55px;}
	.main-review-list .slick-arrow i{font-size: 24px;}

	.main-review-list .slick-dots{bottom: -40px;}
	.main-review-list .slick-dots li{margin-left:8px;}
	.main-review-list .slick-dots li button{width:8px; height:8px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠4(CUSTOMER) -------- */
@media all and ( max-width:1260px ){
	.main-customer-news{margin: 0 -2%;}
	.main-customer-news-item{width: 29.33%; margin: 0 2%;}
}
@media all and ( max-width:1024px ){
	.main-customer-con{display: block;}
	.main-customer-tit{position: relative; width: 100%;}
	.main-customer-tit .btn{position: absolute; top: 50%; margin-top: -6.5px; right: 0;}
	.main-customer-board{width: 100%;}
	.main-customer-faq-btn{justify-content: center;}
}
@media all and ( max-width:800px ){
	#mainCustomerCon{padding: 60px 0;}
	#mainCustomerCon:before{position: absolute; top: 0; left: 0; content: ''; width: 841px; height: 1387px; background: url("../images/main/main_customer_bg.png") left top no-repeat;}

	.main-customer-con + .main-customer-con{margin-top: 80px;}
	.main-customer-tit h5{margin-bottom: 15px; font-size: 40px;}
	.main-customer-tit .btn{margin-top: -5.5px; font-size: 11px;}
	.main-customer-tit .btn i{top: 0; margin-left: 3px; font-size: 11px;}
	/* faq */
	.main-customer-faq .faq-item dt{padding:15px 35px 15px 40px;}
	.main-customer-faq .faq-item dt .faq-title{font-size:12px; line-height:18px;}
	.main-customer-faq .faq-item dt .arrow{right: 10px; top:16px;}
	.main-customer-faq .faq-item dd{padding:15px 10px;}
	.main-customer-faq .faq-item dt .question-icon,
	.main-customer-faq .faq-item dd .answer-icon{top:14px; left:10px; width:20px; height:20px; line-height:20px; font-size:11px;}
	.main-customer-faq .faq-item dd .answer-icon{display:block; position:static; margin-bottom:10px;}
	.main-customer-faq .faq-item dd .editor{font-size:13px;}
	.main-customer-faq-btn{margin-top: 20px;}
	.main-customer-faq-btn a{width: 150px; height: 45px; font-size: 14px;}
	/* news */
	.main-customer-news{margin: 0 -6px;}
	.main-customer-news-item{width: calc(50% - 12px); margin: 0 6px;}
	.main-customer-news .main-customer-news-item:nth-child(2)~*{display: none;}
	.main-customer-news-item a{padding-top: 15px;}
	.main-customer-news-item a .date{font-size: 13px;}
	.main-customer-news-item a .tit{margin-top: 10px; font-size: 15px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠5(PR) -------- */
@media all and ( max-width:1260px ){
	.main-sns-list li{margin-left: 120px;}
	.main-sns-list li:before{left: -60px;}
}
@media all and ( max-width:1024px ){
	.main-sns-list li{margin-left: 90px;}
	.main-sns-list li:before{left: -45px;}
	.main-sns-list li a span{margin-right: 20px; font-size: 19px;}
	.main-sns-list li a i{font-size: 50px;}
}
@media all and ( max-width:800px ){
	#mainPrCon{padding: 85px 0 50px;}

	#mainPrCon .video-cover-box:after {background-size: 60px !important;}

	.main-sns-wrapper{margin-top: 30px;}
	.main-sns-list li{margin-left: 40px;}
	.main-sns-list li:before{display: none;}
	.main-sns-list li a span{display: none;}
	.main-sns-list li a i{font-size: 38px;}
	.main-sns-list li a img{height: 28px; 
	image-rendering: -moz-crisp-edges;/* Firefox */
	image-rendering:   -o-crisp-edges;         /* Opera */
	image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */ 
	image-rendering: crisp-edges; 
	-ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */}
}


/* -------- 메인 컨텐츠 :: 컨텐츠6(CONTACT) -------- */
@media all and ( max-width:1260px ){
	.main-contact-txt .pc-br{display: none;}
}
@media all and ( max-width:1024px ){
	.main-contact-item{width: 100%;}
	.main-contact-item a{padding: 58px 11% 60px; display: flex; align-items: center; justify-content: space-between; flex-direction: row-reverse;}
	.main-contact-txt{margin-top: 0; width: calc(100% - 100px); text-align: left;}
}
@media all and ( max-width:800px ){
	#mainContactCon{padding: 55px 0;}
	.main-contact-item a{padding: 20px 11%;}
	.main-contact-img img{height: 40px;}
	.main-contact-txt{width: calc(100% - 60px);}
	.main-contact-txt h5{font-size: 17px;}
	.main-contact-txt p{margin-top: 10px; font-size: 12px;}
	.main-contact-txt .pc-br{display: block;}
}