@charset "utf-8";
/* common */
.top-head-title-xl{font-size: 28px;font-weight: 700;line-height: 140%;letter-spacing: -0.56px;}
.top-head-title-l{margin-bottom:24px;font-weight: 700;font-size: 24px;line-height: 140%;letter-spacing: -0.48px;}
.top-head-text-xl{margin-top:6px;font-size: 18px;letter-spacing: -0.36px;line-height: 27px;}

/* main select custom */
/* .bl-custom-select {position: relative;width: 465px;font-size: 16px;color:#687286;}
.bl-custom-select .select-btn {width: 100%;height: 50px;padding: 12px 20px;;border: 1px solid #70B8FF;color:#687286;border-radius: 50px;background: #fff;text-align: left;cursor: pointer;position: relative;}
.bl-custom-select .select-btn .icon-main-select-arr {position: absolute;right: 20px;top: 50%;width: 18px;height: 18px;transform: translateY(-50%);}
.bl-custom-select.active .select-btn .icon-main-select-arr{transform: translateY(-50%) rotate(180deg);} 
.bl-custom-select .select-options {position: absolute;top: calc(100% + 10px);left: 50%;transform: translateX(-50%);pointer-events: none;width:calc(100% - 30px);padding:8px;background: #fff;box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.16);border-radius: 6px;max-height: 0;opacity: 0;overflow: hidden;transition: max-height 0.25s ease, opacity 0.25s ease;z-index: 10;}
.bl-custom-select.active .select-options {max-height: 267px;opacity: 1;overflow-y: auto;pointer-events: auto;}
.bl-custom-select .select-options li {position: relative;padding: 10px 12px;cursor: pointer;transition: background 0.2s ease;border-radius:4px;color: #35425C;font-size:16px;line-height:150%;}
.bl-custom-select .select-options li:hover {background: rgba(235, 246, 255, 0.70);} */

.btn-main-estimate{display:flex;align-items: center;justify-content: space-between;padding: 8px 10px 8px 16px;margin:0 auto;width:540px;border-radius: 50px;border: 1px solid #70B8FF;}
.btn-main-estimate:hover .icon-main-top-arr{opacity:.7;}
.btn-main-estimate p{display: flex;align-items: center;gap: 4px;font-size: 16px;line-height: 24px;font-weight: 500;}


/* main common */
.main-con section{margin-bottom:100px;}

.main-con .title-num-line{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;}
.main-con .title-num-line .main-num-count{display:flex;align-items:center;gap:12px;}
.main-con .title-num-line .main-num-count .title{display:flex;gap:8px;align-items:center;color:#5A6275;font-size: 16px;}
.main-con .title-num-line .main-num-count .count-num{font-size: 28px;font-weight: 700;}
.main-con .review-sec .count-num strong{display:inline-block;margin-left: -6px;min-width: 6ch;text-align: right;}
.main-con .check-sec .count-num strong{display:inline-block;margin-left: -13px;min-width: 5ch;text-align: right;}

.btn-more-text{position:absolute;top:5px;right:0;color: var(--color-gray-600);font-size: 16px;font-weight: 400;letter-spacing: -0.32px;}

/* 고객리뷰 common */
.review-list{display:flex;flex-wrap:wrap;column-gap:48px;row-gap:16px;align-items: flex-start;}
/* .review-list{display: flex;flex-direction: column;justify-content: center;align-items: flex-start;gap: 16px;min-width: 0;} */
.review-list li{width: calc((100% - 48px) / 2);}
.review-list li a{display: flex;gap: 20px;align-items: flex-start;}
.review-list .text-box .badge{margin-bottom:6px;}
.review-list .text-box .title{white-space: nowrap;overflow:hidden;text-overflow: ellipsis;font-weight:500;letter-spacing: -0.3px;}
.review-list .text-box .text.ellipsis-1{white-space: nowrap;overflow:hidden;line-height: 21px;color:#616678;text-overflow: ellipsis;font-size: 14px;letter-spacing: -0.28px;}
.review-list .text-box .info{display: block;margin-top:5px;width: 100%;color:#8C92A4;font-size: 12px;line-height: 18px;letter-spacing: -0.24px;}
.review-list .img{display: flex;flex-direction: column;align-items: flex-start;aspect-ratio: 3/2;width:144px;height:96px;overflow:hidden;border-radius:8px;}
.review-list .img img{width: 100%;height: 100%;object-fit: cover;transition:transform .3s;}
.review-list li:hover img{transform:scale(1.085);}


/* 메인 live 수직 롤링 */
.main-live-box {margin:12px auto 0;width:333px;display:flex;gap:18px;height:23px;}
.main-live-box .live-title{flex-shrink: 0;display:flex;align-items:center;font-size: 12px;color:#687286;}
.main-live-box .live-title strong{display:flex;align-items:center;gap:4px;font-weight: 700;}
.main-live-box .live-title span{font-weight: 600;}
.main-live-box .swiper{width: calc(100% - 104px);margin:0 !important;}
.main-live-box .swiper-slide{font-size:14px;color:#687286;}
.main-live-box .swiper-slide a{display:flex;align-items:center;gap:8px;width:100%;font-size:14px;color:#687286;}

/* quick-box */
.quick-box{display:flex;justify-content:space-between;transform: translateZ(0);position:relative;}
.quick-box li a{display:flex;flex-direction:column;gap:8px;align-items: center;padding:0 8px;color:#5A6275;font-size:14px;letter-spacing: -0.28px;}
.quick-box li .img{display:flex;align-items:center;justify-content:center;width:60px;height:60px;background-color:#F6F7F8;border-radius:16px;transition:transform .15s;}
.quick-box li .label{position: absolute;top: -10px;left: ;padding: 2px 8px;color: #FF5B55;font-size: 11px;font-weight: 500;letter-spacing: 0;line-height: 100%;border: 1px solid #FF5B55;border-radius: 50px;background: #fff;transition:transform .15s;z-index: 999;}
.quick-box li:hover .img, .quick-box li:hover .label{transform:translateY(-8px);}


/* main top */
.main-top {padding-top:60px;}
.main-top .main-top-title{display: flex;justify-content: center;margin-bottom:32px;text-align: center;font-size: 32px;font-weight: 700;line-height: 130%;letter-spacing: -0.96px;}
.main-top .main-select-top{display: flex;justify-content: center;gap:8px;}
.main-top .main-select-top .btn-primary{display: flex;height: 50px;padding: 12px 16px;align-items: center;gap: 4px;color: #FFF;font-weight: 500;letter-spacing: -0.32px;border-radius: 50px;}

/* 메인 퀵메뉴 */
.main-con .quick-sec{padding:60px 0 0;margin-bottom: 70px;}

/* 메인 top-sec */
.main-con .top-sec >.container{display: grid;grid-template-columns: 1.5fr 1fr;justify-content:space-between;gap:90px;}
.main-con .top-sec .ban-swiper {width:684px;position:relative;}
.main-con .top-sec .ban-swiper .swiper{height:200px}
.main-con .top-sec .ban-swiper .swiper-pagination{display:flex;gap:5px;justify-content: center;bottom: 28px !important;left: 50px !important;width: auto !important;}
.main-con .top-sec .ban-swiper .swiper-pagination-bullet{width:6px;height:6px;margin:0 !important;background:rgba(255, 255, 255, 0.4);opacity:1;transition:width .3s;}
.main-con .top-sec .ban-swiper .swiper-pagination-bullet-active{width:18px;background:rgba(255, 255, 255, 0.8);border-radius:6px;}
.main-con .top-sec .ban-swiper .swiper-slide{border-radius:16px;overflow:hidden;}
.main-con .top-sec .ban-swiper .swiper-button-next,.main-con .top-sec .ban-swiper .swiper-button-prev{opacity:0;transition:opacity .3s;}
.main-con .top-sec .ban-swiper:hover .swiper-button-next,.main-con .top-sec .ban-swiper:hover .swiper-button-prev{opacity:1;}
.main-con .top-sec .certi-col{display:flex;flex-direction:column;justify-content:space-between;padding:8px 0;}
.main-con .top-sec .certi-col li > a{display:flex;justify-content:space-between;align-items:center;}
.main-con .top-sec .certi-col .lf{display:flex;align-items: center;gap:28px;}
.main-con .top-sec .certi-col .text{display:flex;flex-direction:column;gap:8px;line-height:120%;}
.main-con .top-sec .certi-col .text em{color:#687286;font-size:13px;}
.main-con .top-sec .certi-col .text strong{color:#353849;font-size:17px;font-weight:500;letter-spacing: -0.34px;}
.main-con .top-sec .certi-col .text span{display:inline-block;margin-top:4px;color:rgba(104, 114, 134, 0.7);font-size:11px;}


/* 메인 review */
.review-swiper-main{position:relative;margin-bottom:60px;}
.review-swiper-main .img{display: flex;width: 362px;height: 245px;overflow:hidden;flex-direction: column;align-items: flex-start;aspect-ratio: 362/245;margin-bottom:10px;position:relative;border-radius:8px;overflow:hidden;}
.review-swiper-main .img img{transition:transform .3s; width: 100%;height: 100%;object-fit: cover; display: block; }
.review-swiper-main .swiper-slide:hover .img img{transform:scale(1.1);}
.review-swiper-main .review-badge{position:absolute;z-index: 9;top:16px;left:16px;}
.review-swiper-main .text-box .title{margin-bottom:2px;color:#353841;font-size:17px;line-height:120%;font-weight:500;letter-spacing: -0.34px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.review-swiper-main .text-box .info{color:#8C92A4;font-size:14px;letter-spacing: -0.28px;}
.review-swiper-main .swiper-prev-common,.review-swiper-main .swiper-next-common{top:99px !important;transform:none;opacity:0;transition:opacity .3s;}
.review-swiper-main:hover .swiper-prev-common,.review-swiper-main:hover .swiper-next-common{opacity:1;}


/* 암행현장 세로형 공통  */
.check-swiper{position:relative;}
.check-swiper a{position: relative;z-index: 1;display: flex;width: 266px;height: 346px;overflow: hidden;border-radius: 10px;}
.check-swiper a::before{display:block;position:absolute;z-index: 2;width:100%;height:100%;background: linear-gradient(180deg, rgba(37, 37, 37, 0.00) 22.63%, rgba(37, 37, 37, 0.50) 45.26%, rgba(37, 37, 37, 0.80) 90.53%);background-blend-mode: multiply;content:'';}
.check-swiper a img{position: relative;z-index: 1;aspect-ratio: 133/173;transition:transform .3s;-o-object-fit:cover; object-fit: cover;}
.check-swiper a:hover img{transform:scale(1.12);}
.check-swiper a .text{position: absolute;z-index: 2;display: flex;padding: 28px 24px;width: 100%;height: 100%;;flex-direction: column;justify-content: flex-end;align-items: flex-start;color: #fff;gap: 4px;}
.check-swiper a .text .num{font-size: 14px;font-weight: 500;line-height: 130%;letter-spacing: -0.28px;}
.check-swiper a .text .title{font-size: 18px;font-weight: 700;line-height: 130%;letter-spacing: -0.36px;margin-bottom: 4px;}
.check-swiper a .text .date{color:#AAAFBC;font-size: 13px;font-weight: 500;line-height: 130%;letter-spacing: -0.26px;}
.check-swiper .swiper-prev-common,.check-swiper .swiper-next-common{opacity:0;transition:opacity .3s;}
.check-swiper:hover .swiper-prev-common,.check-swiper:hover .swiper-next-common{opacity:1;}


/* 이벤트 */
.main-con .event-sec >.container{position:relative;}
.main-con .event-swiper{position:relative;}
.main-con .event-swiper .swiper-slide{height:180px;border-radius: 12px;overflow:hidden;}
.main-con .event-swiper .swiper-slide img{width:100%;}
.main-con .event-swiper .swiper-prev-common,.main-con .event-swiper .swiper-next-common{opacity:0;transition:opacity .3s;}
.main-con .event-swiper:hover .swiper-prev-common,.main-con .event-swiper:hover .swiper-next-common{opacity:1;}

/* 메인 faq-sec */
.main-con .faq-sec >.container{display:grid;grid-template-columns: 1fr 1fr;gap:60px;}
.main-con .faq-sec .faq-box{position:relative;width: 520px;}
.main-con .faq-sec .faq-box .top-title{margin-bottom:40px;}
.main-con .faq-sec .faq-box .btn-more{position:absolute;top:5px;right:0;color:#616678;font-size:16px;}
.main-con .faq-sec .faq-box{}
.main-con .faq-sec .faq-box ul{display:flex;flex-direction:column;gap:20px;}
.main-con .faq-sec .faq-box a{display:flex;align-items:center;justify-content:space-between;transition:opacity .3s;}
.main-con .faq-sec .faq-box a:hover{opacity:0.8;}
.main-con .faq-sec .faq-box p{color:#353841;font-size:18px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;max-width: 88%;}
.main-con .faq-sec .contact-box{display:flex;gap:16px;}
.main-con .faq-sec .contact-box a{display: flex;flex-direction: column;align-items: center;justify-content: center;flex:1;padding:31.5px 0;gap: 16px;color:#353841;border-radius: 12px;background-color: var(--color-primary-50);letter-spacing: -0.36px;font-size:18px;}
.main-con .faq-sec .contact-box .icon{display:flex;align-items:center;justify-content:center;width:92px;height:92px;background-color: #fff;border-radius:100%;}
.main-con .faq-sec .contact-box a i{transition:opacity .3s;}
.main-con .faq-sec .contact-box a:hover i{opacity:0.8;}

/* 베너 */
.main-con .main-mid-banner {padding: 0 0 0 80px;height: 120px;background: url("../images/main/icon-main-mid-banner.png")no-repeat;}

/* 역량 기업 */
.company-swiper-sec{padding:100px 0;background: rgba(228, 241, 255, 0.60);}
.company-swiper-sec .swiper{padding:12px 0;}
.company-swiper-sec .swiper .swiper-slide{display:flex;gap:24px;align-items: center;width:332px;height:140px;padding:32px;border-radius: 8px;background:var(--white);box-shadow: 0 2px 15px 0 rgba(81, 100, 125, 0.10);}
.company-swiper-sec .swiper .swiper-slide img{max-width:60px;max-height:60px;}
.company-swiper-sec .swiper .swiper-slide>div{display:flex;gap:12px;flex-direction:column;}
.company-swiper-sec .swiper .swiper-slide .text1{color:var(--color-gray-500);font-size: 14px;line-height: 100%;}
.company-swiper-sec .swiper .swiper-slide .text2{color:var(--color-gray-600);font-size: 20px;font-weight: 700;line-height: 100%;}

/*  언론이 본 영구*/
.media-sec{}
.media-sec .media-list{display:flex;gap:24px;}
.media-sec .media-list a{display:flex;flex-direction:column;gap:10px;width:calc((100% - 72px) / 4);}
.media-sec .media-list .img{width: 266px;height: 266px;border-radius: 8px;overflow:hidden;}
.media-sec .media-list .img img{object-fit: cover;height: 100%;transition:transform .3s;}
.media-sec .media-list a:hover .img img{transform:scale(1.085);}
.media-sec .media-list .text{display:flex;flex-direction:column;gap:2px;}
.media-sec .media-list .title{display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;color: var(--color-gray-800);overflow:hidden;font-size: 17px;font-weight: 500;line-height: 120%;letter-spacing: -0.34px;}
.media-sec .media-list .info{color: var(--color-gray-500);font-size: 14px;letter-spacing: -0.28px;}

/*  많이 찾는 서비스 */
.sv-num-sec .sv-list{display:flex;gap:24px;}
.sv-num-sec .sv-list a{z-index: 1;position: relative;display:flex;flex-direction:column;gap:8px;height:300px;overflow: hidden;padding:40px;width:calc((100% - 48px) / 3);border-radius: 20px 20px 20px 0;color:#fff;letter-spacing: -0.3px;}
.sv-num-sec .sv-list a strong{font-size: 28px;font-weight: 700;line-height: 140%;letter-spacing: -0.56px;}
.sv-num-sec .sv-list a:after{position: absolute;left: 0;top: 0;z-index: -1;display:block;width:100%;height:100%;transition:transform .3s;content:'';}
.sv-num-sec .sv-list a:hover:after{transform:scale(1.1);}
.main-con .sv-list .sv-01::after{background: url("../images/main/bg-sv-01.png")no-repeat center /cover;}
.main-con .sv-list .sv-02::after{background: url("../images/main/bg-sv-02.png")no-repeat center /cover;}
.main-con .sv-list .sv-03::after{background: url("../images/main/bg-sv-03.png")no-repeat center /cover;}
.sv-num-sec .sv-list .num-box{display: flex;align-items: center;justify-content: center;width:80px;height:80px;border-radius: 0 40px 0 0;position:absolute;bottom:0;left:0;background-color: #fff;}
.sv-num-sec .sv-list .num-box::before{position: absolute;top: -16px;left: 0;display:block;width:16px;height:16px;content:'';background: url("../images/main/shape-num-01.png")no-repeat center /cover;}
.sv-num-sec .sv-list .num-box::after{position: absolute;bottom: 0;right: -16px;display:block;width:16px;height:16px;content:'';background: url("../images/main/shape-num-02.png")no-repeat center /cover;}
.sv-num-sec .sv-list .num-box .num{transform: skew(-10deg);color: var(--color-gray-900);font-size: 60px;font-weight: 700;line-height: 130%;letter-spacing: -1.8px;}

/* 여정 카운트 */
.since-sec{}
.since-sec .since-top{display:flex;gap:24px;margin-bottom:60px;}
.since-sec .since-top .item-box{display: flex;flex:1;height: 120px;padding: 28px 24px;justify-content: space-between;align-items: center;border-radius: 16px;border: 1px solid var(--color-gray-100);background: #FFF;box-shadow: 2px 5px 20px 0 rgba(0, 119, 255, 0.06), 0 4px 12px 0 rgba(39, 39, 39, 0.08);}
.since-sec .since-top .item-box dt{display:flex;align-items:center;gap:8px;color: var(--color-gray-600);font-size: 20px;font-weight: 500;line-height: 100%;letter-spacing: -0.4px;}
.since-sec .since-top .item-box dd{color: var(--color-gray-700);font-size: 24px;font-weight: 700;line-height: 100%;}
.since-sec .since-top .item-box dd strong{font-size: 36px;}
.since-sec .tooltip-title-line{position: relative;display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px;}
.since-sec .btn-tooltip{width:20px;height:20px;}
.since-sec .tooltip-box{position:absolute;right:0;top:80px;width:412px;padding:20px;border-radius: 12px;opacity: 0;pointer-events: none;transform: translateY(5px);border: 1px solid var(--color-gray-300);background: #FFF;box-shadow: 0 0 10px 0 rgba(211, 217, 226, 0.50);transition: opacity .3s, transform .3s;}
.since-sec .btn-tooltip.active+.tooltip-box{opacity: 1;transform: translateY(0);pointer-events: auto;}
.since-sec .tooltip-box .dot-text{position:relative;padding-left:20px;font-size: 14px;color:var(--color-gray-700);}
.since-sec .tooltip-box .dot-text::before{display:inline-block;position:absolute;top:9px;left:9px;width:3px;height:3px;border-radius:100%;content:'';background-color: var(--color-gray-700);}
.since-sec .tooltip-box .btn-clse{position:absolute;top:20px;right:20px;}
.since-sec .count-box{display:flex;flex-wrap:wrap;column-gap:24px;row-gap:52px;}
.since-sec .count-box dl{width:calc((100% - 72px) / 4);display:flex;flex-direction:column;align-items:flex-start;gap:10px;}
.since-sec .count-box dt{color: var(--color-gray-600);font-size: 18px;font-weight: 500;line-height: 100%;letter-spacing: -0.36px;}
.since-sec .count-box dd{color: var(--color-primary-400);font-size: 24px;font-weight: 700;line-height: 100%;}
.since-sec .count-box dd strong{font-size:30px;}

/* 나눔봉사단 */
.volunteer-sec{}
.volunteer-sec .volunteer-ban{width:100%;height:360px;padding:40px;overflow:hidden;background:url("../images/main/img-volunteer.png") no-repeat center / cover;border-radius: 16px;}
.volunteer-sec .volunteer-ban .text-box{display: flex;flex-direction: column;height: 100%;justify-content: space-between;color:#fff;}
.volunteer-sec .text-top{display:flex;flex-direction:column;gap:8px;}
.volunteer-sec .text-top .text1{font-weight: 400;}
.volunteer-sec .text-top .text2{font-size:28px;font-weight:700;letter-spacing: -0.56px;line-height: 140%;}
.volunteer-sec .text-top .text2 strong{font-size: 34px;letter-spacing: -1.02px;line-height: 130%;}
.volunteer-sec .text-btm{display:flex;flex-direction:column;align-items: flex-start;gap:20px;}
.volunteer-sec .text-btm .btn-link{display: flex;align-items: center;padding: 4px 16px;gap: 10px;border-radius: 32px;background: #FFF;color: #234D82;font-size: 16px;font-weight: 500;letter-spacing: -0.32px;}
.volunteer-sec .text-btm .info{font-size: 14px;letter-spacing: -0.28px;color: rgba(255, 255, 255, 0.80);}

/* 영구꿀팁 */
.tip-sec >.container{position:relative;}
.tip-sec .tip-list{display:flex;gap:24px;}
.tip-sec .tip-list a{display:flex;flex-direction:column;gap:10px;width:calc((100% - 72px) / 4);}
.tip-sec .tip-list .img{border-radius:8px;overflow:hidden;}
.tip-sec .tip-list .text{overflow: hidden;color: var(--color-gray-800);text-overflow: ellipsis;white-space: nowrap;font-size: 17px;font-weight: 500;line-height: 120%;letter-spacing: -0.34px;}