@charset "utf-8";

#mkPoint{word-break:keep-all}
#mkPoint h2{padding-bottom:115px;color:#111;text-align:center}

/* 탭메뉴 */
#mkPoint .tab-menu{display:grid;grid-template-columns:repeat(5,1fr);place-items:center}
#mkPoint .tab-menu li{position:relative;width:100%;padding-bottom:28px;font-size:20px;font-weight:700;color:#111;text-align:center;cursor:pointer}
#mkPoint .tab-menu li.on{color:var(--primary)}

/* 탭 프로그레스 */
#mkPoint .progress-bar{position:relative;width:100%;height:3px;background-color:#eee;overflow:hidden}
#mkPoint .progress-bar .progress-fill{position:absolute;top:0;left:0;width:0;height:100%;background-color:var(--primary)}

/* 탭뷰 */
#mkPoint .area-tabcont{--tab-bg:linear-gradient(to bottom, #f3fafd 0%, #edf1fa 100%);position:relative;min-height:490px;margin:65px 0 200px}
#mkPoint .swiper-slide.tab-view{display:flex;align-items:center;justify-content:space-between;gap:70px;width:100%;transition:opacity 0.4s ease, visibility 0s linear 0.4s}
#mkPoint .tab-view .fl-l{display:flex;flex-direction:column;align-items:flex-start;flex-shrink:0;max-width:510px;width:100%;padding-left:50px}
#mkPoint .tab-view .fl-l .idx{font-family:var(--outfit);font-size:80px;line-height:100%;color:rgba(17, 17, 17, 0.1)}
#mkPoint .tab-view .fl-l h3{padding:26px 0 36px;font-size:30px;font-weight:700;color:#111;white-space:pre-line}
#mkPoint .tab-view .fl-l p.desc{font-size:18px;font-weight:400;line-height:1.55;color:#777;white-space:pre-line}
#mkPoint .tab-view .fl-l .btn--primary{padding:0 35px;margin-top:45px}
#mkPoint .tab-view .fl-r{width:100%;height:490px;border-radius:20px;overflow:hidden}
#mkPoint .tab-view .fl-r .thumb-box img{width:100%}

/* 독자적인 AI 특허 기반의 AEO+SEO 설계 */
#mkPoint .tab-view#tab01 .fl-r{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:47px;background:var(--tab-bg)}
#mkPoint .tab-view#tab01 .fl-r h4{font-size:20px;font-weight:400;color:#111;text-align:center}
#mkPoint .tab-view#tab01 .fl-r .thumb-box{display:flex;gap:30px}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .item{flex:1;display:flex;flex-direction:column;align-items:center;gap:12px}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .item p{font-size:13px;font-weight:700;color:#aaa}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .thumb{max-width:315px}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .thumb img{width:100%;height:100%}

/* 아름다운 AI 모델 & 시술 예시컷 무료 제공 */
#mkPoint .tab-view#tab02 .fl-r{background-image:url(./img/ai_bg.png);background-size:cover;background-repeat:no-repeat}
#mkPoint .tab-view#tab02 .fl-r .thumb-box{display:flex;align-items:center;justify-content:flex-end;gap:32px;height:100%;padding:33px 98px 0}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item{display:flex;flex-direction:column;align-items:center;gap:11px}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:first-child{max-width:266px}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:last-child{max-width:288px}
#mkPoint .tab-view#tab02 .fl-r .tool-tip{position:relative;display:flex;align-items:center;justify-content:center;height:36px;padding:0 23px;background-color:#fff;border-radius:100px;text-align:center;font-size:13px;font-weight:700;color:#777}
#mkPoint .tab-view#tab02 .fl-r .tool-tip::before{content:'';position:absolute;bottom:-6.5px;left:50%;width:13px;height:13px;background-image:url(./img/tool-tip.png);background-size:13px;background-repeat:no-repeat;transform:translateX(-50%)}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:first-child .thumb{max-width:240px}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:last-child .thumb{max-width:265px}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .thumb img{width:100%;height:100%}

/* 진료과별 맞춤형 운영 솔루션 */
#mkPoint .tab-view#tab03 .fl-r{display:flex;align-items:center;padding:0 52px;background:var(--tab-bg)}
#mkPoint .tab-view#tab03 .fl-r .thumb-box{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 22px}
#mkPoint .tab-view#tab03 .fl-r .thumb-box .item{display:flex;flex-direction:column-reverse;align-items:center;gap:12px;font-size:15px;font-weight:700;color:#777}
#mkPoint .tab-view#tab03 .fl-r .thumb-box .item p{word-break:keep-all}

/* 원스톱 서비스 */
#mkPoint .tab-view#tab04 .fl-r{background-image:url(./img/onestop_bg.png);background-repeat:no-repeat;background-size:cover}
#mkPoint .tab-view#tab04 .thumb-box{display:flex;align-items:flex-end;gap:12px;height:100%;padding:27px 37px}
#mkPoint .tab-view#tab04 .thumb-box .item:first-child{max-width:224px;padding-bottom:92px}
#mkPoint .tab-view#tab04 .thumb-box .item:last-child{max-width:200px}
#mkPoint .tab-view#tab04 .thumb-box img{height:100%;object-fit:cover}

/* 완성도 높은 결과, 철저한 유지보수 시스템 */
#mkPoint .tab-view#tab05 .fl-r{display:flex;align-items:center;justify-content:center;background:var(--tab-bg)}
#mkPoint .tab-view#tab05 .fl-r .form-example{display:flex;flex-direction:column;width:100%;max-width:530px}
#mkPoint .tab-view#tab05 .fl-r .form-example h4{padding-bottom:34px;font-size:22px;font-weight:700;text-align:center;color:#222}
#mkPoint .tab-view#tab05 .fl-r .form-example dl{display:flex;gap:29px}
#mkPoint .tab-view#tab05 .fl-r .form-example dt{font-size:16px;font-weight:700;color:#111}
#mkPoint .tab-view#tab05 .fl-r .form-example dd{width:100%;font-size:16px;font-weight:500;color:#777;border-radius:5px;background-color:#fff}
#mkPoint .tab-view#tab05 .fl-r .form-example dd p{display:flex;align-items:center;gap:5px}
#mkPoint .tab-view#tab05 .fl-r .form-example dd p::before{content:'';width:3px;height:3px;border-radius:10px;background-color:#777}
#mkPoint .tab-view#tab05 .fl-r .form-example dl:first-of-type{align-items:center;margin-bottom:10px}
#mkPoint .tab-view#tab05 .fl-r .form-example dl:first-of-type dd{padding:9px 20px}
#mkPoint .tab-view#tab05 .fl-r .form-example dl:last-of-type dt{padding-top:15px}
#mkPoint .tab-view#tab05 .fl-r .form-example dl:last-of-type dd{padding:17px 20px}
#mkPoint .tab-view#tab05 .fl-r .form-example dl:last-of-type dd .text{white-space:pre-line}
#mkPoint .tab-view#tab05 .fl-r .form-example .submit{display:flex;justify-content:center;align-items:center;max-width:278px;width:100%;height:45px;margin:24px auto 8px;border-radius:100px;background:linear-gradient(to right, #2d58e8 0%, #17d5b6 100%);color:#fff;font-size:15px;font-weight:700}
#mkPoint .tab-view#tab05 .fl-r .form-example .notice{font-size:14px;font-weight:400;color:#aaa;text-align:center}

/* 반응형 [s] */
@media (max-width:1600px){
#mkPoint{padding:0 20px}
#mkPoint h2{padding-bottom:80px}
#mkPoint .tab-menu li{padding-bottom:25px;font-size:18px}
#mkPoint .area-tabcont{margin:45px 0 130px}
#mkPoint .tab-view .fl-l .idx{font-size:76px}
#mkPoint .tab-view .fl-l h3{padding:25px 0px;font-size:28px}
#mkPoint .tab-view .fl-l p.desc{font-size:17px}
#mkPoint .tab-view .fl-l .btn--primary{margin-top:38px}

/* 진료과별 맞춤형 운영 솔루션 */
#mkPoint .tab-view#tab03 .fl-r .thumb-box{gap:16px 10px}
#mkPoint .tab-view#tab03 .fl-r .thumb-box .item{font-size:13px}

/* 완성도 높은 결과, 철저한 유지보수 시스템 */
#mkPoint .tab-view#tab05 .fl-r .form-example h4{padding-bottom:15px;font-size:17px}
#mkPoint .tab-view#tab05 .fl-r .form-example dl{gap:20px}
#mkPoint .tab-view#tab05 .fl-r .form-example dl:first-of-type{margin-bottom:6px}
#mkPoint .tab-view#tab05 .fl-r .form-example dt{font-size:14px}
#mkPoint .tab-view#tab05 .fl-r .form-example dd{font-size:14px}
#mkPoint .tab-view#tab05 .fl-r .form-example .submit{max-width:240px;height:40px;margin:15px auto 10px;font-size:14px}
#mkPoint .tab-view#tab05 .fl-r .form-example .notice{font-size:12px}
}

@media (max-width:1400px){
#mkPoint .area-tabcont{min-height:450px}
#mkPoint .swiper-slide.tab-view{gap:40px}
#mkPoint .tab-view .fl-l{max-width:475px}
#mkPoint .tab-view .fl-l .idx{font-size:64px}
#mkPoint .tab-view .fl-l h3{padding:18px 0;font-size:26px}
#mkPoint .tab-view .fl-l p.desc{font-size:16px}
#mkPoint .tab-view .fl-l .btn--primary{margin-top:30px}
#mkPoint .tab-view .fl-r{height:450px}

/* 독자적인 AI 특허 기반의 AEO+SEO 설계 */
#mkPoint .tab-view#tab01 .fl-r{padding:0 24px}
#mkPoint .tab-view#tab01 .fl-r h4{font-size:18px}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .item p{white-space:pre-line;text-align:center}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .thumb{max-width:260px}

/* 아름다운 AI 모델 & 시술 예시컷 무료 제공 */
#mkPoint .tab-view#tab02 .fl-r .thumb-box{justify-content:center;padding:33px 24px 0}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:first-child .thumb{max-width:220px}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:last-child .thumb{max-width:250px}

/* 진료과별 맞춤형 운영 솔루션 */
#mkPoint .tab-view#tab03 .fl-r{padding:0 24px}

/* 원스톱 서비스 */
#mkPoint .tab-view#tab04 .thumb-box{align-items:center;padding:0 37px}
#mkPoint .tab-view#tab04 .thumb-box .item:first-child{max-width:210px;padding-bottom:0;padding-top:110px}
#mkPoint .tab-view#tab04 .thumb-box .item:last-child{max-width:190px}

/* 완성도 높은 결과, 철저한 유지보수 시스템 */
#mkPoint .tab-view#tab05 .fl-r{padding:0 24px}
#mkPoint .tab-view#tab05 .fl-r .form-example{max-width:500px}
}

@media (max-width:1200px){
#mkPoint .area-tabcont{min-height:405px}
#mkPoint .tab-view .fl-l{max-width:435px;padding-left:20px}
#mkPoint .tab-view .fl-r{height:405px}

/* 독자적인 AI 특허 기반의 AEO+SEO 설계 */
#mkPoint .tab-view#tab01 .fl-r{position:relative;justify-content:center;gap:24px}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .item p{font-size:12px}
#mkPoint .tab-view#tab01 .fl-r:after{position:absolute;content:'';bottom:25px;left:0;width:100%;height:60px;background:linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(237, 241, 250, 1) 100%)}

/* 아름다운 AI 모델 & 시술 예시컷 무료 제공 */
#mkPoint .tab-view#tab02 .fl-r .tool-tip{height:30px;font-size:12px}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:first-child .thumb{max-width:210px}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:last-child .thumb{max-width:225px}

/* 진료과별 맞춤형 운영 솔루션 */
#mkPoint .tab-view#tab03 .fl-r .thumb-box .item{font-size:12px;text-align:center}

/* 완성도 높은 결과, 철저한 유지보수 시스템 */
#mkPoint .tab-view#tab05 .fl-r .form-example dt,#mkPoint .tab-view#tab05 .fl-r .form-example dd{font-size:13px}
}

@media (max-width:1024px){
#mkPoint h2{padding-bottom:50px}
#mkPoint .tab-menu li{padding-bottom:18px;font-size:16px}
#mkPoint .swiper-slide.tab-view{flex-direction:column;gap:30px}
#mkPoint .area-tabcont{min-height:0;margin:30px 0 130px}
#mkPoint .tab-view .fl-l{align-items:center;max-width:none;padding-left:0;text-align:center}
#mkPoint .tab-view .fl-l .idx{font-size:52px}
#mkPoint .tab-view .fl-l h3{padding:14px 0;font-size:22px;white-space:normal}
#mkPoint .tab-view .fl-l p.desc{max-width:70ch;word-break:keep-all;white-space:normal;font-size:15px}
#mkPoint .tab-view .fl-l .btn--primary{margin-top:22px}
#mkPoint .tab-view .fl-r{height:420px}

/* 독자적인 AI 특허 기반의 AEO+SEO 설계 */
#mkPoint .tab-view#tab01 .fl-r{gap:30px}
#mkPoint .tab-view#tab01 .fl-r{justify-content:flex-end;padding:35px 24px 0}
#mkPoint .tab-view#tab01 .fl-r:after{display:none}

/* 진료과별 맞춤형 운영 솔루션 */
#mkPoint .tab-view#tab03 .fl-r{justify-content:center;padding:35px 24px}
#mkPoint .tab-view#tab03 .fl-r .thumb-box .item{font-size:13px}
#mkPoint .tab-view#tab03 .fl-r .thumb-box .item img{max-width:250px}

/* 원스톱 서비스 */
#mkPoint .tab-view#tab04 .thumb-box .item:first-child{max-width:220px}
#mkPoint .tab-view#tab04 .thumb-box .item:last-child{max-width:192px}

/* 완성도 높은 결과, 철저한 유지보수 시스템 */
#mkPoint .tab-view#tab05 .fl-r{padding:35px 24px}
}

@media (max-width:768px){
#mkPoint h2{padding-bottom:40px}
#mkPoint .area-tabcont{margin:30px 0 100px}
#mkPoint .tab-menu li{font-size:15px;white-space:pre-line}
#mkPoint .tab-view .fl-l .idx{font-size:46px}
#mkPoint .tab-view .fl-l h3{padding:12px 0 8px;font-size:20px}
#mkPoint .tab-view .fl-l .btn--primary{margin-top:18px;padding:0 28px}

/* 아름다운 AI 모델 & 시술 예시컷 무료 제공 */
#mkPoint .tab-view#tab02 .fl-r .thumb-box{gap:14px}
#mkPoint .tab-view#tab02 .fl-r .tool-tip{padding:0 12px}
}

@media (max-width:580px){
#mkPoint .tab-view .fl-r{height:auto}

/* 진료과별 맞춤형 운영 솔루션 */
#mkPoint .tab-view#tab03 .fl-r .thumb-box{grid-template-columns:repeat(2,1fr);gap:10px;place-items:start}
}

@media (max-width:480px){
#mkPoint h2{padding-bottom:30px}
#mkPoint .tab-menu{grid-template-columns:repeat(3,1fr);gap:8px;align-items:stretch;padding-bottom:18px}
#mkPoint .tab-menu li{display:flex;align-items:center;justify-content:center;padding:8px 0;border-radius:8px;background-color:#f1f1f1;transition:color 0.2s, background-color 0.2s}
#mkPoint .tab-menu li.on{color:#fff;background-color:var(--primary)}
#mkPoint .area-tabcont{margin:20px 0 80px}
#mkPoint .swiper-slide.tab-view{gap:24px}
#mkPoint .tab-view .fl-l .idx{font-size:38px}
#mkPoint .tab-view .fl-l h3{padding:10px 0 8px;font-size:18px}
#mkPoint .tab-view .fl-l p.desc{max-width:100%;font-size:14px}
#mkPoint .tab-view .fl-l .btn--primary{padding:0 24px}
#mkPoint .tab-view .fl-r{border-radius:10px}

/* 독자적인 AI 특허 기반의 AEO+SEO 설계 */
#mkPoint .tab-view#tab01 .fl-r{padding:30px 20px 0}
#mkPoint .tab-view#tab01 .fl-r .thumb-box{flex-direction:column;align-items:center;gap:25px}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .thumb{max-width:210px}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .item{gap:6px}
#mkPoint .tab-view#tab01 .fl-r .thumb-box .item p{white-space:normal}

/* 아름다운 AI 모델 & 시술 예시컷 무료 제공 */
#mkPoint .tab-view#tab02 .fl-r{background-position:center}
#mkPoint .tab-view#tab02 .fl-r .thumb-box{flex-direction:column;gap:28px;padding:30px 20px 0}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:first-child .thumb{max-width:168px}
#mkPoint .tab-view#tab02 .fl-r .thumb-box .item:last-child .thumb{max-width:210px}

/* 진료과별 맞춤형 운영 솔루션 */
#mkPoint .tab-view#tab03 .fl-r{padding:30px 20px}

/* 원스톱 서비스 */
#mkPoint .tab-view#tab04 .thumb-box{flex-direction:column;gap:20px;padding:30px 20px 0}
#mkPoint .tab-view#tab04 .thumb-box .item:first-child{max-width:250px;padding-top:0}
#mkPoint .tab-view#tab04 .thumb-box .item:last-child{max-width:200px}

/* 완성도 높은 결과, 철저한 유지보수 시스템 */
#mkPoint .tab-view#tab05 .fl-r{padding:30px 20px}
}

@media (max-width:390px){
#mkPoint .tab-menu li{font-size:14px}
}
/* 반응형 [e] */