@charset "utf-8";
/* ----------
main.css
---------- */

/* ******************  200515 메인리뉴얼 ********************** */
#mainVisual{position:relative; overflow:hidden; background:#fff; height:777px; }
/* -------- 메인 동영상 -------- */
.visual-video-bg{position:relative; left:50%; width:1920px; height:777px; margin-left:-960px; }
.visual-video-bg:after{position:absolute; top:0px; left:0px; right:0px; bottom:0px; content:""; }
.embed-container { position: relative; padding-top:56.25%; overflow: hidden; max-width: 100%; } 
.embed-container iframe, 
.embed-container object, 
.embed-container embed { position: absolute; top: 50%; margin-top:-40%; left: 0; width: 100%; height: 100%; }

/* -------- 메인 비주얼 롤링 -------- */
/* 메인 비주얼 :: 텍스트 */
.visual-cover-txt-con{position:absolute; left:0; top:100px; width:100%; bottom:345px; z-index:1; text-align:center; }
.visual-cover-txt-con .visual-cover-txt-inner{display:table; width:100%; height:100%; opacity:0; }
.visual-cover-txt-con .visual-cover-txt-inner-con{display:table-cell; vertical-align:middle; }
.visual-cover-txt-con .visual-txt1{margin-bottom:22px}	
#mainVisual.active .visual-cover-txt-inner{
	-webkit-animation: text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation: text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;
}
@-webkit-keyframes text-active-animation {
from {
	opacity:0;filter:Alpha(opacity=0);
	-ms-transform: translateY(-30px); 
	-o-transform: translateY(-30px); 
	-moz-transform: translateY(-30px);
	-webkit-transform: translateY(-30px); 
	transform: translateY(-30px); 
}
to {
	opacity:1.0;filter:Alpha(opacity=100);
	-ms-transform: translateY(0); 
	-o-transform: translateY(0); 
	-moz-transform: translateY(0);
	-webkit-transform: translateY(0); 
	transform: translateY(0); 
}
}
@keyframes text-active-animation {
from {
	opacity:0;filter:Alpha(opacity=0);
	-ms-transform: translateY(-30px); 
	-o-transform: translateY(-30px); 
	-moz-transform: translateY(-30px);
	-webkit-transform: translateY(-30px); 
	transform: translateY(-30px); 
}
to {
	opacity:1.0;filter:Alpha(opacity=100);
	-ms-transform: translateY(0); 
	-o-transform: translateY(0); 
	-moz-transform: translateY(0);
	-webkit-transform: translateY(0); 
	transform: translateY(0); 
}
}	

/* 메인 비주얼 :: 온라인예약/간편견적신청 버튼 */
.visual-quick-menu-box{position:absolute; bottom:190px; left:50%; width:256px; margin-left:-128px; z-index:11;}
.quick_btn{}
.quick_btn li{}
.quick_btn li.btn1{background-color:#00b7f3; margin-bottom:11px;}
.quick_btn li.btn2{background-color:#fff;}
.quick_btn li > a{display:block; position:relative; font-size:18px; line-height:66px; padding:0 55px; border:3px solid #fff; color:#00b7f3; text-align:left;}
.quick_btn li > a:after{position:absolute; right:55px; top:50%; margin-top:-8px; width:8px; height:17px; content:""; background:url('../../assets/images/main_online_arrow_b_e2f3185443.png') no-repeat}
.quick_btn li.btn1 > a{color:#fff; border-color:#00b7f3;}
.quick_btn li.btn1 > a:after{background-image:url('../../assets/images/main_online_arrow_w_a1ac715293.png')}
.quick_btn li.btn1 a:hover{border:3px solid #fff;}
.quick_btn li.btn2 a:hover{border:3px solid #00b7f3;}

/* 메인 비주얼 :: 이미지 */
.visual-img-rolling-container{height:100%; }
.main-visual-con .slick-track,
.main-visual-con .slick-list {
	 -webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.main-visual-con, 
.main-visual-con .slick-list,  
.main-visual-con .slick-track, 
.main-visual-item{
	height:100%;
}
.main-visual-item a{display:block; height:100%;}
.main-visual-con{z-index:1;}
.main-visual-item{position:relative;}
.main-visual-item .main-visual-pc-img{
	width:100%;
	height:100%;
	background-size:cover !important;
}
/* 메인 비주얼 :: dots */
.main-visual-con .slick-dots{position:absolute; width:100%; text-align:center; bottom:53px;}
.main-visual-con .slick-dots li{display:inline-block; margin:0 5px ; }
.main-visual-con .slick-dots li button{
	cursor:pointer; margin:0px; padding:0px; background:none; border:0; font-size:0; width:15px; height:15px; background-color:#fff; 
	-webkit-border-radius:15px;-moz-border-radius:15px;-o-border-radius:15px;border-radius:15px;
	transition:all 0.4s
}
.main-visual-con .slick-dots li.slick-active button{width:53px; background-color:#00b7f3;}		/* 버튼 active */


/* ******************  메인 공통  ********************** */
#mainContent{font-family:"Nanum Square","NanumSquare",sans-serif;}
.main-tit-box{text-align:center; margin-bottom:60px; letter-spacing:-0.25px; font-weight:700; color:#303030; }
.main-tit-box .main-en-tit{display:block; font-size:20px; font-family:Arial ,"Nanum Square","NanumSquare",sans-serif; margin-bottom:20px; color:#c0c0c0; text-transform:uppercase}
.main-tit-box .main-cm-tit{font-size:42px; font-weight:400; /* color:#fff; */}
/* 2022-10-13 텍스트 추가 */
.main-tit-box .community-label {position: relative; top:-2px; background:#00b7f3; color:#fff; font-size:12px; padding:3px 5px;}
.main-tit-box .main-sub-tit{display:inline-block;font-size: 18px;font-family:Arial ,"Nanum Square","NanumSquare",sans-serif;margin-bottom:20px;/* color:#747474; */ color:#fff; text-transform:uppercase;font-weight: 400; padding-left:10px;}
/* ******************  프로모션  ********************** */
#mainPromotionContent{padding:56px 0; background-color:#212237;}
#mainPromotionContent .main-tit-box .main-cm-tit {color:#fff;}
#mainPromotionContent.main-page .main-tit-box .main-cm-tit {color:#303030;}
#mainPromotionContent.main-page {background-color:#f1f3f8;}
#mainPromotionContent.main-page .main-tit-box .main-sub-tit {color:#747474;}
#mainPromotionContent.main-page .main-cm-tit {color:#303030;}
#mainPromotionContent .main-tit-box{margin-bottom:35px;}
.main-promotion-inner-box{position:relative; max-width:1192px; margin:0px auto;}
.main-promotion-inner-box:before{position:absolute; top:0px; bottom:0px; left:486px; width:1px; content:""; background-color:#d2d2d2}
/* 상시이벤트 */
.all-day-event-con{float:left; width:419px; margin-top:13px;}
.all-day-event-con a{display:block; text-align:right;}
.all-day-event-con .event-thumb{display:block; width:100%; height:242px; }
.all-day-event-con .event-thumb img{max-width:100%; max-height:100%;}
.all-day-event-con .all-event-tit{display:block; margin-top:20px; color:#303030; font-size:16px; letter-spacing:-0.25px; font-weight:400;}
.all-day-event-con a:hover .all-event-tit{color:#00b7f3;}
.all-day-event-con a .event-tit-dotted{position: relative; display:inline-block; font-size:13px; letter-spacing:-0.25px; color:#303030; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:400; margin-top:7px; padding:0 10px; box-sizing:border-box; max-width:100%;}
.all-day-event-con a .event-tit-dotted:before{position: absolute; content:""; width:6px; height:6px; border-radius:50%; background:#616161; top:3px; left:0;}
.all-day-event-con a .event-tit-dotted:after{position: absolute; content:""; width:6px; height:6px; border-radius:50%; background:#616161; top:3px; right:0;}
/* 진행중이벤트 리스트 */
.ing-event-con{float:right; width:652px; margin-top:13px;}
.ing-event-con .main-tit-box{text-align:left;}
.ing-event-con .ing-event-list-con li{float:left; width:208px; margin-left:14px}
.ing-event-con .ing-event-list-con li:first-child{margin-left:0}
.ing-event-con .ing-event-list-con li a{display:block; text-align:right}
.ing-event-con .ing-event-list-con li a .event-thumb{display:block; width:208px; height:126px;}
.ing-event-con .ing-event-list-con li a .event-thumb img{width:100%; height:100%;}
.ing-event-con .ing-event-list-con li a .event-tit{display:block; font-size:16px; letter-spacing:-0.25px; color:#303030; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:400; margin-top:17px;}
.ing-event-con .ing-event-list-con li a .event-tit-dotted{position: relative; display:inline-block; font-size:13px; letter-spacing:-0.25px; color:#303030; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:400; margin-top:7px; padding:0 10px; box-sizing:border-box; max-width:100%;}
.ing-event-con .ing-event-list-con li a .event-tit-dotted:before{position: absolute; content:""; width:6px; height:6px; border-radius:50%; background:#616161; top:3px; left:0;}
.ing-event-con .ing-event-list-con li a .event-tit-dotted:after{position: absolute; content:""; width:6px; height:6px; border-radius:50%; background:#616161; top:3px; right:0;}


/* ******************  제작 및 홍보영상  ********************** */
#mainVideoContent{padding:145px 0 194px;}
/* 홍보영상 :: 헤드라인 */
.main-video-headline-con .headline-left-con{position:relative; float:left; width:612px; height:320px;}
.main-video-headline-con .headline-left-con dl{padding:25px 0 0 0;}
.main-video-headline-con .headline-left-con dl dt{margin-bottom:35px; color:#c0c0c0; font-weight:600; font-size:20px;}
.main-video-headline-con .headline-left-con dl dt img{margin-right:15px; margin-bottom:6px}
.main-video-headline-con .headline-left-con dl dd{color:#454545; line-height:1.88; font-size:17px; letter-spacing:-0.2px; letter-spacing:-0.5px; word-spacing:-0.4px }
.main-video-headline-con .headline-left-con .youtube-icon{position:absolute; bottom:0px; right:0px;}
.main-video-headline-con .headline-right-con{position:relative; float:right; width:615px;}
.main-video-headline-con .headline-right-con .play-icon{position:absolute; top:50%; left:50%; margin:-56px 0 0 -60px}
/* 홍보영상 리스트 */
.main-video-list-con{margin-top:42px;}
.main-video-list-con li{float:left; width:390px; margin-left:45px;}
.main-video-list-con li:first-child{margin-left:0}
.main-video-list-con li a{position:relative; display:block; overflow:hidden;}
.main-video-list-con li .play-icon{position:absolute; top:50%; left:50%; margin:-56px 0 0 -60px; transform:scale(0.6); opacity:0.8}
.main-video-list-con li .ad-info-box{padding-top:20px;} 
.main-video-list-con li .ad-info-box dt{position:relative; color:#c0c0c0; font-size:18px; letter-spacing:-0.2px; margin-bottom:22px; padding-right:70px}
.main-video-list-con li .ad-info-box dt em{font-weight:600}
.main-video-list-con li .ad-info-box dt em,
.main-video-list-con li .ad-info-box dt img{vertical-align:middle; display:inline-block;}
.main-video-list-con li .ad-info-box dt .youtube-icon{position:absolute; top:5px; right:0px;}
.main-video-list-con li .ad-info-box dd{color:#454545; font-size:17px; line-height:32px; }

/* youtube 바로가기 */
.youtube-btn {display:inline-block; position:relative; font-size:16px; line-height:1.5; letter-spacing:-0.025em; color:#c0c0c0; border:1px solid #c0c0c0; padding:15px 40px 15px 40px; margin-top:45px; transition:all 0.3s;}
/* .youtube-btn:after {display:block; content:""; position:absolute; top:50%; right:35px; transform:translateY(-50%); width:6px; height:12px; background: url(../images/main/youtube_arrow.png)no-repeat; background-size:cover;} */
.youtube-btn .arrow {display: inline-block;
    width: 6px;
    height: 12px;
    background: url('../../assets/images/main_brand_story_arrow_751e632aad.png');
    transition: all 0.3s;
    margin-left: 12px;
    vertical-align: middle;
    position: relative;
    top: -1px;}
.youtube-btn:hover {background-color:#00b7f3; color:#fff; border-color:#00b7f3;}
.youtube-btn:hover .arrow {background: url('../../assets/images/main_brand_story_arrow_wh_ca0cd2182e.png');}
/* ******************  기업서비스  ********************** */
#mainService2{/* width:100%; background-color:#00b7f3; padding:38px 0 63px; padding-top:380px; */ position:relative;}
#mainService2 > div.area{overflow:hidden; text-align:center;}
#mainService2 > div > p{float:left; display:inline-block; font-size:16px; letter-spacing:-0.5px; color:#fff; margin:119px 0 0 82px;}
#mainService2 .mainservice2-btn {position:absolute; bottom:85px; left:350px; border:1px solid #00b7f3; padding:15px 50px 15px 30px; transition:all 0.3s;}
#mainService2 .mainservice2-btn em {font-size:16px; line-height:1.5; letter-spacing:-0.03em; color:#00b7f3;}
#mainService2 .mainservice2-btn:after {display:block; content:""; position:absolute; top:50%; right:30px; transform:translateY(-50%); width:6px; height:12px; background: url('../../assets/images/mainservice2_arrow_ddb6086153.png')no-repeat; background-size:cover;}
#mainService2 .mainservice2-btn:hover {background:#00b7f3;}
#mainService2 .mainservice2-btn:hover em{color:#fff;}
#mainService2 .mainservice2-btn:hover:after {background: url('../../assets/images/mainservice2_arrow_on_f69077ae72.png')no-repeat; background-size:cover;}
.main-more-business-btn{margin-top:40px;}
.main-more-business-btn a{display:block; width:666px; height:50px; border:1px solid #fff; margin:0 auto; font-size:20px; line-height:50px; letter-spacing:-0.6px; color:#fff; }
.main-more-business-btn .more-icon{display:inline-block; position:relative; top:1px;width:16px; height:17px; margin-left:10px; background:url('../../assets/images/more_btn01_561c72ce91.png') no-repeat}
.main-more-business-btn a:hover { color:#00b7f3; background-color:#fff;}
.main-more-business-btn a:hover .more-icon{top:2px;background-image:url('../../assets/images/more_btn02_61c712ed95.png')}


/* ******************  한스클린 소식과 정보  ********************** */
#mainNoticeInfoContent{padding:125px 0 170px;}
/* 한스클린 소식 */
#mainNoticeCon{float:left; position:relative; width:600px;}
.main-notice-tit{color:#303030; font-size:18px; letter-spacing:-0.5px; margin-bottom:8px;}
.main-notice-tit .category-txt{display:inline-block; background-color:#303030; color:#fff; font-weight:600; font-size:12px; letter-spacing:-0.15px; padding:3px 4px 2px 5px; vertical-align:middle}
.main-notice-tit strong{margin-left:7px; line-height:28px;}
.main-notice-more-btn{position:absolute; top:0px; right:0px; width:75px; height:24px; border:1px solid #c8c8c8; color:#9d9d9d; font-size:12px; line-height:24px; text-align:center;}
.main-notice-container{padding:20px 9px; border-top:2px solid #303030; border-bottom:1px solid #303030;}
.main-notice-container li:first-child{border-bottom:1px solid #c8c8c8;}
.main-notice-container li a{display:block; padding:20px 0; overflow:hidden;}
.main-notice-container li a .notice-thumb{float:left; display:block; width:182px; height:100px; margin-right:20px; overflow:hidden;}
.main-notice-container li a .notice-thumb img{width:100%; /* height:100%; */}
.main-notice-container li a .notice-info-box{float:left; width:370px; padding:8px 0;}
.main-notice-container li a .notice-info-box dt{height:48px; overflow:hidden; width:270px; color:#151515; font-size:14px; line-height:24px; letter-spacing:-0.2px; }
.main-notice-container li a .notice-info-box dd{color:#aaa; font-size:14px; letter-spacing:-0.2px; text-align:right; margin-top:25px;}
.main-notice-container li a:hover .notice-info-box dt{color:#00b7f3}
/* 한스클린 특허 및 허가 */
#mainInfoCon{float:right; width:621px;}
.main-info-tab-list-con li{float:left; width:33.33%; text-align:center;}
.main-info-tab-list-con li a{display:block; height:36px; border-bottom:2px solid #c8c8c8; color:#c8c8c8; font-size:18px; letter-spacing:-0.2px; line-height:31px}
.main-info-tab-list-con li.selected a{border-bottom-color:#303030; color:#303030;}
.main-info-tab-wrapper{height:325px; border:1px solid #c8c8c8; border-top:0}
.main-info-tab-wrapper .main-info-con{padding:28px; text-align:center; }


/* ******************  한스클린 퍼포먼스  ********************** */
#mainPerformanceContent{margin-bottom:185px;}
/* 한스클린 퍼포먼스 텍스트 */
.performance-rolling-txt-box dl{text-align:center; color:#303030; font-size:22px; letter-spacing:-0.5px; margin-bottom:30px;}
.performance-rolling-txt-box dl dt{font-size:30px; margin-bottom:13px; font-weight:400;}			
/* 퍼포먼스 리스트 :: dots */
.performance-rolling-img-box .slick-dots{text-align:center; margin-top:30px;}
.performance-rolling-img-box .slick-dots li{display:inline-block; margin:0 3px ; }
.performance-rolling-img-box .slick-dots li button{
	cursor:pointer; margin:0px; padding:0px; background:none; border:0; font-size:0; width:17px; height:8px; background-color:#bfbfbf; 
	-webkit-border-radius:15px;-moz-border-radius:15px;-o-border-radius:15px;border-radius:15px;
	transition:all 0.4s
}
.performance-rolling-img-box .slick-dots li.slick-active button{width:58px; background-color:#00b7f3;}


/* ******************  한스클린 실제후기  ********************** */
#mainReviewContent{margin-bottom:185px;}
/* 베스트리뷰 */
#mainBestReveiwCon{overflow:hidden; float:left; position:relative; width:624px;}
.main-best-review-list{margin:0 -4px}
.main-best-review-list ul{}
.main-best-review-list li{float:left; width:308px; margin:0 4px;}
.main-best-review-list li a{display:block;}
.main-best-review-list li .review-thumb{display:block; width:100%; height:215px;}
.main-best-review-list li .review-thumb img{width:100%; height:100%;}
/* 실시간 후기 */
#mainRealTimeReviewCon{float:right; position:relative; width:624px;}
.main-realtime-review-list-con{border:1px solid #c8c8c8; border-top:2px solid #303030; padding:13px 0 0 0;}
.real-time-review-list > ul{padding:0 15px; width:595px;}
.real-time-review-list > ul li{width:100%; height:39px; border-bottom:1px dotted #b0b0b0;}
.real-time-review-list > ul li:last-child{border-bottom:0}
.real-time-review-list > ul li > a{font-size:13px; line-height:39px; letter-spacing:-0.5px; color:#7b7b7b; overflow:hidden;}
.real-time-review-list > ul li > a > span.board-tit{float:left; width:380px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:inline-block;}
.real-time-review-list > ul li > a > span.board-tit > img{margin-left:5px;}
.real-time-review-list > ul li > a > span.board-day{float:right;}
.real-time-review-list > ul li > a:hover{color:#26a4ea}
/* 하단 배너 */
#reviewBottomBanner{clear:both; margin:0 -9px; padding-top:47px}

/* ******************  한스클린과 상담하세요  ********************** */
#mainConsulting{margin:0 0 157px; }
#mainConsulting .water-img-con img{position:relative; left:50%; margin-left:-960px}
#mainConsulting .con-txt{position:relative;width:100%; padding:65px 0 60px;  background-color:#00b7f3}
#mainConsulting .con-txt:after{position:absolute; bottom:-33px; left:50%; margin-left:-32px; width:65px; height:33px; content:""; background:url('../../assets/images/main_consulting_arrow_2aaea545e9.jpg')}
.con-txt > article.area > h2{display:block; text-align:center;padding-bottom:15px; color:#fff; letter-spacing:-0.2px; font-size:42px; font-weight:600;}
.con-txt > article.area > p{text-align:center; font-size:22px; line-height:26px; color:#fff; margin-bottom:45px; letter-spacing:-0.3px; }
.con-txt > article.area > .tel-box{text-align:center;}
.tel-box > a{width:210px; height:66px; display:inline-block; margin-right:30px; font-size:16px; line-height:66px; letter-spacing:-0.5px; color:#462a29; font-weight:600; background-color:#fff; border-radius:10px; box-shadow:10px 10px 10px rgba(100, 100, 100, .3);}
.tel-box > a:last-child{margin-right:0px;}
.tel-box > a > img{margin-right:5px;}


/* ******************  한스클린 통계  ********************** */
#mainStatisticsCon{max-width:1042px; margin:0px auto 185px;}
#mainStatisticsCon .main-tit-box{margin-bottom:75px;}
#mainStatisticsCon .statics-tit{color:#303030; font-size:17px; letter-spacing:-0.2px; font-weight:600; margin-bottom:22px;}
.main-statics-top-con{margin-bottom:40px;}
/* 최근 3년간 누적 고객수 */
.main-statics-left-con{float:left; width:505px;}
.statics-customer-num-chart{position:relative; height:240px; background:url('../../assets/images/main_customer_num_bg_23bb141122.jpg') no-repeat; }
.statics-customer-num-chart .chart-line{position:absolute; top:0px; bottom:0px; left:0; width:0; transition:all 1s linear}
.statics-customer-num-chart .gray-line{background:url('../../assets/images/chart_gray_line_70a60cfd6a.png') no-repeat 0 115px;}
.statics-customer-num-chart .skyblue-line{background:url('../../assets/images/chart_skyblue_line_5856595a2d.png') no-repeat 0 25px; transition-delay:0.3s}
.statics-customer-num-chart .blue-line{background:url('../../assets/images/chart_blue_line_4e9084fe67.png') no-repeat 0 15px; transition-delay:0.7s}
.statics-customer-num-chart .chart-year{transition:all 0.5s; opacity:0;}
.statics-customer-num-chart .gray-year{position:absolute; bottom:65px; right:10px; transition-delay:0.5s}
.statics-customer-num-chart .skyblue-year{position:absolute; top:40px; right:178px; transition-delay:0.8s}
.statics-customer-num-chart .blue-year{position:absolute; top:-3px; right:69px; transition-delay:1.5s}
.statics-customer-num-chart.active .chart-line{width:100%}
.statics-customer-num-chart.active .chart-year{opacity:1.0}

[data-aos="chart-active"].aos-animate .chart-line{
	width:100%;
}
[data-aos="chart-active"].aos-animate .chart-year{
	opacity:1.0
}

/* 국내 상위 업체와의 격차 */
.main-statics-right-con{float:right; width:500px;}
.statics-company-gap-chart{position:relative; height:273px; background:url('../../assets/images/main_company_gap_bg_a556d4c1f6.jpg') no-repeat; }
.statics-company-gap-chart .gap-txt{position:absolute; top:-40px; right:0px; color:#303030; font-size:12px;}
.company-gap-list{position:absolute; top:10px; left:0px; right:0px; bottom:34px; }
.company-gap-list li{float:left; position:relative; width:20px; height:100%; background-color:#c6c6c6; margin-left:91px}
.company-gap-list li:after{position:absolute; bottom:0px; left:0; width:100%; height:0px; content:""; transition:all 1s linear;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#008bdb+0,00b7f3+100 */
	background: rgb(0,139,219); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,139,219,1) 0%, rgba(0,183,243,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,139,219,1) 0%,rgba(0,183,243,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,139,219,1) 0%,rgba(0,183,243,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#008bdb", endColorstr="#00b7f3",GradientType=0 ); /* IE6-9 */
}
.company-gap-list li:first-child{margin-left:71px}
.company-gap-list .hans-clean-company:after{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#003dac+0,0073e9+49,1a66b4+99 */
	background: rgb(0,61,172); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,61,172,1) 0%, rgba(0,115,233,1) 49%, rgba(26,102,180,1) 99%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,61,172,1) 0%,rgba(0,115,233,1) 49%,rgba(26,102,180,1) 99%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,61,172,1) 0%,rgba(0,115,233,1) 49%,rgba(26,102,180,1) 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#003dac", endColorstr="#1a66b4",GradientType=0 ); /* IE6-9 */

}
[data-aos="chart-active"].aos-animate .company-gap-list li:nth-child(1):after{height:142px;}
[data-aos="chart-active"].aos-animate .company-gap-list li:nth-child(2):after{height:102px;}
[data-aos="chart-active"].aos-animate .company-gap-list li:nth-child(3):after{height:135px;}
[data-aos="chart-active"].aos-animate .company-gap-list .hans-clean-company:after{height:203px; transition-duration:1.5s}

/* 홈페이지 누적 이용고객 */
.homepage-customer-num-con{width:100%; height:215px; padding:23px 26px 26px 23px; box-sizing:border-box; background-color:#f2f4fa}
.today-num-box{margin-bottom:32px;}
.today-num-box .today-date{float:left; color:#303030; font-size:12px; letter-spacing:-0.2px;}
.today-num-box .nujuk-hompage-num{float:right; color:#303030; font-size:17px; letter-spacing:-0.2px;}
.today-num-box .nujuk-hompage-num dt{display:inline-block; vertical-align:middle; font-weight:600; margin-right:15px;}
.today-num-box .nujuk-hompage-num dd{display:inline-block; vertical-align:middle; font-weight:600;}
.today-num-box .nujuk-hompage-num dd strong{display:inline-block; font-size:34px;}
.homepage-number-box h4{color:#303030; font-size:17px; letter-spacing:-0.3px; font-weight:400; text-align:center; margin-bottom:28px;}

/* 보유 현장팀 */
.main-statics-own-box{float:left; width:245px; box-sizing:border-box; background-color:#f2f4fa; height:215px; padding:23px 26px 26px 23px; }
.main-statics-own-box:first-child{margin-right:30px}
.main-statics-own-box h4{color:#303030; font-size:17px; letter-spacing:-0.2px; margin-bottom:14px;}
.own-team-list-con li{margin-bottom:8px;}
.own-team-list-con li dl{overflow:hidden;}
.own-team-list-con li dt{color:#303030; font-size:12px; margin-bottom:3px; font-weight:600;}
.own-team-list-con li dd .line{float:left; position:relative; width:166px; height:8px; background-color:#d3d6db}
.own-team-list-con li dd .line:after{position:absolute; top:0px; bottom:0px; left:0; width:0; content:""; transition:all 1s }
.own-team-list-con li dd .num{float:right; color:#303030; font-size:12px; }

.own-team-list-con li:nth-child(1) dd .line:after{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#3875ff+0,124ac9+100 */
	background: rgb(56,117,255); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(56,117,255,1) 0%, rgba(18,74,201,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(56,117,255,1) 0%,rgba(18,74,201,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(56,117,255,1) 0%,rgba(18,74,201,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#3875ff", endColorstr="#124ac9",GradientType=1 ); /* IE6-9 */
}
.own-team-list-con li:nth-child(2) dd .line:after{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#676de7+0,6d09de+100 */
	background: rgb(61,167,235); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(61,167,235,1) 0%, rgba(0,125,189,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(61,167,235,1) 0%,rgba(0,125,189,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(61,167,235,1) 0%,rgba(0,125,189,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#676de7", endColorstr="#6d09de",GradientType=1 ); /* IE6-9 */
}
.own-team-list-con li:nth-child(3) dd .line:after{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#306aff+0,00459b+100 */
	background: rgb(48,106,255); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(48,106,255,1) 0%, rgba(0,69,155,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(48,106,255,1) 0%,rgba(0,69,155,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(48,106,255,1) 0%,rgba(0,69,155,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#306aff", endColorstr="#00459b",GradientType=1 ); /* IE6-9 */
}
.own-team-list-con li:nth-child(4) dd .line:after{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#00c2d9+1,0090ba+100 */
	background: rgb(0,194,217); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(0,194,217,1) 1%, rgba(0,144,186,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(0,194,217,1) 1%,rgba(0,144,186,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(0,194,217,1) 1%,rgba(0,144,186,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#00c2d9", endColorstr="#0090ba",GradientType=1 ); /* IE6-9 */
}

[data-aos="chart-active"].aos-animate.own-team-list-con li:nth-child(1) .line:after{width:140px}
[data-aos="chart-active"].aos-animate.own-team-list-con li:nth-child(2) .line:after{width:63px}
[data-aos="chart-active"].aos-animate.own-team-list-con li:nth-child(3) .line:after{width:40px}
[data-aos="chart-active"].aos-animate.own-team-list-con li:nth-child(4) .line:after{width:49px}

/* 고객만족도 */
.main-satisfy-box{float:left; width:225px; box-sizing:border-box; background-color:#f2f4fa; height:215px; padding:23px 26px 26px 23px; }
.main-satisfy-box h4{color:#303030; font-size:17px; letter-spacing:-0.2px; margin-bottom:14px;}
.main-satisfy-box .satisfy-txt{font-size:12px; letter-spacing:-0.2px; color:#303030; text-align:right; display:block;}


/* ******************  한스클린 이념  / 집중투자 / 노하우 ********************** */
.main-img-only-wrapper{max-width:1044px; margin:0px auto 142px;}
#mainKnowHowContent{max-width:1124px; margin-top:165px}

/* ******************  한스클린 전국 ********************** */
#mainBottomMapCon.height-wide{height:426px; padding-top:40px; box-sizing:border-box; background-image:url('../../assets/images/bottom_map_bg2_01_new_1b3ff135bf.jpg')}

/* ******************  한스클린 비용절감 ********************** */
#mainPriceLowContent{margin-bottom:290px}
.main-hans-choide-graph-box{max-width:1170px; margin:0px auto;}


/* ******************  견적신청/온라인예약/파격이벤트/실시간상담 ********************** */
#mainBottomRequestContent{background-color:#edeef1; padding:110px 0 85px; font-family:"Nanum Square","NanumSquare",sans-serif}
/* -------- 왼쪽 신청 영역 -------- */
.main-request-form-wrapper{float:left; width:594px; height:760px; background-color:#fff; box-shadow:10px 10px 15px rgba(100, 100, 100, .2);}
/* 왼쪽신청영역 :: 탭 */
.request-tab-list-con li{float:left; width:33.33%; text-align:center;}
.request-tab-list-con li a{display:block; height:60px; line-height:60px; color:#fff; font-size:18px; letter-spacing:-0.2px; font-size:18px; letter-spacing:-0.2px; background-color:#00b7f3; border-left:1px solid #fff;}
.request-tab-list-con li:first-child a{border-left:0}
.request-tab-list-con li.selected a{background-color:#fff; color:#00b7f3;}
/* 왼쪽신청영역 :: 공통 */
.request-tab-form-inner{display:none; padding:56px 49px 0 55px;}
.request-tab-tit{position:relative; color:#303030; font-size:28px; letter-spacing:-0.2px; margin-bottom:50px;}
.request-tab-tit img{margin-right:16px;}
.request-submit-btn-box{text-align:center;}
.request-submit-btn{display:inline-block; box-sizing:border-box; width:192px; height:46px; line-height:44px; background-color:#fff; border:2px solid #00b7f3; font-size:16px; color:#00b7f3; letter-spacing:-0.2px; font-family:"Nanum Square","NanumSquare",sans-serif; padding:0; margin:0px;}
.request-submit-btn:hover{background-color:#00b7f3; color:#fff}
/* 왼쪽신청영역 :: 간편견적신청 */
.simple-estimate-tbl{width:100%; }
.simple-estimate-tbl th{width:90px; color:#303030; font-size:18px; letter-spacing:-0.2px; font-weight:400; vertical-align:middle; line-height:50px; text-align:left;  font-family:"Nanum Square","NanumSquare",sans-serif}
.simple-estimate-tbl td{padding:5px 0 ;font-family:"나눔고딕", "NanumGothic", "WebNanumGothic", "맑은 고딕", Malgun Gothic, "돋움", Dotum, Tahoma, Verdana, Calibri, Arial, sans-serif }
.simple-estimate-tbl .simple-estimate-word{border:1px solid #eee; height:42px; width:100%; text-indent:17px; font-size:17px; box-sizing:border-box; }
.simple-estimate-tbl .select-box{border:1px solid #eee; padding:0 14px;}
.simple-estimate-tbl .simple-estimate-word.essential,
.simple-estimate-tbl .select-box.essential{border-color:#00b7f3}
.simple-estimate-tbl .simple-estimate-select{border:0; height:42px; width:100%; color:#bdbdbd; font-size:17px; padding:0; box-sizing:border-box; }
.simple-estimate-tbl .event-select .simple-estimate-select{}
.simple-estimate-tbl .select-box.essential .simple-estimate-select{color:#303030}
.simple-estimate-tbl .simple-estimate-word::placeholder,
.simple-estimate-tbl .simple-estimate-select::placeholder{color:#bdbdbd; }
/* .simple-etimate-address{margin-bottom:8px} */
.simple-etimate-address .zip-code-btn{float:right; height:42px; width:60px; margin:0px; border:0px; background-color:#00b7f3; color:#fff; font-size:17px; }
.simple-etimate-address .simple-estimate-word{width:calc(100% - 60px);}
.simple-estimate-tbl .agree-td{/* padding:55px 0px; */ padding:30px 0; color:#303030; font-size:16px; letter-spacing:-0.2px}
.simple-estimate-tbl .agree-td label{display:inline-block; margin:0 10px;}
.simple-estimate-tbl .agree-td a:hover{color:#00b7f3}

/* 왼쪽신청영역 :: 온라인예약하기 */
.online-reservation-txt{color:#303030; font-size:18px; letter-spacing:-0.2px; margin-bottom:33px;}
.online-reservation-list-con{max-width:400px; margin:0px auto 65px;}
.online-reservation-list-con li{margin-bottom:14px}
.online-reservation-list-con li input{display:none;}
.online-reservation-list-con li label{display:block; border:1px solid #c8c8c8; height:44px; width:100%; box-sizing:border-box;}
.online-reservation-list-con li label span{display:block; height:42px; border:1px solid #fff; color:#bdbdbd; line-height:42px; padding-left:18px; font-size:18px;}
.online-reservation-list-con li input:checked + label{border-color:#00b7f3;}
.online-reservation-list-con li input:checked + label span{border-color:#00b7f3; color:#00b7f3}

/* 왼쪽신청영역 :: 진행 중인 프로모션 */
.online-promotion-box .request-tab-tit{margin-bottom:40px;}
.online-promotion-img-list{max-width:345px; margin:0px auto 52px;}
.online-promotion-img-list li{margin-bottom:14px;}
.online-promotion-img-list li a{display:block; overflow:hidden;}
.online-promotion-img-list li img{width:100%; height:195px;}

/* 왼쪽신청영역 :: Contact Us */
.contact-us-list-con{max-width:395px; margin:0px auto;}
.contact-us-list-con li{margin-bottom:35px;}
.contact-us-list-con li a{display:block; height:76px; line-height:76px; padding-left:112px; border:1px solid #c6c6c6}
.contact-us-list-con li:first-child a:hover{border-color:#454eff}
.contact-us-list-con li:nth-child(2) a:hover{border-color:#ffcc00}
.contact-us-list-con li:nth-child(3) a:hover{border-color:#00b7f3}
.contact-us-list-con li:nth-child(4) a:hover{border-color:#ff6a30}
.contact-us-list-con li a .icon{display:inline-block; vertical-align:middle; margin-right:14px; }
.contact-us-list-con li a .icon .off-icon{display:block; opacity:1}
.contact-us-list-con li a .icon .on-icon{display:none; opacity:0}
.contact-us-list-con li a:hover .icon .off-icon{display:none; opacity:0}
.contact-us-list-con li a:hover .icon .on-icon{display:block; opacity:1}
.contact-us-list-con li a strong{display:inline-block; vertical-align:middle; color:#2e2d2d; font-weight:400; font-size:20px; letter-spacing:-0.5px;}

/* -------- 오른쪽 신청 영역 -------- */
.request-right-img-wrapper{position:relative; float:right; width:537px; height:695px; /*padding-top:128px;*/padding-top:100px}
.request-right-img-wrapper .request-txt-inner{}
.request-right-img-wrapper .request-right-tit{font-size:42px; line-height:1.3; letter-spacing:-0.3px; color:#303030; margin-bottom:55px; opacity:0;}
.request-right-img-wrapper .request-right-txt{font-size:20px; line-height:1.3; letter-spacing:-0.2px; color:#303030; margin-bottom:55px;}
.request-right-img-wrapper .request-right-btn{display:block; position:relative; z-index:1; width:194px; height:50px; line-height:50px; background-color:#00b7f3; text-align:center; border-radius:30px; color:#fff; font-size:18px}
.request-right-img-wrapper .request-right-btn.none-link{cursor:default;}
.request-right-img-wrapper .request-right-btn img{margin-right:9px;}
.simple-request-img-box{display:block; position:absolute; bottom:-84px; right:-35px; opacity:0;}

.request-img-container.active .request-right-tit,
.request-img-container.active .request-right-txt,
.request-img-container.active .request-right-btn{
	-webkit-animation: request-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation: request-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;
}
.request-img-container.active .simple-request-img-box{
	-webkit-animation: request-animation2 1s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation: request-animation2 1s cubic-bezier(0.4, 0, 0.2, 1) both;
}
@keyframes request-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-ms-transform: translateX(-30px); 
		-o-transform: translateX(-30px); 
		-moz-transform: translateX(-30px);
		-webkit-transform: translateX(-30px); 
		transform: translateX(-30px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-ms-transform: translateX(0); 
		-o-transform: translateX(0); 
		-moz-transform: translateX(0);
		-webkit-transform: translateX(0); 
		transform: translateX(0); 
	}
}
@keyframes request-animation2 {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-ms-transform: translateX(30px); 
		-o-transform: translateX(30px); 
		-moz-transform: translateX(30px);
		-webkit-transform: translateX(30px); 
		transform: translateX(30px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-ms-transform: translateX(0); 
		-o-transform: translateX(0); 
		-moz-transform: translateX(0);
		-webkit-transform: translateX(0); 
		transform: translateX(0); 
	}
}	



/* ******************  제휴서비스 ********************** */
#mainaffliatedContent{padding:190px 0 200px;}
.affliate-wrapper-con{max-width:925px; margin:0px auto;}
.affliate-wrapper-con .slick-slider{margin:0 30px;}
.affiliate-list-box{position:relative;}
/* 상단 */
.affiliate-detail-item a{overflow:hidden; display:block;}
.affiliate-detail-item .affiliate-left-con{float:left; width:420px; height:250px; border:1px solid #e5e5e5; box-sizing:border-box}
.affiliate-detail-item .affiliate-left-con img{width:100%; height:100%;}
.affiliate-detail-item .affiliate-right-con{float:right; width:410px; padding-top:44px;}
.affiliate-detail-item .affiliate-right-con dt{color:#00b7f3; font-size:32px; font-weight:400; letter-spacing:-0.3px; margin-bottom:45px;}
.affiliate-detail-item .affiliate-right-con dd{color:#303030; font-size:16px; line-height:1.75; letter-spacing:-0.25px; word-break:keep-all}
.affiliate-list-box .slick-arrow{position:absolute; top:92px; width:28px; height:66px; font-size:0; margin:0; padding:0; background:none; border:0; }
.affiliate-list-box .slick-prev{left:-112px; background:url('../../assets/images/affiliate_prev_btn_a2cef9a4e1.jpg') no-repeat}
.affiliate-list-box .slick-next{right:-112px; background:url('../../assets/images/affiliate_next_btn_3bb02ddcc8.jpg') no-repeat}
/* 하단 */
.affiliate-list-box .slick-dots{height:85px; margin:0 -50px; padding-top:31px; margin-top:31px; padding:30px 30px 0 30px; border-top:1px solid #e5e5e5}
.affiliate-list-box .slick-dots li{float:left; width:17%; margin:0 4%; cursor:pointer; }
.affiliate-list-box .slick-dots li span{display:block; background:#000 }
.affiliate-list-box .slick-dots li img{width:100%; height:85px; opacity:0.5; transition:all 0.5s} 
.affiliate-list-box .slick-dots li.slick-active img{opacity:1.0}
.affiliate-list-box .slick-dots li .affiliate-tit{text-align:center; color:#797979; font-size:14px; display:block; padding-top:10px; letter-spacing:-0.2px;}



/* ******************  청소 의미 ********************** */
#mainCleanMeanContent{height:700px; box-sizing:border-box; padding-top:107px; /*background:url(/kr/images/main/main_clean_mean_bg.gif) no-repeat*/ background-color:#a3a5a9; box-shadow:0px 5px 11px 5px rgba(0,0,0,0.13) inset}
.main-clean-img{position:relative; box-shadow: 13px 10px 12px 0px rgba(0, 0, 0, 0.09); margin-bottom:50px;}
.main-clean-img .clean_store_btn {position:absolute; bottom:56px; left:133px; font-size:14px; color:#fff; letter-spacing:-0.03em; line-height:1.5; background: #00b7f3; padding:5px 60px;}
#mainCleanMeanContent .main-tit-box{margin-bottom:35px; color:#fff;}
#mainCleanMeanContent .main-tit-box .main-en-tit{color:#c0c0c0; text-transform:initial;}
.main-clean-mean-txt{max-width:1028px; margin:0px auto; color:#fff; font-size:18px; letter-spacing:-0.3px; line-height:1.55; word-break:keep-all;}
.main-clean-mean-txt:first-of-type{margin-bottom:16px;}
.main-clean-btn-box{margin-top:55px; text-align:center}
.main-clean-btn-box a{display:inline-block; width:315px; height:38px; color:#fff; background-color:#2363a8; font-size:18px; line-height:38px; letter-spacing:-0.3px;}




/* ****************** 공동구매 특가찬스 ********************** */
#mainCoupon{margin-bottom:200px; background-color:#212237; text-align:center;}

/* 추천 서비스 배너 */
#mainCoupon .img-box{position:relative;}
.recommendation-btn {position:absolute; bottom:80px; left:350px; border:1px solid #00b7f3; padding:15px 60px 15px 40px; transition:all 0.3s;}
.recommendation-btn em {font-size:16px; line-height:1.5; letter-spacing:-0.03em; color:#00b7f3;}
.recommendation-btn:after {display:block; content:""; position:absolute; top:50%; right:40px; transform:translateY(-50%); width:6px; height:12px; background: url('../../assets/images/recommendation-btn_arrow_8c25a0a6e3.png')no-repeat; background-size:cover;}
.recommendation-btn:hover {background: #00b7f3;}
.recommendation-btn:hover em {color:#fff;}
.recommendation-btn:hover:after {background: url('../../assets/images/recommendation-btn_arrow_on_bf52dd4705.png')no-repeat; background-size:cover;}