body {word-break: keep-all !important}
/* 기본(PC): 줄바꿈 안 함 */
.mo-br{ display:none; }

/* 모바일에서만 줄바꿈 강제 */
@media (max-width:768px){
  .mo-br{
    display:block;
    height:0;            /* 여백 생기지 않도록 */
    line-height:0;
    margin:0;
  }
}
/* 기본(모바일 등): 줄바꿈 안 함 */
.pc-br{ display:none; }

/* PC에서만 줄바꿈 강제 */
@media (min-width:769px){
  .pc-br{
    display:block;
    height:0; line-height:0; margin:0;   /* 여백 없이 깔끔하게 */
  }
}


  /* ---------- 기본 변수 ---------- */
  :root{
    --th-max: 1280px;
    --th-gap-xl: 80px;
    --th-gap-lg: 48px;
    --th-gap-md: 28px;
    --th-text: #222;
    --th-muted: #666;
    --th-accent: #563A3A; /* 제목 보라톤 느낌 */
  }

  /* ---------- 섹션 래퍼 ---------- */
  .thermage-hero{
    color: var(--th-text);
    background: #fff;
  }
  .thermage-hero .th-container{
    max-width: var(--th-max);
    margin: 0 auto;
    padding: 200px 20px 0px;
    text-align: center;
    font-family: 'Noto Sans KR';
  }

  /* ---------- 타이틀 ---------- */
  .thermage-hero .th-title{
    margin: 0 0 24px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.05;
    color: var(--th-accent);
    font-size: clamp(40px, 7vw, 88px); /* 반응형 크기 */
  }

  /* ---------- 서브타이틀 ---------- */
  .thermage-hero .th-subtitle{
    margin: 0 auto;
    max-width: 920px;
    font-weight: 700;
    line-height: 1.6;
    font-size: clamp(15px, 2.2vw, 20px);
  }

  /* ---------- 가운데 점선 구분 ---------- */
/* ---------- 가운데 점선 구분 (원형 그라데이션 버전) ---------- */
.thermage-hero .th-divider {
  position: relative;
  width: 10px;   /* 원의 크기 */
  height: 120px; /* 세로 길이 (조정 가능) */
  margin: 60px auto 60px; /* 상단 여백 크게 */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.thermage-hero .th-divider::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 10px;
  transform: translateX(-50%);
  background: radial-gradient(circle at center, #563A3A 0%, #563A3A 20%, transparent 21%) 0 0 / 100% 24px repeat-y;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0));
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0));
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
}

  /* ---------- 설명문 ---------- */
  .thermage-hero .th-desc{
    margin: 0 auto var(--th-gap-xl);
    max-width: 880px;
    color: var(--th-muted);
    line-height: 1.8;
    font-size: clamp(12px, 1.9vw, 16px);
  }

  /* ---------- 장비 이미지 ---------- */
  .thermage-hero .th-figure{
    margin: 0;
  }
  .thermage-hero .th-figure img{
    width: min(580px, 90%);
    height: auto;
    display: block;
    margin: 0 auto;
    filter: drop-shadow(0 12px 28px rgba(0,0,0,.07));
  }

  /* ---------- 여백/타이포 모바일 튜닝 ---------- */
  @media (max-width: 768px){
    :root{
      --th-gap-xl: 56px;
      --th-gap-lg: 32px;
      --th-gap-md: 20px;
    }
    .thermage-hero .th-container{
      padding: 154px 18px 0px;
    }
  }


:root{
    --max-w: 1280px;
    --pad-x: 20px;
    --card-radius: 28px;
    --accent: #563A3A;     /* 보라 톤 */
    --ink: #111;           /* 본문 색 */
    --muted: #6f6f7d;      /* 서브 텍스트 */
  }

  /* 섹션 래퍼 */
  .awareness-sec{
    position: relative;
    background:#fff;
    overflow: hidden;
	background: url("../img/room-bg.jpg") center/cover no-repeat;
  }

  /* 배경(화면 가득) */
.awareness-bg{
  height: clamp(360px, 46vw, 520px);
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw); /* 컨테이너 탈출 */

}

  /* 가운데 카드 컨테이너 (배경 위로 살짝 띄우기) */
  .awareness-wrap{
    max-width: var(--max-w);
    margin: 0 auto;
    padding: 150px var(--pad-x);
    /*transform: translateY(-70px);*/
  }

  .awareness-card{
    display:grid;
    grid-template-columns: 1.1fr 1fr;
    background:#fff;
    border-radius: var(--card-radius);
    box-shadow: 0 20px 60px rgba(0,0,0,.18);
    overflow:hidden;
  }

  .aw-col{
    min-height: clamp(320px, 38vw, 420px);
  }

  .aw-col.text{
    padding: clamp(28px, 4.5vw, 52px);
    display:flex; flex-direction:column; justify-content:center;
  }
  .eyebrow{
    margin:0 0 10px; color:#9a9ab2; font-size:18px; letter-spacing:.02em;
  }
  .title{
    margin:0 0 18px;
    color:var(--ink);
    font-weight:800;
    line-height:1.22;
    letter-spacing:-.01em;
    font-size: clamp(26px, 3.6vw, 44px);
  }

  /* 불릿 */
  .bullet{ margin:0; padding:0; list-style:none; }
  .bullet li{
    position:relative; padding-left:22px;
    margin:10px 0; color:var(--muted);
    font-size: clamp(12px, 1.9vw, 16px); line-height:1.8;
  }
  .bullet li::before{
    content:"";
    position:absolute; left:0; top:.7em;
    width:10px; height:10px; border-radius:50%;
    background: radial-gradient(circle at 30% 30%, #563A3A 0 55%, #FFD368 56% 100%);
    box-shadow: 0 0 0 3px rgba(111,109,191,.12) inset;
  }
  /* xeicon 쓰고 싶으면 위 ::before 대신 아래 주석 사용
  .bullet li::before{ content:"\e928"; font-family:'xeicon'; color:var(--accent); left:0; top:.2em; width:auto; height:auto; background:none; }
  */

  .aw-col.photo{
    background:#eee;
  }
  .aw-col.photo img{
    width:100%; height:100%; object-fit:cover; display:block;
  }

  /* 반응형 */
  @media (max-width: 980px){
    .awareness-card{ grid-template-columns:1fr; }
    .awareness-wrap{ transform: translateY(-50px); }
    .aw-col.photo{ order:2; }
    .aw-col.text{ order:1; }
	.eyebrow {
    margin: 0 0 10px;
    color: #9a9ab2;
    font-size: 14px;
    letter-spacing: .02em;
}
  }

  @media (max-width: 520px){
    .awareness-bg{ height: 58vw; }
    .awareness-wrap{ transform: translateY(-40px); }
    .aw-col{ min-height: auto; }
  }


  /* 섹션 래퍼 */
.density-sec{
  position: relative;
  background:#fff;
  overflow:visible; /* 영상이 위로 겹치게 */
  font-family: system-ui, -apple-system, Segoe UI, Roboto, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  color:#222;
}

/* ===== 종이 질감 영역 ===== */
.density-sec__paper{
  position: relative;
  padding: 250px 0 400px; /* 위/아래 여백 */
}
.density-sec__paper::before{
  content:"";
  position:absolute; top:0; left:50%;
  width:100vw; height:100%;
  transform:translateX(-50%);       /* 풀-블리드 */
  background:
    /* 대각선 하이라이트/음영으로 접힌 느낌 */
    linear-gradient(135deg, rgba(255,255,255,0) 34%, rgba(255,255,255,.45) 52%, rgba(0,0,0,.05) 66%, rgba(0,0,0,0) 76%),
    url("/images/paper-texture.png") center/cover no-repeat,
    #eff0f2;
  box-shadow: inset 0 50px 80px rgba(0,0,0,.06), inset 0 -40px 60px rgba(0,0,0,.04);
  z-index:0;
}

/* 상단 중앙 노치 */
.density-sec__notch{
  position:absolute; left:50%; top:0px;
  transform:translateX(-50%);
  width:300px; height:202px;

  z-index:1;
}

/* 중앙 콘텐츠 */
.density-sec__inner{
  position:relative; z-index:2;
  max-width:1280px; margin:0 auto; padding:0 20px;
  text-align:center;
}
.density-sec__brand{
  display:block; margin:0 auto 54px;
  width:280px; height:auto;
}
.density-sec__headline{
  margin:0 auto 18px;
  font-weight:300; line-height:1.45;
  font-size:48px;
  font-family:"MaruBuri" 
}
.density-sec__hl{ color:#563A3A; font-weight:300; }
.density-sec__divider{
  display:block; width:1px; height:102px; margin:82px auto 88px;
  background:linear-gradient(#563A3A, #563A3A) no-repeat center/1px 100%;
  opacity:.7;
}
.density-sec__sub{
  margin:0; color:#6e6e7a; line-height:1.4; font-size:32px;  font-family:"MaruBuri" ;font-weight:300;
}
.density-sec__accent{ color:#563A3A;font-weight:300; }

/* ===== 동영상 ===== */
.density-sec__videoWrap{
  max-width:1280px; margin:0 auto -250px; padding:0 20px;
}
.density-sec__videoFrame{
  position:relative;
  aspect-ratio:16/9;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.18);
  transform:translateY(-48%); /* ★ 절반 겹침 */
}
.density-sec__videoFrame video{
  width:100%; height:100%; object-fit:cover; display:block;
}
.density-sec__videoLogo{
  position:absolute; right:16px; bottom:14px; width:120px; opacity:.92;
}

/* ===== 반응형 ===== */
@media (max-width: 920px){
  .density-sec__paper{ padding: 90px 0 170px; }
  .density-sec__brand{ width: 180px; }
  .density-sec__headline{ font-size:20px; }
  .density-sec__sub{ font-size:15px; }
  .density-sec__videoFrame{ transform: translateY(-42%); }
  .density-sec__videoWrap {max-width: 1280px;    margin: 0 auto 0px;    padding: 0 20px;}
.density-sec__inner{

  max-width:1280px; margin:0 auto; padding:100px 20px 0;

}
/* 상단 중앙 노치 */
.density-sec__notch{
zoom:0.4
}


}
@media (max-width: 520px){
  .density-sec__paper{ padding: 70px 0 150px; }
  .density-sec__brand{ width: 150px; }
  .density-sec__headline{ font-size:18px; }
  .density-sec__videoFrame{ transform: translateY(-38%); }
}


/* 섹션 래퍼 */
.flx-about{
  position: relative;
  background:#fff;
  text-align:center;
  padding: 110px 20px 40px; /* 상단 넉넉, 하단은 장비 영역이 담당 */
  font-family: system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  color:#111;
}

/* 텍스트 영역 */
.flx-about__inner{
  max-width: 920px;
  margin: 0 auto;
}
.flx-about__eyebrow{
  margin: 0 0 6px;
  font-size: clamp(12px, 1.6vw, 20px);
  color:#8f9099;
}
.flx-about__title{
  margin: 0 0 12px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.4;
  font-size: clamp(26px, 4vw, 48px);
}
.flx-about__subtitle{
  margin: 0 0 18px;
  font-weight: 800;
  font-size: clamp(16px, 2.2vw, 20px);
  color:#1a1a1a;
  line-height: 1.5;
}
.flx-about__desc{
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  margin: 0 auto;
  max-width: 880px;
  color:#6b6c76;
  line-height: 1.6;
  font-size: clamp(12px, 1.9vw, 16px);
}

/* 장비 이미지 + 바닥 그라데이션 */
.flx-about__device{
  position: relative;
  max-width: 1280px;          /* 장비 최대 폭 */
  margin: 36px auto 0;
  padding-top: 100px;
  padding-bottom: 100px;      /* 섹션 하단 여백 */
}
.flx-about__device::before{
  /* 바닥에 깔리는 은은한 타원형 그라데이션(바닥 그림자/광택 느낌) */
  content:"";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(1280px, 92vw);
  height: min(360px, 34vw);
  background: radial-gradient(ellipse at center 80%,
              rgba(0,0,0,.12) 0%,
              rgba(0,0,0,.06) 28%,
              rgba(0,0,0,0) 70%);
  filter: blur(6px);
  opacity: .16;
  pointer-events: none;
  z-index: 0;
}
.flx-about__device img{
  position: relative;
  z-index: 1;
  display: block;
  width: min(950px, 82vw);
  height: auto;
  margin: 0 auto;
  filter: drop-shadow(0 18px 40px rgba(0,0,0,.12));
}

/* 모바일 미세 조정 */
@media (max-width: 520px){
  .flx-about{ padding-top: 90px; }
  .flx-about__device::before{
    height: 42vw;
    opacity: .18;
  }

.flx-about__device {
    position: relative;
    max-width: 1280px;
    margin: 36px auto 0;
    padding-top: 50px;
    padding-bottom: 40px;
}

}

/* 래퍼 */
.tm-sec{
  background:#fff;
  padding: 80px 30px 110px;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  color:#111;
}

/* 공통 그리드 */
.tm-sec__row{
  max-width: 1280px;
  margin: 0 auto 0px;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 0px;
  text-align:center;
  align-items: center;
}
.tm-sec__row--gapXL{ gap: 56px; }

.tm-sec__col{ min-width: 0; }
.tm-sec__text{ /* 텍스트 폭 제한 */
  max-width: 560px;
  text-align:center;
}

/* 타이포 */
.tm-sec__title{
  margin: 0 0 14px;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.15;
  font-size: clamp(26px, 4.2vw, 44px);
}
.tm-sec__subtitle{
  margin: 0 0 14px;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.25;
  font-size: clamp(22px, 3vw, 32px);
}
.tm-sec__desc{
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  margin: 0;
  color:#666a73;
  line-height: 1.6;
  font-size: clamp(12px, 1.9vw, 16px);
}

/* 1) 우측 Before/After 페어 */
.tm-sec__pair{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.tm-sec__shot{
  margin: 0;
  background:#eee;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(0,0,0,.12);
}
.tm-sec__shot img{
  width:100%; height:100%; display:block; object-fit:cover;
}

/* 2) 좌 이미지 – 정품 인증서 */
.tm-sec__photo{
  margin: 0;
  border-radius: 16px;
  overflow:hidden;
  
}
.tm-sec__photo img{ display:block; width:100%; height:auto; object-fit:cover; }

.tm-sec__cta{
  display: inline-block;
  margin-top: 22px;
  padding: 12px 18px;
  border-radius: 999px;
  background:#3a3a7a;
  color:#fff;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(58,58,122,.25);
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.tm-sec__cta:hover{ transform: translateY(-1px); box-shadow:0 10px 22px rgba(58,58,122,.3); }
.tm-sec__cta:active{ transform: translateY(0); opacity:.9; }

/* 3) 팁 카드 2개 */
.tm-sec__cards{
  max-width: 1280px;
  margin: 60px auto 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}
.tm-card{
  background:#f6f7f9;
  border-radius: 18px;
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
  overflow:hidden;
  display:flex;
  flex-direction: column;
  min-height: 320px;
}
.tm-card__media{
  padding: 36px 20px 0;
  display: grid;
  place-items: center;
}
.tm-card__media img{
  width: 240px; max-width: 80%; height: auto; display:block;
}
.tm-card__body{
  padding: 18px 24px 28px;
}
.tm-card__eyebrow{
  margin: 0 0 4px; color:#8a8da0; font-size: 13px;
}
.tm-card__title{
  margin: 0 0 10px; font-weight: 900; font-size: 22px; letter-spacing:-0.01em;
}
.tm-card__list{
  margin: 0; padding: 0; list-style: none; color:#666a73; font-size: 15px; line-height: 1.9;
}
.tm-card__list li{ position: relative; padding-left: 16px; }
.tm-card__list li::before{
  content:""; position:absolute; left:0; top:.78em;
  width:6px; height:6px; border-radius:50%; background:#6f6dc0;
}

/* 반응형 */
@media (max-width: 1024px){
  .tm-sec__row{ grid-template-columns: 1fr; gap: 28px; margin-bottom: 0px; }
  .tm-sec__text{ max-width: none; }
  .tm-sec__pair{ gap: 12px; }
  .tm-sec__cards{ grid-template-columns: 1fr; }
  .tm-card__media img{ width: 220px; }
}
@media (max-width: 520px){
  .tm-sec{ padding-top: 64px; padding-bottom: 90px; }
  .tm-card__media{ padding-top: 26px; }
  .tm-card__media img{ width: 200px; }
}

/* --- Tips grid --- */
.tm-tips{
  max-width:1280px;
  margin:200px auto 100px;
  padding:0 0px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:start;
}

/* --- Media box (카드 스타일은 여기만) --- */
.tm-tip__mediaBox{
  background:#f5f5f5;
  border-radius:22px;
  min-height:260px;
  padding:40px;
  display:grid;
  place-items:center;

}
.tm-tip__mediaBox img{
  width:clamp(220px, 36vw, 80%);
  height:auto;
  display:block;
}

/* --- Text (카드 바깥) --- */
.tm-tip__meta{ margin-top:28px; }
.tm-tip__eyebrow{
  margin:0 0 8px;
  color:#8a8da0;
  font-size:18px;
}
.tm-tip__title{
  margin:0 0 14px;
  font-weight:900;
  letter-spacing:-.02em;
  line-height:1.15;
  font-size:clamp(26px, 4vw, 44px);
}
.tm-tip__list{
  margin:0; padding:0;
  list-style:none;
  color:#666a73;
  font-size:16px;
  line-height:1.9;
}
.tm-tip__list li{ position:relative; padding-left:16px; }
.tm-tip__list li::before{
  content:"";
  position:absolute; left:0; top:.78em;
  width:6px; height:6px; border-radius:50%;
  background:#6f6dc0;
}

/* --- Responsive --- */
@media (max-width:1024px){
  .tm-tips{ grid-template-columns:1fr; gap:50px; }
  .tm-tip__mediaBox{ min-height:220px; padding:30px; }
  .tm-tip__mediaBox img{ width:clamp(200px, 60vw, 320px); }
.tm-tip__list {font-size:12px;}



}


/* 래퍼 */
.kp-capsule{
  background:#fff;
  padding: 90px 0px 120px;
  text-align:center;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  color:#111;
}

/* 헤더 */
.kp-capsule__head{ max-width: 1000px; margin: 0 auto 18px; }
.kp-capsule__eyebrow{ margin:0 0 8px; color:#8f90a6; font-size:20px; }
.kp-capsule__title{
  margin:0 0 10px; font-weight:900; letter-spacing:-.02em; line-height:1.12;
  font-size: clamp(28px, 4.2vw, 48px);
}
.kp-capsule__sub{ margin:0; font-weight:800; color:#222; font-size:clamp(14px,2vw,18px); }

/* 히어로 영역(고정 비율로 프레임 왜곡 방지) */
.kp-capsule__hero{
  position: relative;
  width: min(1200px, 94vw);
  aspect-ratio: 1200 / 420;   /* 프레임 비율 고정 */
  margin: 80px auto 0;
  isolation: isolate;
}

/* 점선 캡슐 프레임 */
.kp-capsule__dots{
  position:absolute; inset:0;
  width:100%; height:100%;
  pointer-events:none;
  opacity:.95;
  z-index:1;                  /* 필요 시 0(원 뒤), 3(원 위)로 조정 */
}

/* 원 3개 */
.kp-capsule__circles{
  position:absolute;
  inset: clamp(28px, 4vw, 50px);   /* 프레임과 거리 */
  display:flex; justify-content:center; align-items:center;
  gap: clamp(12px, 2vw, 24px);
  z-index:2;
}
.kp-capsule__circle{
  width: clamp(220px, 33%, 360px);
  aspect-ratio: 1/1;
  border-radius:50%;
  display:grid; place-items:center;
  text-align:center;
  color:#3e3f61;
  /* 부드러운 깊이감 */
  box-shadow:
    0 20px 44px rgba(0,0,0,.08),
    inset 0 14px 42px rgba(255,255,255,.5),
    inset 0 -12px 38px rgba(0,0,0,.06);
}
.kp-capsule__circle--light{ background: rgba(86,58,58,.1); }
.kp-capsule__circle--mid{ background: rgba(86,58,58,.2); z-index:3; margin: 0 -4%; } /* 살짝 겹치게 */

.kp-capsule__inner{ padding: 0 24px; }
.kp-capsule__ctitle{
  margin:0 0 10px; font-weight:900; letter-spacing:-.01em;
  color:#563A3A; font-size: clamp(18px, 2.2vw, 28px);
}
.kp-capsule__cdesc{
  margin:0; color:#787b8f; line-height:1.8; font-size:clamp(13px, 1.7vw, 16px);
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;


}

@media (max-width: 960px){
.kp-capsule__eyebrow{ margin:0 0 8px; color:#8f90a6; font-size:14px; }
  .kp-capsule__hero{
    aspect-ratio: auto;
  }
  .kp-capsule__dots{ display: none; }

  .kp-capsule__circles{
    position: static;
    display: grid;
    grid-template-columns: 1fr;   /* 세로 스택 */
    justify-items: center;        /* 가로 가운데 */
    align-items: center;
    gap: 0;                        /* ← 겹치기를 위해 간격 제거 */
    margin-top: 16px;
  }

  .kp-capsule__circle{
    width: 70%;
    max-width: 420px;
    aspect-ratio: 1 / 1;
    z-index: 1;
  }

  /* 두 번째, 세 번째 원을 위로 겹치게 */
  .kp-capsule__circle + .kp-capsule__circle{
    margin-top: -10%;             /* ← 겹침 정도 (원 지름 대비) */
  }

  /* 가운데 원을 가장 위 레이어로 */
  .kp-capsule__circle:nth-child(2){ z-index: 3; }

  /* 필요하면 세 번째 원은 겹침을 조금 덜 주고 싶을 때 */
  /* .kp-capsule__circle:nth-child(3){ margin-top: -8%; } */
}


/* 섹션 래퍼 + 풀블리드 배경 */
.adv-sec{
  position: relative;
  overflow: hidden;
  color:#111;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
.adv-sec::before{
  /* ★ 배경 이미지 경로 교체 */
  content:"";
  position:absolute; inset:0;
  background: url("/images/advantage-bg.jpg") center/cover no-repeat;
  /* 가독성을 위한 은은한 화이트 오버레이 */
  box-shadow: inset 0 0 0 100vmax rgba(255,255,255,.78);
  z-index:0;
}

/* 내부 컨테이너 */
.adv-sec__inner{
  position: relative;
  z-index:1;
  max-width: 1280px;
  margin: 0 auto;
  padding: 110px 20px 250px;
}

/* 헤더 */
.adv-sec__head{ text-align:center; margin-bottom: 36px; }
.adv-sec__eyebrow{ margin:0 0 8px; color:#8e8fa1; font-size:20px; }
.adv-sec__title{
  margin:0 0 12px; font-weight:900; line-height:1.14; letter-spacing:-.02em;
  font-size: clamp(26px, 4vw, 44px);
}
.adv-sec__sub{ margin:0; color:#222; font-weight:800; font-size:clamp(14px,2vw,18px); }

/* 그리드: 데스크톱 2×2, 모바일 1열 */
.adv-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-top: 86px;
}

/* 카드 */
.adv-card{
  background: rgba(255,255,255,.94);
  border-radius: 22px;
  padding: clamp(30px, 3vw, 50px) clamp(30px, 3vw, 50px);
  box-shadow:
    0 18px 50px rgba(0,0,0,.10);
  position: relative;
}
/* 상단 소프트 하이라이트 */
.adv-card::after{
  content:"";
  position:absolute; left:12px; right:12px; top:10px; height:48px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,0));
  pointer-events:none;
}

.adv-card__point{
  margin:0 0 10px; color:#a6a8bd; font-size:16px; letter-spacing:.06em;
}
.adv-card__title{
  margin:0 0 12px; line-height:1.35; letter-spacing:-.01em;
  font-weight: 900; color:#563A3A;
  font-size: clamp(22px, 2.4vw, 32px);
}
.adv-card__accent{ color:#563A3A; }
.adv-card__desc{
  margin:0; color:#666a73; line-height:1.9; font-size: clamp(12px, 1.9vw, 16px);
}

/* 반응형: 모바일 1열 */
@media (max-width: 980px){
.adv-sec__eyebrow{ margin:0 0 8px; color:#8e8fa1; font-size:14px; }

  .adv-sec__inner{ padding: 90px 30px 100px; }
  .adv-grid{ grid-template-columns: 1fr; gap: 16px; }
}



/* 섹션 래퍼 + 풀블리드 배경 */
.rec-sec{
  position: relative;
  overflow: hidden;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  color:#111;
}
.rec-sec::before{
  content:"";
  position:absolute; inset:0;
  /* ★ 배경 이미지 경로 교체 */
  background:
    linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.55)),
    url("../img/recommended-bg.jpg") center/cover no-repeat;
  z-index:0;
}

/* 내부 컨테이너 */
.rec-sec__inner{
  position:relative; z-index:1;
  max-width: 1280px;
  margin: 0 auto;
  padding: 180px 20px 180px;
  display:flex; justify-content:center;
}

/* 카드 */
.rec-card{
  width: min(980px, 100%);
  background: rgba(255,255,255,.96);
  border-radius: 28px;
  box-shadow: 0 30px 80px rgba(0,0,0,.28);
  padding: clamp(86px, 4vw, 40px) clamp(42px, 4vw, 48px);
}

/* 헤더 타이포 */
.rec-head{ text-align:center; margin-bottom: clamp(18px, 3.2vw, 26px); }
.rec-eyebrow{ margin:0 0 8px; color:#9aa0a9; font-size:20px; }
.rec-title{
  margin:0;
  font-weight:900; letter-spacing:-.02em; line-height:1.2;
  font-size: clamp(22px, 3.8vw, 44px);
}

/* 리스트 */
.rec-list{ margin:0; padding:0; list-style:none; }
.rec-item{
  display:flex; gap:14px;
  align-items:flex-start;
  padding: 18px 0;
  border-bottom: 1px solid rgba(110,116,179,.22);
}
.rec-item:last-child{ border-bottom:none; }
.rec-item p{
  margin:0;
  color:#333842;
  line-height:2;
  font-size: clamp(12px, 1.95vw, 17px);
   font-weight:400;
}
.rec-hl{ color:#563A3A; font-weight:800; }

/* 체크 아이콘 (원 안에 체크) – 인라인 SVG 데이터 URI 사용 */
.rec-ico{
  width: 20px; height: 20px; flex: 0 0 20px; margin-top: 8px;
  background: no-repeat center / contain
    url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'>\
  <circle cx='12' cy='12' r='12' fill='%23563A3A'/>\
  <path d='M6.2 12.6l3.2 3.2 8.4-8.4' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/>\
</svg>");
}

/* 반응형: 모바일 1열 + 타이포/여백 축소 */
@media (max-width: 860px){
  .rec-sec__inner{ padding: 90px 16px 110px; }
  .rec-card{ border-radius: 22px; }
.rec-eyebrow{ margin:0 0 8px; color:#9aa0a9; font-size:14px; }

}
@media (max-width: 520px){
  .rec-sec__inner{ padding: 90px 30px 90px; }
  .rec-card{ padding: 22px 18px; }
  .rec-item{ padding: 14px 0; }
  .rec-ico{ width:18px; height:18px; flex-basis:18px; }
}


/* ================= Base ================= */
.cmp-v3{
  background:#fff;
  color:#111;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  padding: 150px 20px 150px;
}
.cmp-v3__inner{ max-width: 1180px; margin: 0 auto; }
.cmp-v3__head{ text-align:center; }
.cmp-v3__eyebrow{ margin:0 0 6px; color:#8e90a3; font-size:20px; }
.cmp-v3__title{
  margin:0 0 12px; font-weight:900; letter-spacing:-.02em; line-height:1.14;
  font-size: clamp(28px, 4.1vw, 46px);
}
.cmp-v3__desc{ margin:0; color:#5e6372; font-size:clamp(12px,1.9vw,16px); line-height:1.6; }

/* ================= Heroes ================= */
.cmp-v3__heroes{
  display:grid;
  grid-template-columns: 1fr 1px 1fr;
  gap: 110px;
  align-items: start;
  margin: 80px 0 20px;
}
.cmp-v3__divider{
  display:block; width:1px; height: 80%;
  background: #dddfea; align-self:center; justify-self:center;
}
.cmp-v3__hero{
  margin:0; background:#; border-radius: 0px; overflow:hidden;
  
}
.cmp-v3__hero img{ display:block; width:100%; height:auto; }
.cmp-v3__hero figcaption{
  text-align:center; padding: 14px 10px 18px;
}
.cmp-v3__hero figcaption strong{ display:block; font-size:22px; margin-bottom:4px; }
.cmp-v3__hero figcaption span{ display:block; color:#7a8191; font-size:14px; }

/* ================= Table (desktop) ================= */
.cmp-v3__tableWrap{ margin-top: 10px; }
.cmp-v3__table{
  width:100%; border-collapse: collapse; table-layout: fixed;
  background:#fff; border-radius: 12px; overflow:hidden;
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
}
.cmp-v3__table td{
  padding: 18px 20px;
  border-bottom: 1px solid #eceef5;
  font-size: 15px; line-height: 1.85; vertical-align: middle;
}
/* 좌·우 칼럼 */
.cmp-v3__cell{ background:#fff; }
.cmp-v3__cell--l{ text-align:center;color:#777  }
.cmp-v3__cell--r{ text-align:center; color:#563A3A ;font-weight:700}
/* 중앙 라벨 칼럼(보라 라운드 느낌) */
.cmp-v3__label{
  width: 220px;
  color:#fff; text-align:center; font-weight:800;
  background:#563A3A;
}
/* 중앙 라벨 줄무늬(명도차) */
.cmp-v3__table tr:nth-child(even) .cmp-v3__label{ background:#5d3939; }

/* 상단 보라 라인(좌/우만) */
.cmp-v3__table tr:first-child .cmp-v3__cell--l,

.cmp-v3__table tr:first-child .cmp-v3__cell--r{
  border-top: 1px solid #563A3A;
}


/* 하단 보라 라인(좌/우만) */
.cmp-v3__table tr:last-child .cmp-v3__cell--l,
.cmp-v3__table tr:last-child .cmp-v3__cell--r{
  border-bottom: 1px solid #563A3A;
}

/* 기본은 숨김(데스크톱) */
.cmp-v3__mobileTable { display: none; }

/* 모바일에서 테이블 노출 */
@media (max-width: 960px){

.cmp-v3{
  background:#fff;
  color:#111;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  padding: 50px 20px 50px;
}
.cmp-v3__eyebrow{ margin:0 0 6px; color:#8e90a3; font-size:14px; }

  /* 기존 DL 버전 숨김 */
  .cmp-v3__heroes{display:none}
  .cmp-v3__tableWrap{display:none}
  .cmp-v3__mobile { display: none !important; }

  .cmp-v3__mobileTable{
    display: grid;
    gap: 36px;
    margin-top: 12px;
  }

  .cmp-mt{
    background:#fff;
    border-radius: 18px;
    box-shadow: 0 12px 30px rgba(0,0,0,.08);
    padding: 50px 30px 50px;
  }
  .cmp-mt__thumb{
    width:100%; height:auto; display:block; border-radius:16px;
    background:#efe6dc;
  }
  .cmp-mt__title{ margin:12px 0 12px; font-weight:900; font-size:22px;text-align: center; }
  .cmp-mt__sub{ margin:0 0 10px; color:#6b7080; font-size:14px;text-align: center; }

  /* 2열 테이블 (좌 라벨 보라, 우 내용 흰색) */
  .cmp-mt__table{
    width:100%;
    border-collapse: collapse;
    table-layout: fixed;
    background:#fff;
    overflow: hidden;
  }
  .cmp-mt__table th,
  .cmp-mt__table td{
    padding: 14px;
    border-bottom: 1px solid #eceef5;
    font-size: 12px;
    line-height: 1.85;
    text-align: left;
    vertical-align: top;
  }
  .cmp-mt__table th{
    width: 38%;
    background:#6E6E73;
    color:#fff;
    font-weight:800;
    text-align:center;
  }
  /* 상·하 보라 라인 */
  .cmp-mt__table tbody tr:first-child th,
  .cmp-mt__table tbody tr:first-child td{ border-top: 1px solid #6E6E73; }
  .cmp-mt__table tbody tr:last-child th,
  .cmp-mt__table tbody tr:last-child td{ border-bottom: 1px solid #6E6E73; }


  /* 2열 테이블 (좌 라벨 보라, 우 내용 흰색) */
  .cmp-mt__table2{
    width:100%;
    border-collapse: collapse;
    table-layout: fixed;
    background:#fff;
    overflow: hidden;
  }
  .cmp-mt__table2 th,
  .cmp-mt__table2 td{
    padding: 14px;
    border-bottom: 1px solid #eceef5;
    font-size: 12px;
    line-height: 1.85;
    text-align: left;
    vertical-align: top;
  }
  .cmp-mt__table2 th{
    width: 38%;
    background:#563A3A;
    color:#fff;
    font-weight:800;
    text-align:center;
  }
  /* 상·하 보라 라인 */
  .cmp-mt__table2 tbody tr:first-child th,
  .cmp-mt__table2 tbody tr:first-child td{ border-top: 1px solid #563A3A; }
  .cmp-mt__table2 tbody tr:last-child th,
  .cmp-mt__table2 tbody tr:last-child td{ border-bottom: 1px solid #563A3A; }



}


/***** Thermage Process Slider (scoped with flxproc-) *****/

/* Section */
.flxproc-sec{
  position:relative;
  background-color:#fafafa;   
  padding:200px 20px 200px;
  color:#111;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
.flxproc-inner{ max-width:1280px; margin:0 auto; position:relative; }

/* Head */
.flxproc-head{ text-align:center; margin-bottom:22px; }
.flxproc-eyebrow{ margin:0 0 6px; color:#8d90a1; font-size:20px; }
.flxproc-title{ margin:0 0 50px 0; font-weight:900; letter-spacing:-.02em; font-size:clamp(26px,4.2vw,44px); }

/* Slick base (안정화) */
.flxproc-slider{ position:relative; }
.flxproc-slider .slick-list{ overflow:hidden !important; margin:0 !important; }
.flxproc-slider .slick-track{ display:block !important; }
.flxproc-slider .slick-slide{ padding:0 16px !important; outline:none; }

/* Card (그림자 제거) */
.flxproc-card{
  background:#fff;
  border-radius:24px;
  overflow:hidden;
  position:relative;
  box-shadow:none;              /* ← 문제1: 그림자 제거 */
  transition:none;
}
.flxproc-card:hover{ transform:none; box-shadow:none; }

/* Media */
.flxproc-media{ position:relative; aspect-ratio:4/3; background:#eee; }
.flxproc-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.flxproc-card,.flxproc-media{ border-radius:24px; }
.flxproc-media{ border-bottom-left-radius:0; border-bottom-right-radius:0; }

/* Badge (이미지 하단 경계선에 걸치게) */
.flxproc-badge{
  position:absolute; left:22px; bottom:-19px;   /* ← 문제2 해결 */
  width:40px; height:40px; border-radius:50%;
  display:grid; place-items:center;
  font-weight:800; color:#fff; background:#563a3a;
  box-shadow:0 6px 14px rgba(95,88,167,.35);
  z-index:2;
}

/* Body */
.flxproc-body{ padding:35px; }
.flxproc-cardtitle{ margin:0 0 10px; font-weight:900; letter-spacing:-.01em; font-size:clamp(18px,2.2vw,26px); }
.flxproc-text{ margin:0; color:#616676; line-height:1.6; font-size:15px; }

/* Dots (가운데 고정) */
.flxproc-ctrl{ width:100%; display:flex; justify-content:center; margin-top:18px; }
.flxproc-dots{ width:100%; display:flex; justify-content:center; }
.flxproc-dots .slick-dots{
  display:flex !important; gap:12px; align-items:center; justify-content:center;
  list-style:none; margin:0; padding:0;
}
.flxproc-dots .slick-dots li{ margin:0; }
.flxproc-dots .slick-dots button{
  width:11px; height:11px; border-radius:50%; background:#cfd1df; border:0; text-indent:-9999px; overflow:hidden;
  transition:transform .15s ease, background .15s ease;
}
.flxproc-dots .slick-dots .slick-active button{ background:#563A3A; transform:scale(1.25); }

/* Arrows — 슬라이더 양옆 세로 중앙 */
.flxproc-prev,.flxproc-next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:46px; height:46px; border-radius:50%;
  background:#fff; border:0; cursor:pointer;
  display:grid; place-items:center;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.flxproc-prev{ left:-8px; }   /* ← 문제4 해결: 양옆 배치 */
.flxproc-next{ right:-8px; }

/* Responsive */
@media (max-width:1024px){
  .flxproc-prev{ left:2px; } .flxproc-next{ right:2px; }
  .flxproc-badge{ width:36px; height:36px; bottom:-17px; left:18px; }
}
@media (max-width:768px){
.flxproc-text{ margin:0; color:#616676; line-height:1.6; font-size:12px; }
.flxproc-eyebrow{ margin:0 0 6px; color:#8d90a1; font-size:14px; }
  .flxproc-slider .slick-slide{ padding:0 12px !important; }
  .flxproc-cardtitle{ font-size:20px; }
  .flxproc-prev,.flxproc-next{ width:42px; height:42px; }
}
@media (max-width:520px){
  .flxproc-prev,.flxproc-next{ display:none; }  /* 작은 화면엔 제스처/도트 중심 */
  .flxproc-badge{ left:16px; bottom:-16px; width:34px; height:34px; }
}

/* --- 카드 높이 균일화 패치 --- */

/* slick 슬라이드가 높이를 강제로 잡지 않도록 */
.flxproc-slider .slick-slide{ height:auto; }

/* 카드 전체를 column-flex로 만들어 본문을 유연하게 확장 */
.flxproc-card{
  display:flex;
  flex-direction:column;
  height:100%;
}

/* 이미지 영역은 내용 높이에 영향 X */
.flxproc-media{ flex:0 0 auto; }

/* 본문을 같은 최소 높이로 고정 → 문구가 짧아도 카드가 짧아지지 않음 */
.flxproc-body{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  min-height: 168px;            /* 데스크톱 기준 최소 높이 */
}

/* 화면 크기에 따라 조금씩 조정(상황에 맞게 숫자만 미세조정 가능) */
@media (max-width: 1200px){ .flxproc-body{ min-height: 158px; } }
@media (max-width: 1024px){ .flxproc-body{ min-height: 150px; } }
@media (max-width: 520px) { .flxproc-body{ min-height: 140px; } }


/* ===== FAQ (flxfaq-) ===== */
.flxfaq-sec{
  background:#fff;
  color:#111;
  padding:200px 20px 200px;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
.flxfaq-inner{ max-width:1120px; margin:0 auto; }

.flxfaq-head{ text-align:center; margin-bottom:28px; }
.flxfaq-eyebrow{ margin:0 0 6px; color:#8e90a3; font-size:20px; }
.flxfaq-title{ margin:0; font-weight:900; letter-spacing:-.02em; font-size:clamp(28px,4.2vw,48px); }

/* 관리자 컨트롤(옵션) */
.flxfaq-admin{ display:none; gap:8px; justify-content:flex-end; margin:10px 0 8px; }
.flxfaq-sec[data-admin="true"] .flxfaq-admin{ display:flex; }
.flxfaq-btn{
  background:#f2f3f8; border:1px solid #e5e7f2; border-radius:10px;
  padding:8px 12px; font-size:14px; color:#3b3e55; cursor:pointer;
}
.flxfaq-btn:hover{ background:#e9ebf6; }

/* 리스트/아이템 */
.flxfaq-list{ border-top:1px solid #eceef5; }
.flxfaq-item{ border-bottom:1px solid #eceef5; padding:0; }

/* summary */
.flxfaq-summary{
  list-style:none;
  margin:0; padding:22px 0;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  cursor:pointer; user-select:none;
}
.flxfaq-summary::-webkit-details-marker{ display:none; }

.flxfaq-qwrap{ display:flex; align-items:center; gap:12px; }
.flxfaq-qidx{ color:#b6b7c7; font-weight:700; }
.flxfaq-qtext{ font-weight:800; font-size:18px; }

/* 플러스/마이너스 아이콘 */
.flxfaq-icon{
  position:relative; width:18px; height:18px; flex:0 0 18px;
}
.flxfaq-icon::before,
.flxfaq-icon::after{
  content:""; position:absolute; left:0; right:0; top:50%; margin:auto;
  height:2px; width:100%; background:#7d80a2; transform:translateY(-50%);
  transition:opacity .18s ease, transform .18s ease;
}
.flxfaq-icon::after{ transform:translateY(-50%) rotate(90deg); }
.flxfaq-item[open] .flxfaq-icon::after{ opacity:0; transform:translateY(-50%) rotate(90deg) scale(.6); }

/* 패널(답변) */
.flxfaq-panel{
  color:#5e6372; line-height:1.9; font-size:15px;
  padding:0 0 18px 66px;              /* Q 인덴트와 동일한 여백 */
  overflow:hidden; max-height:0;      /* close 상태 */
  transition:max-height .28s ease;
}
.flxfaq-item[open] .flxfaq-panel{ max-height:600px; } /* 답변이 매우 길면 값만 키워주세요 */

/* 접근성 focus */
.flxfaq-summary:focus-visible{ outline:2px solid #5f58a7; outline-offset:4px; }

/* 반응형 */
@media (max-width:768px){
.flxfaq-sec{
  background:#fff;
  color:#111;
  padding:100px 20px 100px;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}

.flxfaq-eyebrow{ margin:0 0 6px; color:#8e90a3; font-size:14px; }

  .flxfaq-panel{ padding-left:54px; }
  .flxfaq-qtext{ font-size:17px; }
}
@media (max-width:520px){
  .flxfaq-panel{ padding-left:0px;font-size:12px; }
  .flxfaq-qtext{ font-size:16px; }
}

/* ===== Before & After (bafe-) ===== */
.bafe-sec{
  background:#fff;
  color:#111;
  padding:80px 0 110px;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
.bafe-inner{ max-width:1180px; margin:0 auto; padding:0 20px; }

.bafe-head{ text-align:center; margin-bottom:22px; }
.bafe-eyebrow{ margin:0 0 6px; color:#8e90a3; font-size:20px; }
.bafe-title{ margin:0; font-weight:900; letter-spacing:-.02em; font-size:clamp(28px,4.2vw,48px); }

/* 풀블리드 자리잡기 박스 */
.bafe-bleed{ width:100%; }
.bafe-stage{
  width:100%;
  max-width:1280px;
  margin:0 auto;
 
  /* 원하는 비율/높이로 조정 */
  aspect-ratio: 16 / 7;             /* 가로 긴 띠 형태 */
  min-height: 660px;                /* 데스크톱 최소 높이 */
}

/* 하단 설명 */
.bafe-desc{ text-align:center; margin-top:26px; }
.bafe-copy{
  margin:0 0 10px;
  color:#5e6372;
  line-height:1.9;
  font-size:15px;
}
.bafe-emph{ margin:0;   font-size:24px;font-weight:800; }

/* 반응형 */
@media (max-width: 1024px){
  .bafe-stage{ min-height:320px; aspect-ratio: 16/7;
  .bafe-desc{ text-align:center; margin-top:380px; }
.bafe-emph{ margin:0;   font-size:18px;font-weight:800; }

  
  }
}
@media (max-width: 680px){
  .bafe-stage{ min-height:240px; aspect-ratio: 16/9; }
  .bafe-copy{ font-size:12px; }
  .bafe-desc{ text-align:center; margin-top:420px; }
.bafe-eyebrow{ margin:0 0 6px; color:#8e90a3; font-size:14px; }

}

.egg {max-width:1280px;margin:0 auto; padding:0 0px 150px 0;border-radius:15px;}
@media (max-width: 1024px){
.egg {max-width:1280px;margin:0 auto; padding:0 30px 50px ;border-radius:15px;}

}


/* ===== Thermage Specs (tm-specs-) ===== */

.tm-specs{
  background:#fff;
  color:#151515;
  padding:0px 20px 90px;
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
.tm-specs__inner{ max-width:1280px; margin:0 auto; }

.tm-specs__head{ text-align:center; margin-bottom:28px; }
.tm-specs__eyebrow{ margin:0 0 6px; color:#888b98; font-size:15px; }
.tm-specs__title{ margin:0; font-weight:900; letter-spacing:-.02em; font-size:clamp(26px,4.2vw,38px); }

/* grid */
.tm-specs__grid{
  list-style:none; margin:24px 0 0; padding:0;
  display:grid; gap:24px;
  grid-template-columns: repeat(4, minmax(0,1fr));
}

/* card */
.tm-specs__item{
  background:#fff;
  border:1px solid #eceef3;
  border-radius:16px;
  padding:22px 18px 20px;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.tm-specs__item:hover{
  border-color:#e4e6f0;
  box-shadow:0 8px 26px rgba(0,0,0,.06);
  transform: translateY(-2px);
}

/* icon circle */
.tm-specs__icon{
  width:108px; height:108px; border-radius:50%;
  border:2px solid #95584b;        /* 포인트 컬러(갈색톤) */
  display:grid; place-items:center;
  margin-bottom:14px;
}
.tm-specs__icon img{
  width:60px; height:60px; object-fit:contain; display:block; filter:grayscale(100%) contrast(0.9);
}

/* text */
.tm-specs__name{ margin:2px 0 8px; font-weight:900; font-size:18px; letter-spacing:-.01em; }
.tm-specs__desc{ margin:0; color:#6a6f7e; line-height:1.9; font-size:14px; }

/* bullets */
.tm-specs__bullets{
  margin:0; padding:0; list-style:none; color:#6a6f7e; line-height:1.9; font-size:14px;
}
.tm-specs__bullets li{ position:relative; padding-left:14px; text-align:left; }
.tm-specs__bullets li::before{
  content:"-"; position:absolute; left:0; color:#9aa0ae;
}

/* responsive */
@media (max-width: 1200px){
  .tm-specs__grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
  .tm-specs__desc{ margin:0; color:#6a6f7e; line-height:1.9; font-size:12px; }
  .tm-specs__bullets{margin:0; padding:0; list-style:none; color:#6a6f7e; line-height:1.9; font-size:12px;}
}
@media (max-width: 900px){
  .tm-specs__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap:18px; }
  .tm-specs__icon{ width:96px; height:96px; }
  .tm-specs__icon img{ width:54px; height:54px; }
}


/* 섹션 래퍼 */
.flx-about2{
  position: relative;
  background:#fff;
  text-align:center;
  padding: 0px 0px 0px; /* 상단 넉넉, 하단은 장비 영역이 담당 */
  font-family: system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  color:#111;
}

/* 텍스트 영역 */
.flx-about2__inner{
  max-width: 920px;
  margin: 0 auto;
}
.flx-about2__eyebrow{
  margin: 0 0 6px;
  font-size: clamp(14px, 1.6vw, 16px);
  color:#8f9099;
}
.flx-about2__title{
  margin: 0 0 12px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.4;
  font-size: clamp(26px, 4vw, 48px);
}
.flx-about2__subtitle{
  margin: 0 0 18px;
  font-weight: 800;
  font-size: clamp(16px, 2.2vw, 20px);
  color:#1a1a1a;
  line-height: 1.5;
}
.flx-about2__desc{
  font-family: "Noto Sans KR",system-ui,-apple-system,Segoe UI,Roboto,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  margin: 0 auto;
  max-width: 880px;
  color:#6b6c76;
  line-height: 1.6;
  font-size: clamp(12px, 1.9vw, 16px);
}

/* 장비 이미지 + 바닥 그라데이션 */
.flx-about2__device{
  position: relative;
  max-width: 1280px;          /* 장비 최대 폭 */
  margin: 36px auto 0;
  padding-top: 30px;
  padding-bottom: 40px;      /* 섹션 하단 여백 */
}
.flx-about2__device::before{
  /* 바닥에 깔리는 은은한 타원형 그라데이션(바닥 그림자/광택 느낌) */
  content:"";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(1280px, 92vw);
  height: min(360px, 34vw);
  background: radial-gradient(ellipse at center 80%,
              rgba(0,0,0,.12) 0%,
              rgba(0,0,0,.06) 28%,
              rgba(0,0,0,0) 70%);
  filter: blur(6px);
  opacity: .16;
  pointer-events: none;
  z-index: 0;
}
.flx-about2__device img{
  position: relative;
  z-index: 1;
  width: min(950px, 82vw);
  /*height: auto;*/
  margin: 50px auto;
 /* filter: drop-shadow(0 18px 40px rgba(0,0,0,.12));*/
}

/* 모바일 미세 조정 */
@media (max-width: 520px){
/* 섹션 래퍼 */
  .flx-about2{ padding: 0px 0 50px 0; }
  .flx-about2__device::before{
    height: 42vw;
    opacity: .18;
  }

.flx-about2__device {
    position: relative;
    max-width: 1280px;
    margin: 36px auto 0;
    padding-top: 50px;
    padding-bottom: 40px;
}

}



/* 접근성: 화면에만 숨기기 */
.visually-hidden{
  position:absolute !important; width:1px; height:1px; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* 그리드 */
.lesion-sec{ padding:150px 0px; width:100%;max-width:1280px;margin:0 auto; }
.lesion-grid{
  list-style:none; margin:0; padding:0;
  display:grid; gap:22px;
  grid-template-columns:repeat(4,minmax(0,1fr));   /* 데스크톱 4열 */
}

/* 카드 */
.lesion-card{}

.lesion-figure{
  position:relative;
  border-radius:40px;
  overflow:hidden;
  background:#eee;
  /* 일정 비율 유지(필요하면 값 조절) */
  aspect-ratio: 5 / 6;             /* 4:3 비슷한 비율 */
  box-shadow:0 4px 18px rgba(0,0,0,.06);
  transform:translateZ(0);
}
.lesion-figure img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .35s ease;
}

/* 오버레이(처음엔 보였다가 hover에서 사라짐) */
.lesion-overlay{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  text-align:center; padding:0 18px;
  color:#fff; font-weight:800; line-height:1.6;
  background:rgba(40,28,24,.66);  /* 어두운 브라운 계열 */
  transition:opacity .25s ease, visibility .25s ease;
  font-size:1.2em;
}

/* hover/focus 시 오버레이 사라지고 이미지 확대 약간 */
.lesion-figure:hover .lesion-overlay,
.lesion-figure:focus-within .lesion-overlay{
  opacity:0; visibility:hidden;
}
.lesion-figure:hover img,
.lesion-figure:focus-within img{ transform:scale(1.03); }

/* 반응형: 모바일은 2열(2×2) + 오버레이 기본 숨김(hover 없음) */
@media (max-width: 768px){
.lesion-sec{ padding:50px 0px; width:100%;max-width:1280px;margin:0 auto; }
  .lesion-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .lesion-overlay{ opacity:100; visibility:; }  /* 모바일엔 이미지만 보이게 */
}


/* Section */
.equip-sec{
  padding:56px 20px 84px;
  background:#fff; color:#151515;
  font-family:"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  font-size:1.2em;
}
.equip-inner{ max-width:1280px; margin:0 auto; }
.equip-eyebrow{ text-align:center; color:#8f93a3; margin:0 0 6px; font-size:18px; }
.equip-title{ text-align:center; margin:0 0 80px; font-weight:900; letter-spacing:-.02em; font-size:clamp(28px,4.6vw,44px); }

/* Grid */
.equip-grid{
  list-style:none; margin:0; padding:0;
  display:grid; gap:26px;
  grid-template-columns:repeat(2,minmax(0,1fr)); /* PC 2열 */
}

/* Card : 이미지 왼쪽 고정 */
.equip-card{
  background:#fff; border-radius:22px;
  border:1px solid #f0f1f5;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  padding:22px;
  display:grid; gap:22px;
  grid-template-columns:320px 1fr;  /* 왼쪽 이미지 고정 */
  align-items:center;
}

/* Media */
.equip-media{
  aspect-ratio:4/3;              /* 세로형 이미지에 맞춘 비율 */
  border-radius:16px; overflow:hidden;
  background:#f6f7fb;
  display:flex; align-items:center; justify-content:center;
}
.equip-media img{ width:100%; height:100%; object-fit:contain; display:block; }

/* Text */
.equip-name{ margin:0 0 8px; font-weight:900; font-size:20px; }
.equip-desc{ margin:0; color:#6a6f7e; line-height:1.8; }

/* Mobile */
@media (max-width:980px){
  .equip-grid{ grid-template-columns:1fr; gap:22px; }
  .equip-card{ grid-template-columns:1fr; padding:18px; }
  .equip-media{ aspect-ratio:2/1; }  /* 모바일에서 좀 더 눕게 */
  .equip-name{ font-size:18px; }
	.equip-desc{ margin:0; color:#6a6f7e; font-size:12px;line-height:1.8; }
}

/* 컴포넌트 스코프 (스타일 격리) */
  .toning-guide-wrapper {
    --tg-bg-color: #fff; /* 배경색 */
    --tg-brown: #a3765d; /* 메인 갈색 */
    --tg-brown-light: #bca08d;
    --tg-yellow: #ffeaa7; /* 노란색 포인트 */
    --tg-yellow-dark: #f0d585;
    --tg-text-brown: #594a2a;
    --tg-text-main: #333333;
    --tg-text-sub: #555555;
    --tg-white: #ffffff;
    --tg-font-family: 'Pretendard', 'Noto Sans KR', sans-serif;

    font-family: var(--tg-font-family);
    background-color: var(--tg-bg-color);
    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
    padding: 60px 20px;
    box-sizing: border-box;
    line-height: 1.6;
  }

  .toning-guide-wrapper *,
  .toning-guide-wrapper *::before,
  .toning-guide-wrapper *::after {
    box-sizing: border-box;
  }

  /* --- 1. 상단 카드 컨테이너 --- */
  .tg-cards-container {
    display: flex;
    justify-content: center;
    align-items: stretch; /* 높이 동일하게 */
    gap: 15px;
    margin-bottom: 40px;
  }

  /* 공통 카드 스타일 */
  .tg-card {
    border-radius: 16px;
    box-shadow: 4px 6px 15px rgba(163, 118, 93, 0.2);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
  }
  
  /* 좌우 단일 카드 (피코, 제네시스) */
  .tg-single-card {
    background-color: var(--tg-brown);
    color: var(--tg-white);
    font-weight: 700;
    font-size: 1.3rem;
    flex: 1; /* 너비 1 */
    padding: 0 20px;
    min-height: 120px; /* PC 최소 높이 */
    text-align: center;
    /* 미세한 그라데이션 효과 */
    background: linear-gradient(135deg, var(--tg-brown) 0%, var(--tg-brown-light) 100%);
  }

  /* 중앙 그룹 카드 (토닝) */
  .tg-group-card {
    background: linear-gradient(135deg, var(--tg-brown) 0%, var(--tg-brown-light) 100%);
    flex: 1.8; /* 좌우보다 넓게 */
    padding: 20px;
  }

  .tg-group-title {
    color: var(--tg-white);
    font-weight: 700;
    font-size: 1.2rem;
    margin-bottom: 15px;
    text-align: center;
  }

  /* 내부 버튼 래퍼 */
  .tg-sub-cards-wrap {
    display: flex;
    gap: 10px;
    width: 100%;
    justify-content: center;
  }

  /* 내부 노란 버튼 */
  .tg-sub-card {
    background-color: var(--tg-yellow);
    color: var(--tg-text-brown);
    font-weight: 700;
    font-size: 1.1rem;
    padding: 12px 0;
    border-radius: 8px;
    width: 100%;
    text-align: center;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
  }

  /* --- 2. 스펙트럼 화살표 영역 --- */
  .tg-spectrum-area {
    position: relative;
    margin: 0 auto 50px auto;
    width: 98%;
  }

  /* 양방향 화살표 */
  .tg-arrow-line {
    height: 6px;
    background-color: var(--tg-brown);
    width: 100%;
    position: relative;
    border-radius: 3px;
    margin-bottom: 25px;
  }

  /* 화살표 머리 */
  .tg-arrow-line::before,
  .tg-arrow-line::after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 0; 
    height: 0; 
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
  }

  .tg-arrow-line::before {
    left: -8px;
    border-right: 18px solid var(--tg-brown);
  }

  .tg-arrow-line::after {
    right: -8px;
    border-left: 18px solid var(--tg-brown);
  }

  /* 텍스트 배치 */
  .tg-effect-labels {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .tg-label-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .tg-label-group.left {
    text-align: left;
  }

  .tg-label-group.right {
    text-align: right;
  }

  .tg-label-text {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--tg-text-main);
    line-height: 1.2;
  }


  /* --- 3. 하단 설명 리스트 --- */
  .tg-desc-list {
    background-color: #fdf8f2;
    border: 1px solid #eee;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
  }

  .tg-desc-item {
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
  }
  
  .tg-desc-item:last-child {
    margin-bottom: 0;
  }

  .tg-bullet {
    width: 6px;
    height: 6px;
    background-color: var(--tg-brown);
    border-radius: 50%;
    margin-top: 11px; /* 텍스트 줄맞춤 */
    margin-right: 12px;
    flex-shrink: 0;
  }

  .tg-desc-content {
    font-size: 1rem;
    color: var(--tg-text-sub);
    word-break: keep-all;
	text-align:left;
  }

  .tg-desc-title {
    color: var(--tg-text-main);
    font-weight: 800;
    margin-right: 4px;
  }


  /* --- 반응형 (모바일 최적화) --- */
  @media (max-width: 768px) {
    .toning-guide-wrapper {
      padding: 40px 15px;
    }

    /* 1. 카드 레이아웃 변경 */
    .tg-cards-container {
      gap: 8px; /* 간격 좁힘 */
    }

    /* 2. 카드 폰트 및 패딩 축소 */
    .tg-single-card {
      font-size: 1rem; /* 폰트 줄임 */
      padding: 10px 5px; /* 패딩 최소화 */
      word-break: keep-all; /* 단어 끊기지 않게 */
    }

    /* 3. ★ 핵심: 모바일에서 중간 카드의 내부 구조 변경 ★ */
    /* 의도하신 대로 내부 항목을 세로(column)로 쌓습니다 */
    .tg-sub-cards-wrap {
      flex-direction: column; /* 세로 정렬 */
      gap: 8px;
    }

    .tg-group-card {
      padding: 15px 10px;
      flex: 1.2; /* 너비 비율 조정 */
    }

    .tg-group-title {
      font-size: 1rem;
      margin-bottom: 10px;
    }

    .tg-sub-card {
      font-size: 0.9rem;
      padding: 8px 0;
    }

    /* 4. 화살표 텍스트 크기 조절 */
    .tg-label-text {
      font-size: 0.9rem;
    }
    
    .tg-arrow-line {
        margin-bottom: 15px;
    }

    /* 5. 설명 텍스트 조절 */
    .tg-desc-list {
      padding: 20px;
    }
    .tg-desc-content {
      font-size: 0.9rem;
      line-height: 1.5;
    }
  }

  /* 초소형 화면 대응 (Fold 등) */
  @media (max-width: 360px) {
    .tg-cards-container {
        /* 너무 좁으면 어쩔 수 없이 줄바꿈 허용하거나 스크롤 */
        /* 여기서는 그대로 유지하되 폰트를 더 줄임 */
    }
    .tg-single-card {
        font-size: 0.9rem;
    }
  }