@charset "utf-8";

/* ============================================================
   엘레브클리닉 메인
   ============================================================ */



/* ---------- 공통 (메인 한정) ---------- */
.main_cont { overflow: hidden; overflow: clip; background: #fff; color: var(--black); }
/* .main_cont a,
.main_cont a:visited { color: inherit; } */
.main_cont .sect_tit_box .sect_tit { font-family: var(--en); font-weight: 700; font-size: max(8rem, 44px); line-height: 1.3; color: var(--black); letter-spacing: -0.01em;}
.main_cont .sect_tit_box .sect_txt { margin-top: 1rem; font-size: var(--h8); font-weight: 700; line-height: 1.5; color: var(--black); }
.main_cont .sect_head { display: flex; align-items: flex-end; justify-content: space-between; gap: 4rem; }
.main_cont .btn_more { display: inline-flex; align-items: center; gap: 1.6rem; padding: 1.7rem 2.8rem 1.7rem 3.3rem; border: 1px solid var(--black); border-radius: 1rem; font-size: var(--p4); font-weight: 700; line-height: 1.3; color: var(--black); background: transparent; opacity: 0; transform: translateY(80px); transition: background .3s, color .3s, opacity .6s ease-in-out .18s, transform .6s ease-in-out .18s; flex-shrink: 0;}
.main_cont section.active .btn_more { opacity: 1; transform: none; }
@media (min-width: 1241px) {
    .main_cont .btn_more:hover { background: var(--black); color: #fff; }
}
.main_cont .btn_more svg { width: max(2.1rem, 14px); height: max(2.1rem, 14px); }

/* 구분 배지 (Event & Notice / Academic) */
.main_cont .badge { display: inline-flex; align-items: center; height: max(2.8rem, 22px); padding: 0 1.5rem; border-radius: 5rem; background: var(--black); color: #fff; font-size: var(--p6); font-weight: 600; line-height: 1;  }
.main_cont .badge.b_point { background: var(--point01); }

/* 슬라이더 하단 컨트롤 (progress + fraction + arrows) */
.main_cont .slide_ctrl { margin-top: var(--contMt1); width: calc(var(--in) - var(--inPd) * 2);}
.main_cont .slide_ctrl .slide_progress { position: relative; height: 4px; border-radius: 10rem; overflow: hidden; background: rgba(255,255,255,.25); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
.main_cont .slide_ctrl .slide_progress .bar { position: absolute; left: 0; top: 0; height: 100%; width: 0; background: #fff; transition: width .4s; }
/* 시안(Figma 177:231) 기준 — 숫자 25px / 총개수 22px·50% / 구분점은 4px 원(흰색 25%),
   숫자-점-총개수 간격 10px, 숫자묶음과 화살표 간격 30px, 화살표끼리 10px.
   (프로젝트 규약상 시안 px ÷ 10 = rem) */
.main_cont .slide_bottom { display: flex; align-items: center; gap: 1rem; margin-top: 3rem; display: none;}
.main_cont .slide_bottom .frac { display: inline-flex; align-items: center; gap: 1rem; margin-right: 2rem; font-size: 2.5rem; font-weight: 700; line-height: 1;  color: #fff; }
.main_cont .slide_bottom .frac .cur {width: 0.75em; text-align: center;}
.main_cont .slide_bottom .frac .dot { width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,.25); }
.main_cont .slide_bottom .frac .tot { font-size: 2.2rem; opacity: .5; }
.main_cont .btn_circle { display: flex; align-items: center; justify-content: center; width: max(5rem, 40px); height: max(5rem, 40px); border-radius: 50%; background: rgba(255,255,255,.1); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); transition: background .3s; display: none;}
@media (min-width: 1241px) {
    .main_cont .btn_circle:hover { background: rgba(255,255,255,.25); }
}
.main_cont .btn_circle svg { width: 40%; height: 40%; }

/* ---------- 우측 플로팅 (카톡·인스타·TOP) ---------- */

/* ---------- KV ---------- */
.kv_sect { position: relative; height: 100svh; min-height: 560px; overflow: hidden; background: var(--black); }
.kv_sect .kv_swiper { position: absolute; inset: 0; height: 100%; }
.kv_sect .kv_swiper .swiper-slide { overflow: hidden; }
.kv_sect .kv_swiper .bg { position: absolute; inset: 0; }
.kv_sect .kv_swiper .bg img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 20%; transform: scale(1.1); transition: transform 1s ease-in-out; }
.kv_sect.is-ready .kv_swiper .swiper-slide-active .bg img,
.kv_sect.is-ready .kv_swiper .swiper-slide-duplicate-active .bg img { transform: scale(1); }
.kv_sect .kv_swiper .bg::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,.25); }
.kv_sect .kv_txt { position: absolute; left: 0; right: 0; bottom: 41rem; z-index: 3; padding-left: 10rem; }
/* 타이틀 문구가 관리자(배너 관리)에서 오므로 중문·일문이 들어올 수 있다 → CJK 폴백 포함 토큰 사용. */
.kv_sect .kv_txt .tit { font-family: var(--enCjk); font-weight: 600; font-size: max(9.5rem, 34px); line-height: 1.2;  color: #fff; letter-spacing: -0.01em;}
/* 배너에 링크가 설정된 경우에만 출력되는 전면 링크(_Skin/1.php KV 루프). */
.kv_sect .kv_swiper .kv_link { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 4; }
.kv_sect .kv_txt .txt { margin-top: 3rem; font-size: var(--h6); font-weight: 600; line-height: 1.5; color: #fff; }
.kv_sect .kv_txt p { overflow: hidden; }
.kv_sect .kv_txt p span { display: block; transform: translateY(110%); transition: transform 1s ease-in-out; }
.kv_sect .kv_txt .tit p:nth-child(2) span { transition-delay: .12s; }
.kv_sect .kv_txt .txt span { transition-delay: .36s; }
.kv_sect.is-ready .kv_swiper .swiper-slide-active .kv_txt p span,
.kv_sect.is-ready .kv_swiper .swiper-slide-duplicate-active .kv_txt p span { transform: translateY(0); }
.kv_sect .kv_frac {position: absolute;right: 11.5rem;bottom: 5rem;z-index: 5;width: 6.4rem;height: 8.1rem;color: #fff;}
.kv_sect .kv_frac .cur { position: absolute; left: 0; top: 0; font-size: max(4.5rem, 20px); font-weight: 400; line-height: 1; }
.kv_sect .kv_frac .line { position: absolute; left: 2.5rem; top: 2.9rem; width: 1px; height: 5.7rem; background: rgba(255,255,255,.3); transform: rotate(33.5deg); }
.kv_sect .kv_frac .tot { position: absolute; right: 0; bottom: 0; font-size: var(--h6); font-weight: 400; line-height: 1; color: rgba(255,255,255,.3); }
.kv_sect .kv_frac .bar { display: none; }   /* 768 이하 진행바 */

/* KV 빠른 상담 신청 카드 (글래스) */
.kv_consult { --consult-left: 0rem; --consult-form-w: 35.9rem; --consult-toggle-w: 3.2rem; position: fixed; left: var(--consult-left); bottom: 2rem; z-index: 100; display: flex; align-items: stretch; width: calc(var(--consult-form-w) + var(--consult-toggle-w)); min-height: 28rem; transition: transform 0.6s ease-in-out; }
.kv_consult.is-closed { transform: translateX(calc((var(--consult-form-w) + var(--consult-left)) * -1)); }
.kv_consult form { width: var(--consult-form-w); padding: 2.5rem; background: linear-gradient(143deg, rgba(73,60,117,0) 64%, rgba(73,60,117,.4) 100%), rgba(255,255,255,.15); backdrop-filter: blur(25px); -webkit-backdrop-filter: blur(25px); transition: background 0.3s ease-in-out; }
.kv_consult.is-scrolled form { background: #fff; }
.kv_consult.is-closed form { pointer-events: none; }
.kv_consult .kv_consult_toggle { flex: 0 0 var(--consult-toggle-w); display: flex; align-items: center; justify-content: center; border-radius: 0 1rem 1rem 0; background: #DBD6EB; color: var(--point01); pointer-events: auto; transition: background .3s, color .3s; }
@media (min-width: 1241px) {
    .kv_consult .kv_consult_toggle:hover { background: var(--point01); color: #fff; }
}
.kv_consult .kv_consult_toggle svg { transition: transform 0.3s ease-in-out; }
.kv_consult.is-closed .kv_consult_toggle svg { transform: rotate(180deg); }
.kv_consult .cst_head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.kv_consult .cst_head .tit { font-size: var(--p3); font-weight: 700; line-height: 1.2;  color: #fff; }   /* 번역이 길면(영문 Request a Consultation) 두 줄로 — 전화번호는 한 줄 유지 */
.kv_consult .cst_head .tel, .kv_consult .cst_head .tel:visited { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--p5); font-weight: 500; line-height: 1; color: #fff; flex-shrink: 0; white-space: nowrap; }
@media (min-width: 1241px) {
    .kv_consult .cst_head .tel:hover { color: #DBD6EB; }
}
.kv_consult .cst_head .tel svg { width: 0.7em; height: 0.7em; }
.kv_consult .inp { display: block; width: 100%; height: max(5.4rem, 44px); padding: 0 1.5rem; border-radius: .5rem; background: var(--grayBg1); font-size: var(--p6); font-weight: 500; color: var(--black); }
.kv_consult .inp::placeholder { color: var(--gray70); }
.kv_consult .inp + .inp { margin-top: 1rem; }
.kv_consult .agree_row { display: flex; align-items: center; gap: .7rem; margin: 1.5rem 0 2rem; }
.kv_consult .agree_row label { display: inline-flex; align-items: center; gap: .7rem; cursor: pointer; font-size: var(--p7); font-weight: 500; line-height: 1;  color: #fff; }
.kv_consult .agree_row .chk_ico { display: inline-flex; align-items: center; justify-content: center; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: var(--grayBg1); }
.kv_consult .agree_row .chk_ico svg { width: .9rem; height: .7rem; opacity: 1; }
.kv_consult .agree_row input:checked + .chk_ico {background-color: var(--point01);}
.kv_consult .agree_row input:checked + .chk_ico svg path {stroke: #fff;}
.kv_consult .agree_row .btn_detail { margin-left: .3rem; padding-bottom: .3rem; border-bottom: 1px solid rgba(255,255,255,.5); font-size: var(--p8); font-weight: 600; line-height: 1; color: rgba(255,255,255,.5); }
@media (min-width: 1241px) {
    .kv_consult .agree_row .btn_detail:hover { border-bottom-color: #fff; color: #fff; }
}
.kv_consult .btn_submit { display: block; width: 100%; height: max(5.5rem, 44px); border-radius: .5rem; background: var(--point01); color: #fff; font-size: var(--p5); font-weight: 700; transition: background .3s, transform .3s, box-shadow .3s; }
@media (min-width: 1241px) {
    .kv_consult .btn_submit:hover { background: var(--black);}
}
.kv_consult .btn_submit:active { transform: translateY(0); box-shadow: none; }
.kv_consult .cst_msg { margin-top: 1rem; font-size: var(--p7); color: #fff; display: none; }
.kv_consult .cst_head .tit,
.kv_consult .cst_head .tel,
.kv_consult .agree_row label,
.kv_consult .agree_row .btn_detail,
.kv_consult .cst_msg { transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out; }
.kv_consult.is-scrolled .cst_head .tit,
.kv_consult.is-scrolled .cst_head .tel,
.kv_consult.is-scrolled .cst_head .tel:visited,
.kv_consult.is-scrolled .agree_row label,
.kv_consult.is-scrolled .cst_msg { color: var(--black); }
.kv_consult.is-scrolled .agree_row .btn_detail { border-bottom-color: var(--black); color: var(--black); }
@media (min-width: 1241px) {
    .kv_consult.is-scrolled .cst_head .tel:hover, .kv_consult.is-scrolled .agree_row .btn_detail:hover { border-bottom-color: var(--point01); color: var(--point01); }
}

/* ---------- ELEV Signature — "Private Anti-Aging" 마스크 텍스트 줌스루 + 콘텐츠 등장 ---------- */
.sig_sect { position: relative; height: 450lvh; background: var(--point01); }
.sig_sect .sticky { position: sticky; top: 0; height: 100lvh; overflow: hidden; background: var(--point01); z-index: 1; }
.sig_sect .sticky .bg { position: absolute; inset: 0; }
.sig_sect .sticky .bg img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.sig_sect .sticky .bg .screen { position: absolute; inset: 0; background: #fff; }
/* .mask_metrics = 화면에 그리지 않는 '기준자' svg (글리프 좌표 측정용),
   .mask_canvas = 실제로 보이는 검정 오버레이 + 글자 구멍. 그리기는 _Skin/1.php 참고.
   SVG mask 를 ×380 까지 CSS 확대하면 크롬이 만들어야 할 마스크 표면이 54만×34만px 이 되어
   재래스터를 포기한다(새로고침 후 그 구간으로 바로 들어가면 구멍이 잘리거나 이전 배율로 남음). */
.sig_sect .mask_metrics { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; }
.sig_sect .mask_canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.sig_sect .mask_text { font-family: var(--en); font-weight: 600; font-size: 100px;  fill: #000; }
/* flex-end 로 붙이면 콘텐츠가 100vh 를 넘길 때 위(제목)부터 잘려 나간다 → center 로 두어
   넘치더라도 위아래로 나눠 걸리게 하고, 여백을 줄여 일반적인 뷰포트에서 한 화면에 들어오게 한다. */
/* 하단 여백: 시안(Figma 177:198)은 컨트롤 줄 아래로 100px(=10rem) 를 비운다. 다만 시안의 세로
   리듬을 그대로 쌓으면 1152px 가 필요해 900 높이 창에서는 컨트롤이 화면 바닥에 붙어버린다 →
   여백은 8rem 으로 잡고 모자란 만큼은 헤더가 가려주는 위쪽에서 흡수시킨다.
   창이 더 낮아지면(720 등) 8rem 이 오히려 위쪽을 더 잘라먹으므로 화면 높이에 맞춰 줄인다. */
.sig_sect .cont_box { position: sticky; top: 0; z-index: 5; height: 100lvh; margin-top: -100lvh; display: flex; flex-direction: column; justify-content: center; padding: var(--hdH) 0 min(8rem, calc(var(--vh, 1vh) * 7)); opacity: 0; pointer-events: none; transition: opacity .5s ease-in-out; }
.sig_sect .cont_box .sect_tit_box { opacity: 0; transform: translateY(80px); transition: opacity .6s ease-in-out .1s, transform .6s ease-in-out .1s; }
.sig_sect .cont_box .sect_tit_box .sect_tit { color: #fff; }
/* 100vh sticky 안에 제목+슬라이더가 모두 들어와야 하므로 이 섹션만 간격을 좁힌다 */
.sig_sect .cont_box .sect_tit_box .sect_txt { color: #fff; }
/* 시안은 제목-슬라이더 간격이 10rem 이지만, 100lvh 안에 제목+카드+컨트롤을 다 넣어야 해서
   이 섹션만 좁힌다(위 .sect_txt / 아래 .slide_ctrl 과 같은 이유) */
.sig_sect .cont_box .sig_slider { margin-top: 6rem; opacity: 1; transform: translateY(80px); transition: opacity .6s ease-in-out .25s, transform .6s ease-in-out .25s; }
.sig_sect.active .cont_box { opacity: 1; pointer-events: auto; }
.sig_sect.active .cont_box .sect_tit_box, .sig_sect.active .cont_box .sig_slider { opacity: 1; transform: none; }
.sig_sect.no_motion { height: auto; }
.sig_sect.no_motion .sticky { position: relative; }
.sig_sect.no_motion .mask_metrics, .sig_sect.no_motion .mask_canvas { display: none; }
.sig_sect.no_motion .sticky .bg .screen { opacity: 0; }
.sig_sect.no_motion .cont_box { opacity: 1; pointer-events: auto; }
.sig_sect.no_motion .cont_box .sect_tit_box, .sig_sect.no_motion .cont_box .sig_slider { opacity: 1; transform: none; }
/* 낮은 창에서는 제목+카드+컨트롤이 100lvh 를 넘겨 컨트롤이 화면 밖으로 밀린다.
   카드 비율(시안)은 건드리지 않고 이 섹션의 세로 간격만 한 단계 더 좁힌다. */
@media screen and (max-height: 820px) {
    .sig_sect .cont_box .sect_tit_box .sect_txt { margin-top: 2rem; }
    .sig_sect .cont_box .sig_slider { margin-top: 4rem; }
    .sig_sect .cont_box .slide_ctrl { margin-top: 2rem; }
    .sig_sect .cont_box .slide_bottom { margin-top: 2rem; }
}
.sig_sect .swiper-container { overflow: visible; }
/* 100vh sticky 안에 제목+카드+컨트롤이 모두 들어와야 해서 이 섹션만 컨트롤 간격을 좁힌다 */
.sig_sect .cont_box .slide_ctrl { margin-top: 3rem; }
.sig_sect .sig_card { display: block; position: relative; height: auto; padding:3rem; border-radius: 2rem ;background: rgba(255,255,255,.25); backdrop-filter: blur(25px); -webkit-backdrop-filter: blur(25px); color: #fff; transition: .5s;}
/* 링크는 제목에만 있고 덮개(::after)가 카드 전체를 덮어 예전처럼 카드 어디를 눌러도 이동한다(_Skin/1.php — 설명 문장을 링크 밖에 두기 위함) */
.sig_sect .sig_card .sig_link { color: inherit; }
.sig_sect .sig_card .sig_link::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.sig_sect .sig_card .sig_link:focus-visible { outline: none; }
.sig_sect .sig_card .sig_link:focus-visible::after { outline: 2px solid currentColor; outline-offset: -2px; }
.sig_sect .sig_card .thumb { overflow: hidden; padding-top: 65%; position: relative;}
.sig_sect .sig_card .thumb img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
@media (min-width: 1241px) {
    .sig_sect .sig_card:hover .thumb img { transform: scale(1.05); }
    .sig_sect .sig_card:hover {background-color: #fff; color: var(--black);}
}
.sig_sect .sig_card .tit { margin-top: 2.2rem; font-size: var(--h6); font-weight: 700; }
.sig_sect .sig_card .txt { margin-top: 1.6rem; font-size: var(--p3); }

/* ---------- Search ---------- */
.search_sect { padding: var(--pd2) 0 0; text-align: center; background: #fff; }
.search_sect .search_box { width: 100rem; max-width: 100%; margin: var(--contMt2) auto 0; }
.search_sect .search_bar { position: relative; }
.search_sect .search_bar input { width: 100%; height: max(15rem, 70px); padding: 0 12rem 0 4.5rem; border-radius: 2rem; background: var(--black); font-size: var(--h4); font-weight: 600;  color: #fff; clip-path: inset(0 50% 0 50%); transition: clip-path .9s cubic-bezier(.16, 1, .3, 1); }
.search_sect.active .search_bar input { clip-path: inset(0 0 0 0); }
.search_sect .search_bar input::placeholder { color: #fff; opacity: 0; transition: opacity .45s ease .65s; }
.search_sect.active .search_bar input::placeholder { opacity: 1; }
.search_sect .search_bar .btn_search { position: absolute; right: 4.5rem; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: max(5.5rem, 30px); height: max(5.9rem, 32px); opacity: 0; transition: opacity .45s ease .7s; }
.search_sect.active .search_bar .btn_search { opacity: 1; }
.search_sect .search_bar .btn_search svg { width: 100%; height: 100%; }
.search_sect .keyword_box { display: flex; align-items: flex-start; gap: 6rem; margin-top: 5rem; padding-left: 6.8rem; text-align: left; opacity: 0; transform: translateY(3rem); transition: opacity .55s ease .85s, transform .65s cubic-bezier(.16, 1, .3, 1) .85s; }
.search_sect.active .keyword_box { opacity: 1; transform: translateY(0); }
.search_sect .keyword_box .label { flex-shrink: 0; font-size: var(--p2); font-weight: 700; line-height: 3.8rem; color: var(--black); }
.search_sect .keyword_box .tags { display: flex; flex-wrap: wrap; gap: 1.5rem; width: 70.8rem; max-width: 100%; }
.search_sect .keyword_box .tags a { display: inline-flex; align-items: center; height: 2.875em; padding: 0 1.7em; border-radius: 10em; background: var(--beige); font-size: var(--p4); font-weight: 500;  color: #968469; transition: background .3s, color .3s; }
.search_sect .keyword_box .tags a.active { background: var(--brown); color: #fff; }
@media (min-width: 1241px) {
    .search_sect .keyword_box .tags a:hover { background: var(--brown); color: #fff; }
}

/* ---------- Event & Notice ---------- */
.event_sect { position: relative; padding: var(--pd) 0 var(--pd2);}
.event_sect .event_slider { position: relative; margin-top: var(--contMt1); opacity: 0; transform: translateY(6rem); transition: opacity .8s ease .25s, transform .9s cubic-bezier(.16, 1, .3, 1) .25s; }
.event_sect.active .event_slider { opacity: 1; transform: translateY(0); }
.event_sect .swiper-container { overflow: hidden; }
.event_sect .ev_card { display: block; }
/* 지그재그 스태거 — DOM 순서(nth-child)가 아니라 '활성 슬라이드' 기준이라 슬라이드될 때마다 위/아래가 뒤바뀌며 애니메이션된다.
   padding-bottom 으로 내려갈 자리를 미리 확보하고, translateY 로만 움직여 레이아웃 리플로우를 피한다.
   [class$=-active] 는 loop 모드의 복제 슬라이드(swiper-slide-duplicate-active)까지 함께 잡기 위한 접미사 매칭. */
.event_sect .ev_card.swiper-slide { padding-bottom: 15.4rem; transition: transform .8s ease-in-out; width: 33.33%;}
.event_sect .ev_card.swiper-slide[class$=-prev],
.event_sect .ev_card.swiper-slide[class$=-active] + .ev_card,
.event_sect .ev_card.swiper-slide[class$=-active] + .ev_card + .ev_card + .ev_card,
.event_sect .ev_card.swiper-slide[class$=-active] + .ev_card + .ev_card + .ev_card + .ev_card + .ev_card { transform: translateY(15.4rem); }
.event_sect .ev_card .thumb { overflow: hidden; border-radius: 2rem; padding-top: 100%; background: var(--grayBg1); position: relative;}
.event_sect .ev_card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; position: absolute; left: 0; top: 0;}
@media (min-width: 1241px) {
    .event_sect .ev_card:hover .thumb img { transform: scale(1.05); }
}
.event_sect .ev_card .desc { margin-top: var(--contMt4); padding: 0 2rem; }
.event_sect .ev_card .badges { display: flex; gap: 1rem; }
.event_sect .ev_card .tit { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-top: 2rem; font-size: var(--p1); font-weight: 700; line-height: 1.5; color: var(--black); }
.event_sect .ev_card .txt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 2rem; font-size: var(--p3); font-weight: 500; line-height: 1.5;  color: var(--black); opacity: .6; }
.event_sect .ev_nav { position: absolute; top: 25.45rem; z-index: 5; width: max(9.2rem, 40px); height: max(9.2rem, 40px); display: flex; align-items: center; justify-content: center; transition: opacity .3s; }
.event_sect .ev_nav svg { width: 100%; height: 100%; }
.event_sect .ev_nav svg path { transition: transform .3s ease-in-out; }
.event_sect .ev_nav.prev { left: -17.8rem; transform: translateY(-50%) scaleX(-1); }
.event_sect .ev_nav.next { right: -17.8rem; transform: translateY(-50%); }
@media (min-width: 1241px) {
    .event_sect .ev_nav.prev:hover svg path, .event_sect .ev_nav.next:hover svg path { transform: translateX(.5rem); }
}
.event_sect .ev_nav.swiper-button-disabled { opacity: .25; }
@media screen and (max-width: 1620px) { .event_sect .ev_nav { display: none; } }

/* ---------- 의료진 (Dr. Jeongwoo Lee) ---------- */
.doctor_sect { position: relative; overflow: hidden; background: #ccc7cf; padding: 36rem 10rem 0;}
.doctor_sect .bg { position: absolute; inset: 0; z-index: 0; }
.doctor_sect .bg img { width: 100%; height: 100%; object-fit: cover; object-position: top;}
.doctor_sect .marquee { position: absolute; top: var(--pd4); left: 0; z-index: 1; width: 100%; overflow: hidden; white-space: nowrap; pointer-events: none; display: none;}
.doctor_sect .marquee .track { display: inline-block; min-width: 200%; font-family: var(--en); font-weight: 700; font-size: 30rem; line-height: 1.05;  background: linear-gradient(0deg, rgba(255,255,255,.3) 13%, #fff 87%); -webkit-background-clip: text; background-clip: text; color: transparent; will-change: transform; animation: doctorMarquee 52s linear infinite; }
@keyframes doctorMarquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.doctor_sect .doc_frame {z-index: 2; padding-top: 48%; border-radius: 6rem 6rem 0 0; overflow: hidden; background: #b9b3ae; position: relative;
    /* 마스크 리빌(2026-10-08 사용자 지시) — ① 오른쪽 → 왼쪽으로 회색 영역이 펼쳐지며 인물도 함께 드러나고(1.3s)
       ② 다 펼쳐지면 문구가 아래에서 올라오고(.doc_tit/.ghost_name, 1.2s~)
       처음엔 대각선(우상단→좌하단)이었으나 같은 날 사용자 지시로 가로 방향(inset 왼쪽 값 100%→0)으로 바꿨다 */
    clip-path: inset(0 0 0 100%); -webkit-clip-path: inset(0 0 0 100%);
    transition: clip-path 1.3s cubic-bezier(.65,0,.35,1), -webkit-clip-path 1.3s cubic-bezier(.65,0,.35,1);}   /* 상단 좌우 곡선은 처음부터 6rem 고정(768 이하 30px) — 2026-10-08 우상단만 크게 키우던 곡선 완성 단계 제거 */
.doctor_sect .doc_frame img { position: absolute; display: block; max-width: none; }
.doctor_sect .doc_frame .doc_bg { inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); transform-origin: 100% 50%; transition: transform 1.6s cubic-bezier(.33,1,.68,1); }
.doctor_sect .doc_frame .doc_person { right: 13%; bottom: 0; z-index: 4; width: auto; height: 100%; filter: drop-shadow(0 2.4rem 5rem rgba(48,42,52,.18)); transform: scale(1.05); transform-origin: 50% 100%; transition: transform 1.6s cubic-bezier(.33,1,.68,1) .1s; }   /* 마스크와 함께 노출 — 따로 페이드하지 않고 살짝 줄어들며 자리 잡는다 */
.doctor_sect .doc_frame::before { content: ''; position: absolute; inset: 0; z-index: 1; background: radial-gradient(circle at 62% 42%, rgba(255,255,255,.32), rgba(255,255,255,0) 32%); opacity: 0; transition: opacity 1s ease-in-out .35s; pointer-events: none; }
.doctor_sect .doc_frame::after { content: ''; position: absolute; inset: 0; z-index: 3; background:rgba(0,0,0,0.15); pointer-events: none; }
.doctor_sect .doc_tit { position: absolute; left: 25rem; top: 66.5rem; z-index: 3; pointer-events: none; opacity: 0; transform: translateY(8rem); transition: opacity .9s ease-out 1.2s, transform 1s cubic-bezier(.16,1,.3,1) 1.2s; }   /* 마스크가 다 펼쳐진 뒤 */
.doctor_sect .doc_tit .tit { font-family: var(--en); font-weight: 200; font-size: max(10rem, 28px); line-height: 1.1;  color: #fff; }
.doctor_sect .doc_tit .txt { margin-top: 5rem; font-size: max(3.2rem, 14px); font-weight: 700; line-height: 1.5;  color: #fff; }
.doctor_sect .doc_tit .txt b { display: block; font-weight: 700; }
.doctor_sect .ghost_name { position: absolute; left: 25rem; bottom: 5rem; z-index: 3; font-family: var(--en); font-weight: 600; font-size: 23rem; line-height: 1; white-space: nowrap; color: rgba(82,77,95,.1); pointer-events: none; opacity: 0; transform: translateY(8rem); transition: opacity .9s ease-out 1.35s, transform 1s cubic-bezier(.16,1,.3,1) 1.35s; }
.doctor_sect.active .doc_tit,
.doctor_sect.active .ghost_name { opacity: 1; transform: none; }
.doctor_sect.active .doc_frame { clip-path: inset(0 0 0 0); -webkit-clip-path: inset(0 0 0 0); }
.doctor_sect.active .doc_frame .doc_bg,
.doctor_sect.active .doc_frame .doc_person { transform: none; }
.doctor_sect.active .doc_frame::before { opacity: 1; }

/* ---------- 숫자로 보는 (Dr 상세) ---------- */
.stat_sect { padding: var(--pd1) 0; background: var(--grayBg1); text-align: center; }
.stat_sect .stat_tit { font-family: var(--en); font-weight: 600; font-size: var(--h3); line-height: 1.2; color: var(--point01); opacity: 0; transform: translateY(6rem); transition: opacity 1s ease-in-out, transform 1s ease-in-out; }
.stat_sect .stat_tit small { display: block; font-size: inherit; font-weight: inherit; }
.stat_sect .stat_list { display: flex; margin-top: var(--contMt1); padding: 0 28rem; }
.stat_sect .stat_list li { flex: 1 1 0; padding: 4rem 0 0;}
.stat_sect .num_wrap { display: flex; align-items: flex-end; justify-content: center; gap: 1rem; line-height: 1; color: var(--point01); }
.stat_sect .num_wrap .num { font-family: var(--en); font-size: max(11rem, 40px); font-weight: 500; white-space: nowrap; }
.stat_sect .num_wrap .unit { padding-bottom: 1.1rem; font-size: var(--h6); font-weight: 300; white-space: nowrap; opacity: 0; transform: translateY(4rem); transition: opacity 0.6s ease-in-out .2s, transform 0.6s ease-in-out .2s; }
.stat_sect .stat_list .name { margin-top: 5rem; font-size: var(--p1); font-weight: 500; line-height: 1.3;  color: var(--point01); opacity: 0; transform: translateY(4rem); transition: opacity 0.6s ease-in-out .4s, transform 0.6s ease-in-out .4s; }
.stat_sect .stat_list .term { margin-top: 1.5rem; font-size: var(--p3); font-weight: 500; line-height: 1;  color: var(--point01); opacity: 0; transform: translateY(4rem); transition: opacity 0.6s ease-in-out .6s, transform 0.6s ease-in-out .6s; }
.stat_sect.active .stat_tit,
.stat_sect.active .num_wrap .unit,
.stat_sect.active .stat_list .name { opacity: 1; transform: none; }
.stat_sect.active .stat_list .term { opacity: .5; transform: none; }
/* .row32 — 한 줄 5개가 칸을 넘칠 때 common.js statListFit 이 붙인다(2026-10-15 — 일문·중문 769~1040 등, 크기를 줄이지 않고 3-2).
   값은 600 블록 3-2 와 같고 칸 폭만 넓다. 3개도 안 들어가면 .wrap221(2-2-1) */
.stat_sect .stat_list.row32 { flex-wrap: wrap; gap: 25px 10px; justify-content: center; max-width: 640px; margin-left: auto; margin-right: auto; }
.stat_sect .stat_list.row32 li { flex: none; width: auto; padding: 0; }
.stat_sect .stat_list.row32 li:nth-child(1) { margin-right: auto; }
.stat_sect .stat_list.row32 li:nth-child(3) { margin-left: auto; }
.stat_sect .stat_list.row32 li:nth-child(-n+3) { min-width: 28%; }
.stat_sect .stat_list.row32 li:nth-child(n+4) { width: auto; min-width: calc(40% - 10px); }
.stat_sect .stat_list.row32.wrap221 li { width: auto; min-width: calc(50% - 5px); margin: 0; }
.stat_sect .stat_list.row32 .name { white-space: nowrap; }

/* ---------- TOP TRAINER (사업분야) ---------- */
.biz_sect { padding: 0 0 var(--pd); background: var(--grayBg1); }
.biz_sect .in_w {max-width: 254rem; padding: 0 8rem;}
.biz_sect .biz_tit_box { text-align: center; }
.biz_sect .biz_tit_box .tit { font-family: var(--en); font-weight: 600; font-size: var(--h3); line-height: 1.2; text-transform: uppercase; color: var(--point01); }
.biz_sect .biz_tit_box .txt { margin-top: 2rem; font-size: var(--p3); font-weight: 500; line-height: 1.65;  color: var(--point01); }

.biz_sect .biz_list {display: flex; width: 100%; height: 50rem; margin-top: var(--contMt3);}
.biz_sect .biz_list .item{position: relative; height:100%; border-radius: 2rem; overflow:hidden; flex: 1; opacity: 0; transform: translateY(8rem); transition: flex 0.5s ease-in-out 0s, opacity 1s ease-in-out, transform 1s ease-in-out; transform-origin: center;}
.biz_sect .biz_list .item::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(73, 60, 117, 0.00) 69.7%, rgba(73, 60, 117, 0.90) 110%), linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%); transition: opacity 0.3s ease-in-out;}
.biz_sect .biz_list .item + .item{margin-left:2rem;}
.biz_sect .biz_list .item a{position: relative; display: block; width: 100%; height: 100%; }
.biz_sect .biz_list .item .img_box{position: relative; height: 100%;}
.biz_sect .biz_list .item .img_box img{position: absolute; inset:0; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.biz_sect .biz_list .item .txt_box { position: absolute; left: 0; bottom: 0; transform: translateY(calc(100% + -21rem)); width: 100%; padding: 5rem 4rem; color: #fff; z-index: 3; transition: transform 0.3s ease-in-out;}
.biz_sect .biz_list .item .txt_box .sub_tit{display: block;font-size:10px; min-height: calc(var(--p4) * 1.7) ;font-weight: 600; opacity: 0; transition: opacity 0.3s ease-in-out, font-size 0.3s ease; text-transform: uppercase;}
.biz_sect .biz_list .item .txt_box .tit{font-size: var(--h7); font-weight: 600; margin-top:4rem; opacity: 1 ;transition:font-size 0.3s ease-in-out;}
.biz_sect .biz_list .item .txt_box .txt{font-size: 10px; margin-top:1.5rem; opacity: 0; transition: opacity 0.3s ease-in-out, font-size 0.3s ease ;}

.biz_sect .biz_list .item .txt_box .btn{display: flex; align-items: center; justify-content: center; position: absolute; bottom: calc(3rem + var(--p4) * 1.7); right:5rem; width:8rem; height:8rem; background: #fff; border-radius: 50%; opacity:0;  transition: opacity 0.3s ease-in-out;}
.biz_sect .biz_list .item .txt_box .btn .ico{width:25%; height:25%; background: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 0L8.2375 1.7625L15.2125 8.75H0L0 11.25H15.2125L8.2375 18.2375L10 20L20 10L10 0Z' fill='black'/%3E%3C/svg%3E%0A") no-repeat center / contain;}
.biz_sect .biz_list .item .basic_tit { position: absolute; left: 2.5rem; bottom: 4.5rem;  width: 100%; font-size: var(--h7); font-weight: 600; transition: 0.3s ease-in-out; opacity: 0}

.biz_sect .biz_list .item.active { flex: 2.5; transition: flex 0.5s ease-in-out 0s;}

.biz_sect .biz_list .item.active .basic_tit {opacity: 0}
.biz_sect .biz_list .item.active .txt_box {transform: translateY(0); transition: transform 0.3s ease-in-out 0.3s;}
.biz_sect .biz_list .item.active .txt_box .sub_tit{ font-size: var(--p4);opacity:1; transition: opacity 0.3s ease-in-out 0.3s }
.biz_sect .biz_list .item.active .txt_box .tit{ font-size: var(--h7); opacity: 1; transition: font-size 0.3s ease-in-out 0s;}
.biz_sect .biz_list .item.active .txt_box .txt{ font-size: var(--p4); opacity:1; transition: opacity 0.3s ease-in-out 0.3s , font-size 0.3s ease-in-out 0.15s;}
.biz_sect .biz_list .item.active .txt_box .btn{ opacity: 1; transition: opacity 0.3s ease-in-out 0.3s;}
.biz_sect.active .biz_list .item { opacity: 1; transform: none; }
.biz_sect.active .biz_list .item:nth-child(1) { transition-delay: 0s, .05s, .05s; }
.biz_sect.active .biz_list .item:nth-child(2) { transition-delay: 0s, .17s, .17s; }
.biz_sect.active .biz_list .item:nth-child(3) { transition-delay: 0s, .29s, .29s; }
.biz_sect.active .biz_list .item:nth-child(4) { transition-delay: 0s, .41s, .41s; }
.biz_sect.active .biz_list .item:nth-child(5) { transition-delay: 0s, .53s, .53s; }
.biz_sect.active .biz_list .item:nth-child(6) { transition-delay: 0s, .65s, .65s; }



/* .biz_sect .biz_card { position: relative; flex: 1 1 0; height: 50rem; border-radius: 3rem; overflow: hidden; cursor: pointer; transition: flex-grow .6s cubic-bezier(0.16, 1, 0.3, 1); }
.biz_sect .biz_card.active { flex-grow: 2.667; }
.biz_sect .biz_card .thumb { position: absolute; inset: 0; }
.biz_sect .biz_card .thumb img { width: 100%; height: 100%; object-fit: cover; }
.biz_sect .biz_card .label { position: absolute; left: 4rem; bottom: 5rem; z-index: 2; font-size: max(2.7rem, 15px); font-weight: 700; line-height: 1.5; color: #fff; white-space: nowrap; transition: opacity .3s ease .4s; }
.biz_sect .biz_card .detail { position: absolute; left: 4rem; right: 14rem; bottom: 5rem; z-index: 2; opacity: 0; visibility: hidden; transition: opacity 0s, visibility 0s; }
.biz_sect .biz_card.active .label { opacity: 0; transition: opacity .2s ease; }
.biz_sect .biz_card.active .detail { opacity: 1; visibility: visible; transition: opacity .4s ease .45s, visibility 0s; }
.biz_sect .biz_card .detail .cate { font-size: var(--p4); font-weight: 700; line-height: 1.5;  color: #fff; }
.biz_sect .biz_card .detail .tit { margin-top: 1rem; font-size: max(2.7rem, 15px); font-weight: 700; line-height: 1.5; color: #fff; }
.biz_sect .biz_card .detail .txt { margin-top: 1.5rem; font-size: var(--p4); line-height: 1.5;  color: #fff; }
.biz_sect .biz_card .btn_go { position: absolute; right: 4rem; bottom: 5rem; z-index: 2; display: flex; align-items: center; justify-content: center; width: max(8rem, 48px); height: max(8rem, 48px); border-radius: 50%; background: #fff; opacity: 0; visibility: hidden; transition: opacity 0s, visibility 0s; }
.biz_sect .biz_card.active .btn_go { opacity: 1; visibility: visible; transition: opacity .4s ease .45s, visibility 0s; }
.biz_sect .biz_card .btn_go svg { width: 32%; height: 32%; }


 */

/* ---------- Review ---------- */
.ko .review_sect {display: none;}
.review_sect { position: relative; padding: var(--pd2) 0 var(--pd4); overflow: hidden; background: #644F7A; }
.review_sect .bg { position: absolute; inset: 0; z-index: 0; }
.review_sect .bg img { width: 100%; height: 100%; object-fit: cover; }
.review_sect .in { position: relative; z-index: 1; }
.review_sect .sect_tit_box .sect_tit { color: #fff; }
.review_sect .sect_tit_box .sect_txt { color: #fff; }
.review_sect .sect_tit_box .sect_txt { font-size: var(--p5); font-weight: 400; line-height: 1.5; opacity: .6; }   /* 2026-10-15 시안 177:403 — 소제목이 안내 문장으로 바뀌어 15 Regular 60% */
.review_sect .google_score { display: flex; align-items: center; color: #fff; text-align: center; position: relative;}
.review_sect .google_score .wing { width: 10.2rem; height: auto; transform: translateX(-32%) scaleX(1)  translateY(5rem)  rotate(8deg); flex-shrink: 0; position: absolute; bottom: 0; left: 0; opacity: 0; transition: opacity 1s ease-in-out .25s, transform 1s ease-in-out .25s; }
.review_sect .google_score .wing.right {transform: translateX(32%) scaleX(-1) translateY(5rem) rotate(-8deg); left: auto; right: 0;}
.review_sect .google_score .score_box { opacity: 0; transform: translateY(7rem) scale(.96); transition: opacity 1s ease-in-out .1s, transform 1s ease-in-out .1s; }
.review_sect.active .google_score .wing { opacity: .08; transform: translateX(-80%) translateY(0) scaleX(1) rotate(0); }
.review_sect.active .google_score .wing.right { transform: translateX(80%) translateY(0) scaleX(-1) rotate(0); }
.review_sect.active .google_score .score_box { opacity: 1; transform: none; }

.review_sect .google_score .score { display: flex; align-items: flex-end; justify-content: center; font-family: var(--en); font-weight: 400; line-height: 1; }
.review_sect .google_score .score .num { font-size: max(18rem, 44px); letter-spacing: -0.03em; }
.review_sect .google_score .caption { font-size: var(--h8); font-weight: 500; line-height: 1.5;  }

.review_sect .slide_box {margin-top: var(--contMt1); padding-left: max(calc((100% - var(--in))/2 + var(--inPd)) , var(--inPd))}
.review_sect .review_slider { padding-right: var(--inPd); opacity: 0; transform: translateX(-10rem); transition: opacity 1s ease-in-out .25s, clip-path 1s ease-in-out .25s, transform 1s ease-in-out .25s; }
.review_sect .review_slider .swiper-container {overflow: visible;}
.review_sect.active .review_slider { opacity: 1; transform: none; }

.review_sect .rv_card { display: flex; flex-direction: column; width: 38.5rem; height: 34rem; padding: 4rem; border-radius: 2rem; background: #fff; color: var(--black); cursor: pointer; transition: transform .35s ease, box-shadow .35s ease; }
/* 호버 — 카드가 살짝 떠오르며 옅은 그림자(2026-10-26 사용자 지시: 예전 「검정 카드로 색 반전」 제거) */
@media (min-width: 1241px) {
    .review_sect .rv_card:hover { transform: translateY(-1rem); box-shadow: 0 1.6rem 4rem rgba(28,28,28,.12); }
}
.review_sect .rv_card .rv_head { display: flex; align-items: center; gap: .5rem; }
.review_sect .rv_card .rv_head .rate { font-size: var(--p3); font-weight: 700; line-height: 1;}
.review_sect .rv_card .rv_head .stars { display: flex; margin-top: -2px;}
.review_sect .rv_card .rv_head .stars svg { width: max(1.6rem, 11px); height: max(1.6rem, 11px); }
.review_sect .rv_card .rv_head .gm_logo { position: relative; margin-left: auto; width: max(7.7rem, 62px); aspect-ratio: 196 / 36; }   /* 시안 177:403 「Google Maps」 로고 77x14 — 흰 카드 회색 / 검정(hover, 시안 「2 on」) 흰색 */
.review_sect .rv_card .rv_head .gm_logo img { display: block; width: 100%; height: 100%; transition: opacity .35s ease; }
.review_sect .rv_card .rv_head .gm_logo .white { position: absolute; inset: 0; opacity: 0; }
.review_sect .rv_card .txt { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin-top:4rem; font-size: var(--p6); line-height: 1.5; opacity: .6; transition: opacity .35s ease; }
.review_sect .rv_card.dark .txt { opacity: 1; }
.review_sect .rv_card .writer { display: flex; align-items: center; gap: 1.5rem; margin-top: auto; padding-top: 2rem; }
.review_sect .rv_card .writer .avatar { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; border-radius: 50%; overflow: hidden; background: var(--point01); color: #fff; font-size: var(--p6); font-weight: 700; line-height: 1; }   /* 사진 대신 가린 이름의 첫 글자(2026-10-12) */
.review_sect .rv_card .writer .avatar img { width: 100%; height: 100%; object-fit: cover; }
.review_sect .rv_card .writer .name { font-size: var(--p3); font-weight: 700; line-height: 1.3; }
.review_sect .rv_card .writer .date { display: block; margin-top: .5rem; font-size: var(--p8); font-weight: 500; line-height: 1; color: var(--gray30); }
.review_sect .btn_wrap { margin-top: var(--contMt1); text-align: center; }
.review_sect .btn_more { border-color: #fff; color: #fff; }
@media (min-width: 1241px) {
    .review_sect .btn_more:hover { background: #fff; color: var(--black); }
}

/* ---------- Academic Activities ---------- */
.academic_sect { padding: var(--pd1) 0; background: #fff; }
.academic_sect .academic_slider { margin-top: var(--contMt2); opacity: 0; transform: translateY(8rem); transition: opacity 1s ease-in-out .2s, transform 1s ease-in-out .2s; }
.academic_sect.active .academic_slider { opacity: 1; transform: none; }
.academic_sect .swiper-container { overflow: visible; }
.academic_sect .ac_card { display: block; width: 45rem; opacity: 0; transform: translateY(6rem); transition: opacity 1s ease-in-out, transform 1s ease-in-out; }
.academic_sect.active .ac_card { opacity: 1; transform: none; }
.academic_sect.active .ac_card:nth-child(1) { transition-delay: .28s; }
.academic_sect.active .ac_card:nth-child(2) { transition-delay: .4s; }
.academic_sect.active .ac_card:nth-child(3) { transition-delay: .52s; }
.academic_sect.active .ac_card:nth-child(4) { transition-delay: .64s; }
.academic_sect.active .ac_card:nth-child(5) { transition-delay: .78s; }
.academic_sect.active .ac_card:nth-child(6) { transition-delay: .90s; }
.academic_sect .ac_card .thumb { overflow: hidden; border-radius: 2rem; padding-top: 100%; position: relative;}
.academic_sect .ac_card .thumb img { width: 100%; height: 100%; position: absolute; top:0; left:0; object-fit: cover ;transition: transform .5s; }
.academic_sect .ac_card .thumb::before {content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;object-fit: cover;object-position: center;display: block;background: rgba(0,0,0,0.02);z-index: 1;}
@media (min-width: 1241px) {
    .academic_sect .ac_card:hover .thumb img { transform: scale(1.05); }
}
.academic_sect .ac_card .desc { margin-top: var(--contMt4); padding: 0 2rem; }
.academic_sect .ac_card .date { display: block; margin-top: 2.5rem; font-size: var(--p5); line-height: 1; color: var(--gray40); }   /* 등록일 — 사용자 ACTIVITIES 목록(.sub_cont .thumb_list .date)과 같은 값(2026-11-02) */
.academic_sect .ac_card .tit { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 2rem; font-size: max(2.3rem, 16px); font-weight: 700; line-height: 1.5; color: var(--black); }

/* ---------- ELEV TV ---------- */
.tv_sect { padding: 0 0 var(--pd); background: #fff; }
.tv_sect .tv_boxes { display: flex; gap: 3rem; margin-top: var(--contMt2); }
.tv_sect .tv_box { height: 49.1rem; padding: 6rem 0 0; border-radius: 2rem; overflow: hidden; opacity: 0; transform: translateY(100px); transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out; }
.tv_sect.active .tv_box { opacity: 1; transform: none; }
.tv_sect.active .tv_box:nth-child(1) { transition-delay: .12s; }
.tv_sect.active .tv_box:nth-child(2) { transition-delay: .32s; }
.tv_sect .tv_box .box_head { display: flex; align-items: center; gap: 1rem; margin-bottom: 3rem; padding:0 5rem; font-size: var(--h6); font-weight: 600; line-height: 1;  color: var(--black); }
.tv_sect .tv_box .box_head svg { width: 3.6rem; height: auto; }
.tv_sect .tv_shorts .box_head svg { width: 2.3rem; }
.tv_sect .tv_youtube { flex: 0 0 93rem; background: rgba(73,60,117,.1); }
.tv_sect .tv_youtube .swiper-container { margin-left: 5rem; overflow: visible; }
.tv_sect .tv_shorts { flex: 1 1 auto; background: var(--grayBg1); }
.tv_sect .tv_shorts .swiper-container { max-width: 100%; margin: 0 auto; overflow: hidden; padding: 0 5rem;}
.tv_sect.tv_single .tv_box { flex: 1 1 auto; min-width: 0; }   /* 메인 노출 글이 한 구분에만 있으면 그 상자 하나가 전체 폭(_Skin/1.php) */
.tv_sect .yt_card { display: block; width: 37.1rem; }
.tv_sect .yt_card .thumb { overflow: hidden; padding-top: 56.25%; position: relative;}
.tv_sect .yt_card .thumb img {position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);width: 101%;height: 101%;object-fit: cover;transition: transform .3s ease-in-out;}
@media (min-width: 1241px) {
    .tv_sect .yt_card:hover .thumb img { transform: translate(-50%,-50%) scale(1.06); }
}
.tv_sect .yt_card .tit { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; width: 35.9rem; max-width: 100%; margin-top: 1rem; font-size: var(--p2); font-weight: 700; line-height: 1.7;  color: var(--black);}
.tv_sect .sh_card { display: block; width: 15.8rem; }
.tv_sect .sh_card .thumb { overflow: hidden; padding-top: 179%; position: relative;}
.tv_sect .sh_card .thumb img { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease-in-out;}
@media (min-width: 1241px) {
    .tv_sect .sh_card:hover .thumb img { transform: translate(-50%,-50%) scale(1.06); }
}
.tv_sect .tv_paging { display: flex; align-items: center; justify-content: center; gap: .5rem; margin-top: 3rem; }
.tv_sect .tv_paging .swiper-pagination-bullet { width: 5px; height: 5px; margin: 0; border-radius: 60rem; background: var(--black); opacity: .3; transition: width .3s, background .3s, opacity .3s; }
.tv_sect .tv_paging .swiper-pagination-bullet-active { width: 6rem; background: var(--point01); opacity: 1; }

/* 다국어 보정 — 비활성 biz 카드의 제목은 한 줄 전제 레이아웃이다.
   `.txt_box` 가 translateY(100% + -21rem) 로 밀려 하단 21rem 만 노출되므로,
   제목이 두 줄이 되면(영문 "Ulthera Prime" 등) 카드 밖으로 밀려 나온다.
   → 비활성일 때만 한 줄 말줄임으로 고정하고, 활성 카드는 원래대로 전체를 보여준다.
   (반응형 블록보다 앞에 둬야 1040 이하 슬라이드 모드의 줄바꿈 해제가 이긴다) */
.biz_sect .biz_list .item .txt_box .tit { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.biz_sect .biz_list .item.active .txt_box .tit { white-space: normal; overflow: visible; }

/* ============================================================
   반응형 — 1640 / 1440 / 1240 / 1040 / 768 / 600(폴드 이하)
   · 섹션 간격은 common.css 의 변수(--pd*, --contMt*)가 구간별로 바뀌므로 여기서 다시 주지 않는다.
   · 슬라이더 간격은 _Skin/1.php 의 Swiper 옵션이 담당 — 768 미만은 모든 슬라이더가
     slidesPerView 1.15 / spaceBetween 16 으로 같다(TV 카드처럼 폭이 고정인 슬라이더는 간격만 16).
   ============================================================ */

@media screen and (max-width: 1640px) {
    .kv_sect .kv_txt { padding-left: var(--hdIn); }
    .kv_sect .kv_txt .tit { font-size: 8.5rem; }
    .kv_sect .kv_frac { right: var(--hdIn); }

    .doctor_sect { padding-left: var(--inPd); padding-right: var(--inPd); padding-top: var(--pd2);}
    .doctor_sect .doc_tit,
    .doctor_sect .ghost_name { left: calc(var(--inPd) + 12rem); }

    .doctor_sect .doc_frame {padding-top: 52%;}
    .doctor_sect .doc_tit {top: 30%;}
    .doctor_sect .doc_frame .doc_person {right: 10%; height: 90%;}

    .stat_sect .stat_list { padding: 0 14rem; }
    .biz_sect .in_w { padding: 0 var(--inPd); }
}

@media screen and (max-width: 1440px) {
    /* 가장 긴 줄이 화면 폭의 절반 남짓에서 끝나도록 폭에 비례(인물은 오른쪽 절반) */
    .kv_sect .kv_txt .tit { font-size: 8rem; }

    /* 액자를 조금 높여 인물이 커지게 + 인물을 오른쪽으로 붙여 제목과의 간격 확보 */
    .doctor_sect .doc_frame { padding-top: 54%; }
    .doctor_sect .doc_frame .doc_person { right: 0%; }
    .doctor_sect .doc_tit { top: 40%; left: calc(var(--inPd) + 6rem);}

    .doctor_sect .doc_tit .tit {font-size: 8rem;}
    .doctor_sect .ghost_name { font-size: 10vw; left: calc(var(--inPd) + 6rem); }
    .doctor_sect .doc_tit .txt {font-size: var(--h6);}

    .stat_sect .stat_list { padding: 0; }
    .stat_sect .num_wrap .num {font-size:8rem;}
    .stat_sect .num_wrap .unit {font-size: var(--h8);}
    /* TOP TRAINER — 펼침 폭을 줄이고(2.5→2) 글 상자 폭을 「펼친 카드 폭」으로 고정한다.
       예전엔 카드가 넓어지는 0.5s 동안 글 상자 폭(100%)과 글자 크기가 같이 변해 문장이 줄마다 다시 감겼다.
       펼친 카드 폭 = (목록 폭 − 간격 2rem×5) × 2 / (2 + 1×5) — 목록을 컨테이너로 잡아 cqw 로 계산 */
    .biz_sect .biz_list { container-type: inline-size; }
    .biz_sect .biz_list .item.active { flex: 2; }
    .biz_sect .biz_list .item .txt_box { width: calc((100cqw - 10rem) * 2 / 7); padding: 3rem 2rem; }
    .biz_sect .biz_list .item .txt_box .tit { font-size: 20px; }
    .biz_sect .biz_list .item .txt_box .sub_tit,
    .biz_sect .biz_list .item .txt_box .txt { font-size: var(--p4); transition: opacity 0.3s ease-in-out; }
    .biz_sect .biz_list .item .txt_box .txt { padding-right: calc(44px + 1.5rem); }
    .biz_sect .biz_list .item.active .txt_box .tit { font-size: 20px; }
    /* 글 상자가 펼친 폭이라 접힌 카드 제목은 접힌 카드 폭((목록 − 10rem) / 7 − 좌우 여백) 안에서 말줄임 */
    .biz_sect .biz_list .item:not(.active) .txt_box .tit { max-width: calc((100cqw - 10rem) / 7 - 7rem); }
    .biz_sect .biz_list .item .txt_box .btn { right: 2rem; width: 44px; height: 44px; }

    .tv_sect .tv_youtube { flex-basis: 60%; }
    .tv_sect .yt_card {width: 40%;}
    .academic_sect .ac_card {width:30%;}


    .event_sect .event_slider {width: calc(100% + var(--inPd)); }

}

/* FAQ(faq_main_sect, 2026-11-02) — ELEV TV 아래. 제목 영역은 메인 공용 .sect_head/.btn_more, 아코디언은 서브 공용 .faq_sect(sub.css)와 같은 수치(메인은 sub.css 를 불러오지 않아 여기에 둔다) */
.faq_main_sect { padding: 0 0 var(--pd); background: #fff; }
.faq_main_sect .faq_list { margin-top: var(--contMt2); }
.faq_main_sect .faq_item { border-top: 1px solid var(--coolGray20); }
.faq_main_sect .faq_item:last-child { border-bottom: 1px solid var(--coolGray20); }
.faq_main_sect .faq_item.on + .faq_item { border-top-color: transparent; }
.faq_main_sect .faq_item.on:last-child { border-bottom-color: transparent; }
.faq_main_sect .q { display: flex; align-items: center; justify-content: space-between; gap: 3rem; width: 100%; padding: 3.5rem 3rem; text-align: left; color: var(--black); }
.faq_main_sect .q .tit { display: flex; align-items: center; gap: 2rem; font-weight: 700; }
.faq_main_sect .q .mark { flex-shrink: 0; font-size: var(--h6); line-height: 1; color: var(--point01); }
.faq_main_sect .q .txt { font-size: var(--p1); }
.faq_main_sect .q .arr { display: flex; flex-shrink: 0; width: 1.9rem; transform: rotate(180deg); transition: transform .3s; }
.faq_main_sect .q .arr svg { width: 100%; height: auto; }
.faq_main_sect .faq_item.on .q .arr { transform: rotate(0); }
.faq_main_sect .a { display: none; padding: 4rem 6rem; border-radius: 2rem; background: var(--grayBg1); }
.faq_main_sect .a .inner { display: flex; align-items: flex-start; gap: 3rem; max-width: 140rem; }
.faq_main_sect .a .mark { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 5.6rem; height: 5.6rem; border-radius: 50%; background: var(--point01); font-size: var(--h8); font-weight: 700; line-height: 1; color: #fff; }
.faq_main_sect .a .txt { display: grid; align-items: center; min-height: 5.6rem; font-size: var(--p3); }

@media screen and (max-width: 1240px) {
    .main_cont .sect_tit_box .sect_tit { font-size: 40px; }
    .main_cont .btn_more { padding: 14px 20px 14px 24px; gap: 10px; border-radius: 8px; }

    /* KV — 인물이 오른쪽에 있는 컷이 대부분이라 사진을 오른쪽으로 붙이고(cover 크롭이 얼굴을 가운데로 끌고 오지 않게)
       타이틀은 왼쪽 절반 안에서 상담 카드 위로만 쌓는다 */
    .kv_sect .kv_swiper .bg img { object-position: 78% 20%; }
    .kv_sect .kv_txt { bottom: 40rem; padding-right: var(--inPd); }
    .kv_sect .kv_txt .txt { margin-top: 2rem; font-size: 18px; }
    .kv_consult { left: 0; }

    .sig_sect .mask_text { font-size: 62px; }
    .sig_sect .sig_card { padding: 20px;}
    .sig_sect .sig_card .tit { margin-top: 16px; }
    .sig_sect .sig_card .txt { margin-top: 10px; }

    .search_sect .keyword_box { gap: 3rem; padding-left: 0; }

    .search_sect .keyword_box .tags a {font-size: var(--p6); padding: 0 1.5em; height: 2.5em;}


    .event_sect .ev_card .desc { padding: 0 1rem; }

    /* 의료진 — 액자 비율을 키워 인물이 잘리지 않게, 인물은 오른쪽 · 제목은 왼쪽 46% 안 */
    .doctor_sect { padding-top: 20rem; }
    .doctor_sect .doc_frame { padding-top: 62%; }
    .doctor_sect .doc_frame .doc_person { right: 4%; }
    .doctor_sect .doc_tit { top: 34rem; left: calc(var(--inPd) + 7rem); max-width: 46%; }
    .doctor_sect .doc_tit .in_f { width: auto; }
    .doctor_sect .doc_tit .tit { font-size: 48px; }
    .doctor_sect .doc_tit .txt { margin-top: 3rem; font-size: 18px; }
    .doctor_sect .ghost_name { left: calc(var(--inPd) + 7rem); bottom: 3rem; font-size: 15rem; }


    .stat_sect .stat_list li { flex: 1 1 28%; padding: 0; }
    .stat_sect .stat_list .name { margin-top: 3rem; }

    /* TOP TRAINER — 같은 너비의 슬라이드(_Skin/1.php 가 .cont 에 Swiper 를 건다). 모든 카드가 펼친 상태의 내용을 보여준다
       (2026-10-07 1040 → 1240 으로 시작점 이동. 1041~1240 의 클릭 아코디언 규칙은 삭제) */
    .biz_sect .cont.swiper-container { overflow: visible; margin-top: var(--contMt3); }
    .biz_sect .biz_list .item + .item {margin-left: 0;}
    .biz_sect .cont .biz_list.swiper-wrapper { height: auto; margin-top: 0; }
    .biz_sect .biz_list .item {flex: none; margin-left: 0;}
    /* 기본 .item.active 가 transition 을 flex 하나로 덮어써서(처음부터 active 인 2번째 카드) 등장 모션이 빠졌다 → 일반 카드와 같은 3종으로 복구
       (순서 = flex · opacity · transform — 위 nth-child transition-delay 3칸과 짝) */
    .biz_sect .biz_list .item.active {flex: none; transition: flex 0.5s ease-in-out, opacity 1s ease-in-out, transform 1s ease-in-out;}
    .biz_sect .biz_list .item a { padding-top: 62.5%; }
    .biz_sect .biz_list .item .img_box {position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
    .biz_sect .biz_list .item .img_box img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: center;}
    .biz_sect .biz_list .item .basic_tit { display: none; }
    .biz_sect .biz_list .item .txt_box { width: 100%; transform: none; padding: 30px 24px 28px; transition: none; }
    .biz_sect .biz_list .item .txt_box .sub_tit { min-height: 0; font-size: var(--p4); opacity: 1; transition: none; }
    .biz_sect .biz_list .item .txt_box .tit { margin-top: 10px; padding-right: 56px; max-width: none; font-size: var(--h7); white-space: normal; overflow: visible; transition: none; }
    .biz_sect .biz_list .item:not(.active) .txt_box .tit {max-width: none;}
    .biz_sect .biz_list .item .txt_box .txt { margin-top: 10px; padding-right: 56px; font-size: var(--p4); opacity: 1; transition: none; }
    .biz_sect .biz_list .item .txt_box .btn { bottom: 28px; right: 24px; width: 44px; height: 44px; opacity: 1; transition: none; }

    .review_sect .rv_card { padding: 3rem; }

    .academic_sect .ac_card { width: 38rem; }

    .academic_sect .ac_card .desc { padding: 0 1rem; }


    .tv_sect .tv_box { height: auto; padding: 40px 0; }
    .tv_sect .tv_box .box_head { margin-bottom: 24px; padding: 0 30px; }
    .tv_sect .tv_youtube .swiper-container { margin-left: 30px; }
    .tv_sect .tv_shorts .swiper-container { padding: 0 30px; }
    .tv_sect .yt_card { width: 300px; }
    .tv_sect .sh_card { width: 130px; }
    .tv_sect .tv_paging { margin-top: 24px; }
}

@media screen and (max-width: 1040px) {
    .faq_main_sect .a {padding: 3rem 5rem 5rem;}   /* FAQ — 서브 공용과 같은 값 */
    .faq_main_sect .a .inner {max-width: none;}

    .review_sect .google_score .score .num {font-size: 12rem;}
    .review_sect .google_score .caption {font-size: var(--p2);}

    .kv_sect .kv_txt {bottom: 40%;}
    .kv_sect .kv_txt .tit {font-size: 7.5rem;}
    .kv_sect .kv_txt .txt { font-size: 16px; }


    /* 모바일/태블릿에서는 스태거 해제 */
    .event_sect .ev_card.swiper-slide { padding-bottom: 0; }
    .event_sect .ev_card.swiper-slide[class$=-prev],
    .event_sect .ev_card.swiper-slide[class$=-active] + .ev_card,
    .event_sect .ev_card.swiper-slide[class$=-active] + .ev_card + .ev_card + .ev_card,
    .event_sect .ev_card.swiper-slide[class$=-active] + .ev_card + .ev_card + .ev_card + .ev_card + .ev_card { transform: none; }

    .doctor_sect .doc_frame { padding-top: 72%; }
    .doctor_sect .doc_frame .doc_person { height: 80%; right: 2%; }
    .doctor_sect .doc_tit { top: 30rem; max-width: 40%; }
    .doctor_sect .doc_tit .tit { font-size: 34px; }
    .doctor_sect .doc_tit .tit br { display: none; }
    .doctor_sect .doc_tit .txt { font-size: var(--p4); }
    .doctor_sect .doc_tit .txt br {display: none;}
    .doctor_sect .ghost_name { font-size: 13rem; }

    .search_sect .keyword_box .tags {width: 100%;}


    .stat_sect .num_wrap .num {font-size: 6rem;}


    .stat_sect .num_wrap .unit {font-size: var(--p3); padding-bottom: 0.2em;}
    .stat_sect .stat_list .name {font-size: var(--p3);}
    .stat_sect .stat_list .term {font-size: var(--p6);}
    /* 일문·중문 — 단위(万ショット·万发)와 항목명이 길어 1040 이하에서 칸을 넘치고 두 줄이 됐다(2026-10-15) → 한 단계 작게 */
    .ja .stat_sect .num_wrap .num, .zh_cn .stat_sect .num_wrap .num {font-size: 5rem;}
    .ja .stat_sect .num_wrap .unit, .zh_cn .stat_sect .num_wrap .unit {font-size: var(--p6);}
    .ja .stat_sect .stat_list .name, .zh_cn .stat_sect .stat_list .name {font-size: var(--p5);}

    .review_sect .google_score { align-self: flex-start; }


    .sig_sect .sig_card .tit {font-size: var(--h8);}

    /* ELEV TV — 유튜브 / 쇼츠 박스를 세로로 쌓고 각각 전체 너비(ssdream main_tv_sect 와 같은 방식) */
    .tv_sect .tv_boxes { flex-direction: column; gap: 20px; }
    .tv_sect .tv_youtube { flex: 0 0 auto; width: 100%; }
    .tv_sect .tv_shorts { width: 100%; }



    /* bg 패딩 */
    .stat_sect {padding-top: var(--pd2);}
    .biz_sect {padding: 0 0 var(--pd2);}
    .academic_sect {padding-top: var(--pd2);}



}

@media screen and (max-width: 768px) {
    .faq_main_sect .q {padding: 2.5rem 1.5rem;}   /* FAQ — 서브 공용과 같은 값 */
    .faq_main_sect .q .tit {align-items: flex-start; gap: 1.5rem;}
    .faq_main_sect .q .mark {font-size: var(--p1); margin-top: 2px;}
    .faq_main_sect .a {padding: 3rem 2.5rem 4rem;}
    .faq_main_sect .a .inner {gap: 1.5rem;}
    .faq_main_sect .a .mark {width: 3.5rem; height: 3.5rem; font-size: var(--p3);}
    .faq_main_sect .a .txt {min-height: 3.5rem;}


    .review_sect .google_score .score .num {font-size: 10rem;}
    .review_sect .google_score .caption {font-size: var(--p3);}


    .review_sect .rv_card .writer .date { font-size: var(--p7); }   /* 리뷰 작성일 — 768 이하 날짜 글자는 전부 p7 (2026-10-14 사용자 지시) */


    .main_cont .sect_tit_box .sect_tit { font-size: 32px; }
    .main_cont .btn_more { padding: 10px 14px }
    .main_cont .slide_ctrl { width: 100%; }
    .main_cont .sect_tit_box .sect_txt {font-size: var(--p2);}

    /* KV — 세로 화면은 얼굴이 화면 가운데를 채우므로 타이틀을 헤더 아래(머리·이마 쪽)로 올리고,
       아래쪽은 빠른 상담 카드에 양보한다 */


    .stat_sect .stat_tit {font-size: var(--h4);}
    .stat_sect .stat_list {margin-top: 45px;}


    .event_sect {padding-bottom: 60px}

    .kv_sect { min-height: 480px; }
    .kv_sect .kv_swiper .bg img { object-position: 72% 30%; }
    .kv_sect .kv_txt { padding-left: var(--inPd); padding-right: var(--inPd); }
    .kv_sect .kv_txt .tit {font-size: var(--d1);}
    .kv_sect .kv_txt .txt { margin-top: 12px; font-size: var(--p3Q); }
    .kv_sect .kv_txt .tit p {display: inline;}
    .kv_sect .kv_txt .tit p span {display: inline;}




    /* 빠른 상담 = 하단 고정 상담 바(시안 1735:3429, 2026-10-07) — 이름·연락처·신청하기 한 줄 + 동의 줄.
       접기 토글·머리글(타이틀·전화)은 쓰지 않고, 스크롤로 붙는 is-closed/is-scrolled 도 무시한다.
       높이(89px)는 푸터 --cstBarH(common.css 768)와 짝 — 바꾸면 같이 고칠 것(예약 버튼·푸터 여백이 이 위로 뜬다) */
    .kv_sect .kv_consult,
    .kv_sect .kv_consult.is-closed { left: 0; right: 0; bottom: 0; display: block; width: auto; min-height: 0; transform: none; }
    .kv_sect .kv_consult form,
    .kv_sect .kv_consult.is-closed form { display: grid; grid-template-columns: minmax(0, 145fr) minmax(0, 145fr) minmax(70px, 70fr); gap: 10px 5px; width: auto; padding: 10px 10px calc(10px + env(safe-area-inset-bottom)); background: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; pointer-events: auto; }
    .kv_sect .kv_consult .cst_head,
    .kv_sect .kv_consult .kv_consult_toggle { display: none; }
    .kv_sect .kv_consult .inp { grid-row: 1; height: 40px; padding: 0 10px; border-radius: 5px; font-size: 12px; }
    .kv_sect .kv_consult .inp + .inp { margin-top: 0; }
    .kv_sect .kv_consult .btn_submit { grid-row: 1; grid-column: 3; height: 40px; padding: 0 5px; border-radius: 5px; font-size: 12px; }
    .kv_sect .kv_consult .agree_row { grid-row: 2; grid-column: 1 / -1; gap: 5px; margin: 0; }
    .kv_sect .kv_consult .agree_row label,
    .kv_sect .kv_consult.is-scrolled .agree_row label { gap: 5px; font-size: 12px; color: var(--gray30); }
    .kv_sect .kv_consult .agree_row .chk_ico { width: 19px; height: 19px; background: var(--gray30); }
    .kv_sect .kv_consult .agree_row .chk_ico svg path { stroke: #fff; }
    .kv_sect .kv_consult .agree_row input:checked + .chk_ico { background: var(--point01); }
    .kv_sect .kv_consult .agree_row .btn_detail,
    .kv_sect .kv_consult.is-scrolled .agree_row .btn_detail { margin-left: 5px; border-bottom-color: var(--gray30); color: var(--gray30); font-size: 11px; opacity: .5; }
    .kv_sect .kv_consult .cst_msg { grid-column: 1 / -1; margin-top: 0; color: var(--black); }

    .sig_sect .mask_text { font-size: 7.5vw }

    /* KV 문구 + 롤링 — 시안 1735:3450: 문구 ↓20 롤링(1 · 3 + 진행바 150) ↓35 하단 상담 바(89px).
       대각선 분수 대신 한 줄 「숫자 · 숫자 ━━」, 진행바 채움은 _Skin/1.php kvFracBar() */
    .kv_sect .kv_txt { bottom: calc(89px + 35px + 13px + 45px); }
    .kv_sect .kv_frac {left: var(--inPd); right: auto; bottom: calc(89px + 50px); display: flex; align-items: center; gap: 5px; width: auto; height: 12px;}
    .kv_sect .kv_frac .cur,
    .kv_sect .kv_frac .line,
    .kv_sect .kv_frac .tot {position: static; transform: none;}
    .kv_sect .kv_frac .cur {font-size: 12px; font-weight: 700; letter-spacing: -0.02em; width: 0.7em;}
    .kv_sect .kv_frac .line {width: 2px; height: 2px; border-radius: 50%; background: rgba(255,255,255,.5);}
    .kv_sect .kv_frac .tot {font-size: 12px; font-weight: 700; letter-spacing: -0.02em; color: rgba(255,255,255,.5);}
    .kv_sect .kv_frac .bar {display: block; overflow: hidden; width: 150px; height: 2px; margin-left: 5px; background: rgba(255,255,255,.2); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);}
    .kv_sect .kv_frac .bar i {display: block; width: 0; height: 100%; background: #fff; transition: width .6s ease-in-out;}

    .kv_consult .agree_row .chk_ico svg {width: 1.5rem; height: auto;}

    .search_sect .search_bar input { height: 70px; font-size: var(--p1); border-radius: 10px; }
    .search_sect .search_bar .btn_search { right: 22px; width: 26px; height: 28px; }
    .search_sect .keyword_box { flex-direction: column; gap: 10px; margin-top: 24px; }
    .search_sect .keyword_box .label { line-height: 1.5; }
    .search_sect .keyword_box .tags { gap: 8px; }
    .search_sect .keyword_box .tags a {font-size: var(--p6);padding: 0 1.2em;height: 2.3em;}

    .main_cont .badge {font-size: 10px;}

    /* 의료진 — 세로 화면은 액자 높이를 고정하고 인물을 아래쪽에 작게, 제목은 인물 머리 위 공간에 */
    .doctor_sect .doc_tit {max-width: 50%;}
    .doctor_sect .doc_tit .txt b {display: inline;}
    .doctor_sect .ghost_name {font-size: 10vw;}
    .doctor_sect .doc_frame {padding-top: 60%; border-radius: 30px 30px 0 0;}

    .stat_sect .stat_list { gap: 40px 10px; }
    .stat_sect .stat_list li { flex: 1 1 40%; }
    .stat_sect .stat_list .name { margin-top: 16px; }
    .stat_sect .stat_list .term { margin-top: 8px; }

    .sig_sect {height: 250lvh;}
    .sig_sect .cont_box {height: 100svh;}


    /* 평점 박스 — 768 이하는 타이틀 묶음 아래 가운데(2026-10-15 사용자 지시) */
    .review_sect .sect_head {flex-direction: column; align-items: flex-start; gap: 5rem;}
    .review_sect .google_score {align-self: center;}
    .review_sect .rv_card { height: auto; min-height: 240px; padding: 24px; }
    .review_sect .rv_card .txt { margin-top: 20px; }
    .review_sect .google_score .wing {width: 8rem;}

    .academic_sect .ac_card .desc { margin-top: 20px; }
    .academic_sect .ac_card .tit { margin-top: 12px; }

    .event_sect .ev_card .desc { margin-top: 20px; }
    .event_sect .ev_card .tit,
    .event_sect .ev_card .txt { margin-top: 12px; }

    .sig_sect .sig_card .tit {font-size: var(--p1);}
}

@media screen and (max-width: 600px) {

    /* 섹션 머리 — 600 이하는 「타이틀 한 줄 전체 / 설명 | 버튼」 2단(2026-10-14 사용자 지시, 영문 포함 전 언어).
       .sect_tit_box 를 display:contents 로 풀어 타이틀·설명을 머리의 격자 칸에 직접 놓는다. 리뷰(구글 평점 상자)는 아래 세로 배치 */
    .main_cont .sect_head {display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 16px;}
    .main_cont .sect_head .sect_tit_box {display: contents;}
    .main_cont .sect_head .sect_tit {grid-column: 1 / -1;}
    .main_cont .sect_head .sect_txt {grid-column: 1;}
    .main_cont .sect_head .btn_more {grid-column: 2;}

    .review_sect .sect_head {display: flex; flex-direction: column; align-items: flex-start;}

    .review_sect .google_score .score .num {font-size: 36px}
    .review_sect .google_score .wing {width: 36px;}   /* 평점 글자(36px·두 줄)에 맞춘 날개 — rem 폭(105px)은 평점보다 커졌다 */
    .review_sect .google_score .caption {font-size: var(--p6); margin-top: 5px;}





    .main_cont .sect_tit_box .sect_tit { font-size: 28px; }
    .main_cont .sect_tit_box .sect_txt br { display: none; }

    .kv_sect .kv_txt .tit { font-size: 26px; }
    .kv_sect .kv_txt .tit br { display: none; }

    /* 600 이하는 두 줄("Private Anti-Aging," / "Just for You" — _Skin/1.php layoutLines). 한 줄 폭이 줄어든 만큼 키운다
       (viewBox 단위 — 375 폭에서 보이는 폭 665 중 1줄 약 76%) */
    .sig_sect .mask_text { font-size: 56px; }

    .search_sect .search_bar input { height: 54px; padding: 0 56px 0 18px; font-size: 15px; }
    .search_sect .search_bar .btn_search { right: 18px; width: 22px; height: 24px; }

    .doctor_sect { padding-top: 100px; }
    .doctor_sect .doc_frame { padding-top: 90%}
    .doctor_sect .doc_frame .doc_person {height: 78%;right: -3%;bottom: -4%;}
    .doctor_sect .doc_tit { top: 140px; left: calc(var(--inPd) + 24px); right: calc(var(--inPd) + 24px); max-width: none; }
    .doctor_sect .doc_tit .tit { font-size: 28px; }
    .doctor_sect .doc_tit .txt { margin-top: 16px; font-weight: 500; width: 55%; font-size: var(--p6)}
    .doctor_sect .doc_tit .txt br { display: none; }
    .doctor_sect .ghost_name { left: calc(var(--inPd) + 24px); bottom: 16px; font-size: 9.6vw; }

    .stat_sect .num_wrap .unit { padding-bottom: 6px; }
    .stat_sect .stat_list {flex-wrap: wrap; gap: 25px 10px; justify-content: center; max-width: 450px; margin-left: auto; margin-right: auto;}
    .stat_sect .stat_list li {flex:none; width: auto;}
    .stat_sect .stat_list li:nth-child(1) {margin-right: auto;}
    .stat_sect .stat_list li:nth-child(3) {margin-left: auto;}
    .stat_sect .stat_list li:nth-child(n+4) {width: calc(40% - 10px);}
    /* 3-2 / 2-2-1(2026-10-15) — 항목명은 두 줄로 넘기지 않고(nowrap), 윗줄 3개가 한 줄에 못 들어가면 common.js statListFit 이 .wrap221 을 붙여 2-2-1.
       윗줄 3개 최소 28% — 영문처럼 윗줄이 좁으면 넷째(40%)까지 올라와 4-1 이 됐다. 같은 규칙: ABOUT ELEV .abte_num(sub_resp.css 600) */
    .stat_sect .stat_list .name {white-space: nowrap;}
    .stat_sect .stat_list li:nth-child(-n+3) {min-width: 28%;}
    .stat_sect .stat_list li:nth-child(n+4) {width: auto; min-width: calc(40% - 10px);}   /* 아랫줄 — 고정 40% 면 영문 항목명(Global Ambassador & KOL)이 칸을 넘쳤다 */
    .stat_sect .stat_list.wrap221 li {width: auto; min-width: calc(50% - 5px); margin: 0;}   /* 반 칸보다 긴 항목(320 영문·일문)은 늘어나 그 줄을 혼자 쓴다 — 넘치지 않게 */
    .stat_sect .stat_list .name {margin-top: 13px;}
    .stat_sect .stat_list .term {font-size: var(--p8); margin-top: 6px;}



    .stat_sect .num_wrap {gap: 3px;}
    .stat_sect .num_wrap .num {font-size: min(38px, 10vw); letter-spacing: -0.02em;}   /* 10vw — 320 에서도 「2,500」 이 칸(⅓) 안에 */
    .stat_sect .num_wrap .unit { font-size: 10px;font-weight: 500;}

    .biz_sect .biz_list .item a {padding-top: 80%;}
    .biz_sect .biz_list .item .txt_box {padding: 20px 15px ;}
    .biz_sect .biz_list .item .txt_box .btn {right: 15px; width: 30px; height: 30px;}
    .biz_sect .biz_list .item .txt_box .txt {margin-top: 5px;}


    .tv_sect .tv_box { padding: 30px 0; }
    .tv_sect .tv_box .box_head { margin-bottom: 20px; padding: 0 var(--inPd); }
    .tv_sect .tv_youtube .swiper-container { margin-left: var(--inPd); }
    .tv_sect .tv_shorts .swiper-container { padding: 0 var(--inPd); }
    .tv_sect .yt_card { width: 80%; }
    .tv_sect .yt_card .tit { font-size: 15px; }
    .tv_sect .sh_card { width: 120px; }
}