@charset "UTF-8";
.sub_tt01 {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #c0a040;
}

.sub_arrow {
  display: flex;
  justify-content: center;
  align-items: center;
  filter: none;
}

.con02 {
  padding-top: 8.7vw;
  padding-bottom: 3.5vw;
  background-image: url(/images/icon02_01.png);
  background-position: top center;
  background-size: 100% auto;
  background-repeat: no-repeat;
}
.con02 .head_title {
  font-size: calc(var(--px) * 46);
  font-weight: 500;
  color: #282828;
  line-height: 1.152;
}
.con02 .head_desc {
  margin-top: 2.8vw;
}
.con02 .con02_body {
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 11.2vw;
}
.con02 .con02_left {
  width: 50.3%;
  background-color: #555555;
  background-image: url(/images/icon02_02.png);
}
.con02 .vial_front {
  left: 41.2%;
  top: -19.6vw;
  width: calc(var(--px) * 390);
  aspect-ratio: 390/595;
  display: flex;
  justify-content: center;
  align-items: center;
}
.con02 .vial_tilt {
  left: 31.5%;
  top: 15.1vw;
  width: calc(var(--px) * 369);
  aspect-ratio: 369/597;
  display: flex;
  justify-content: center;
  align-items: center;
}
.con02 .con02_right {
  width: 26.2%;
  margin-left: 9.2%;
  margin-top: 2vw;
  background: transparent;
}
.con02 .right_eyebrow {
  color: #947e59;
  line-height: 1.115;
}
.con02 .right_title {
  margin-top: 1.4vw;
  color: #282828;
}
.con02 .right_desc {
  color: #282828;
}
.con02 .check_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 1.8vw;
  width: 100%;
  gap: 0.3vw;
}
.con02 .check_item {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(var(--px) * 407);
  aspect-ratio: 407/71;
}
.con02 .icon02_bigtxt {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 2.3vw;
  margin-left: 0;
  width: calc(var(--px) * 1014);
  aspect-ratio: 1014/164;
}

.gcon03_left {
  background-color: #130e0e;
  background-image: url(/images/icon03_01.png);
}

.gcon03_right {
  background-color: #f9efec;
  background-image: url(/images/icon03_03.png);
}

.gcon03_right .gcon03_title {
  color: #fff;
}

.gcon03_right .gcon03_desc {
  color: #fff;
}

.gcon03_left,
.gcon03_right {
  padding-top: 25.24vw;
}

.icon04 {
  background-color: #2B271A;
}

.c4_dis {
  color: #947E59;
}

.gcon04_card04_img_wrap {
  width: 55.1437%;
  aspect-ratio: 386/185;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.gcon04_card06 .gcon04_card_row02 {
  padding-top: 5.5vw;
}

.gcon04_card06 .gcon04_card_row01 {
  background-image: url(/images/icon04_02.png);
  background-size: cover;
}

.gcon04_card07 .gcon04_card_row01 {
  background-image: url(/images/icon04_09.png);
  background-size: cover;
}

.gcon04_card06_img_wrap {
  width: 55.1437%;
  aspect-ratio: 386/185;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-top: 2vw;
  margin-bottom: -1vw;
}

.gcon04_card06_graph {
  width: 19.1711%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  bottom: 14%;
}

.gcon04_card06_graph01 {
  left: 29%;
}

.gcon04_card06_graph02 {
  left: 69.5%;
}

.icon04_07 {
  width: 30.8291%;
  aspect-ratio: 119/119;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  left: 63%;
  top: -10%;
}

.icon04_03 {
  width: 15.5718%;
  aspect-ratio: 109/23;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.icon04_08 {
  width: 16.0003%;
  aspect-ratio: 112/23;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.icon05 {
  padding-top: 7vw;
  padding-bottom: 7vw;
}

.icon05_01 {
  width: 8.71401%;
  aspect-ratio: 166/18;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.icon05_tt01 {
  font-size: calc(var(--px) * 44);
  font-weight: 500;
  margin-top: 1vw;
}

.icon05_row_wrap {
  align-items: flex-start;
}

.icon05_row_wrap {
  align-items: flex-start;
  margin-top: 2vw;
  gap: 1.1vw;
}

.icon07_01 {
  width: 100.788%;
  aspect-ratio: 1920/377;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.icon07_tt_wrap {
  margin-top: 1%;
}

.icon07_tt01 {
  font-size: calc(var(--px) * 26);
  font-weight: 500;
  color: #B7AFA1;
  text-transform: uppercase;
}

.icon07_tt02 {
  font-size: calc(var(--px) * 20);
  font-weight: 500;
  color: #FCF7EE;
  margin-top: 1vw;
}

.icon10 .hcon10_slide_wrap {
  margin-top: 3vw;
}
.icon10 .hcon10_mid {
  background-color: #F9F6F0;
}
.icon10 .hcon10_slide_tt_after {
  background-color: #947E59;
}

.icon11 {
  background-color: #FCF7EE;
}

.gcon07_eyebrow {
  color: #947E59;
}

.gcon07_num {
  color: #947E59;
}

.gcon05_num {
  color: #947E59;
}

.icon13 {
  background-color: #2B271A;
}

@media (max-width: 599px) {
  /* ----- icon02 — 울트라콜 200이란? ----- */
  .con02 {
    padding-top: 14vw;
    padding-bottom: 12vw;
  }
  .con02 .con02_body {
    flex-direction: column;
    align-items: center;
    margin-top: 12vw;
  }
  .con02 .head_title {
    font-size: 5.5vw;
    line-height: 1.4;
  }
  .con02 .head_desc {
    margin-top: 3.5vw;
    font-size: 3.3vw;
    line-height: 1.65;
    box-sizing: border-box;
  }
  .con02 .con02_left {
    width: 100%;
    height: auto;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 2vw;
    padding: 8vw 0;
  }
  .con02 .vial_front,
  .con02 .vial_tilt {
    position: relative;
    left: auto;
    top: auto;
    width: 40vw;
  }
  .con02 .con02_right {
    width: 100%;
    align-items: center;
    text-align: center;
    margin-left: 0;
    margin-top: 10vw;
    padding: 0 6%;
  }
  .con02 .right_eyebrow {
    margin-top: 0;
    font-size: 3.5vw;
  }
  .con02 .right_title {
    margin-top: 3vw;
    font-size: 6vw;
    line-height: 1.3;
  }
  .con02 .right_desc {
    margin-top: 4vw;
    font-size: 3.3vw;
    line-height: 1.65;
    text-align: center;
  }
  .con02 .right_desc2 {
    margin-top: 3vw;
  }
  .con02 .check_list {
    align-items: center;
    margin-top: 6vw;
    gap: 2vw;
  }
  .con02 .check_item {
    width: 78vw;
    aspect-ratio: 407/71;
  }
  .con02 .icon02_bigtxt {
    width: 85.9%;
    aspect-ratio: 1014/164;
    margin-top: 7vw;
  }
  /* ----- icon03 (gcon03) — 모바일 패딩/배경 ----- */
  .gcon03_left,
  .gcon03_right {
    padding-top: 29vw;
    padding-bottom: 0vw;
    background-position: bottom;
  }
  /* ----- icon04 (gcon04) — Card 06/07 세로 스택 ----- */
  .gcon04_card06,
  .gcon04_card07 {
    flex-direction: column;
  }
  .gcon04_card06 .gcon04_card_row01,
  .gcon04_card07 .gcon04_card_row01 {
    aspect-ratio: 780/500;
    background-size: cover;
  }
  .gcon04_card06 .gcon04_card_row02,
  .gcon04_card07 .gcon04_card_row02 {
    padding: 10vw 0%;
    align-items: center;
    text-align: center;
  }
  .icon04_03,
  .icon04_08 {
    width: 16vw;
  }
  .gcon04_card06_img_wrap {
    width: 72vw;
    aspect-ratio: 386/185;
    margin-top: 6vw;
    margin-bottom: 4vw;
  }
  /* ----- icon05 — 울트라콜 200 시술원리 ----- */
  .icon05 {
    padding-top: 14vw;
    padding-bottom: 14vw;
  }
  .icon05_01 {
    width: 28vw;
    aspect-ratio: 166/18;
  }
  .icon05_tt01 {
    font-size: 5.5vw;
    line-height: 1.3;
    margin-top: 3vw;
    text-align: center;
  }
  .icon05_row_wrap {
    flex-direction: column;
    align-items: center;
    margin-top: 8vw;
    gap: 6vw;
  }
  /* icon05_row 는 PC CSS 룰이 없어 런타임 auto-css 가 width 주입 → specificity 로 우선순위 확보 */
  .icon05_row_wrap .icon05_row {
    width: 80vw;
  }
  /* ----- icon07 — 콜라겐 부스터 띠 배너 ----- */
  .icon07 {
    background: #14110c;
    padding: 16vw 0;
  }
  .icon07_01 {
    display: none;
  }
  .icon07_tt_wrap {
    position: relative;
    margin-top: 0;
    text-align: center;
  }
  .icon07_tt01 {
    font-size: 4vw;
  }
  .icon07_tt02 {
    font-size: 3.3vw;
    line-height: 1.75;
    margin-top: 4vw;
    padding: 0 0%;
    box-sizing: border-box;
  }
  /* ----- icon08 (gcon05) — 추천대상 1~6 순서 정렬 + 5/6번 보강 ----- */
  .gcon05_row {
    display: contents;
  }
  .gcon05_item_l {
    order: 1;
  }
  .gcon05_item_r {
    order: 2;
  }
}