@charset "utf-8";

/*
 * 2026-09-17 PPT 수정요청 최종 보정
 * 글꼴은 이 파일에서 지정하지 않습니다.
 * body 및 기존 공통 클래스(.txt0/.txt1/.txt2/.f46/.f22/.prod_box 등)의 서체 규칙을 그대로 사용합니다.
 */

.pc-only {display:block;}

/* =========================================================
   울쎄라피 프라임
   ========================================================= */
.ulthera-20260917 #sect1 .ulthera-hero-bg {
    background-image:url('/media/ulthera_prime_background.jpg');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
}
.ulthera-20260917 #sect1 .visual_swiper .txt_box {
    width:52%;
}
.ulthera-20260917 #sect2 .video_box iframe {
    border:0;
}
.ulthera-20260917 #sect2 .f46 .navy {
    color:#2f2f40;
}
.ulthera-20260917 #sect3 .ulthera-feature-section {
    display:flex;
    align-items:center;
    min-height:calc(var(--vh, 1vh) * 100);
    padding:5rem 0;
    background:#fff;
}
.ulthera-20260917 #sect3 .ulthera-feature-inner {
    width:100%;
    max-width:1500px;
    margin:0 auto;
    padding:0 6%;
}
.ulthera-20260917 #sect3 .ulthera-feature-head {
    margin-bottom:4rem;
    text-align:center;
}
.ulthera-20260917 #sect3 .ulthera-feature-head .f46 {
    margin:0;
}
.ulthera-20260917 #sect3 .ulthera-feature-body {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5rem;
}
.ulthera-20260917 #sect3 .ulthera-feature-device {
    flex:0 0 52%;
    min-height:0;
    padding:0;
    display:flex;
    align-items:center;
    justify-content:center;
}
.ulthera-20260917 #sect3 .ulthera-feature-device img {
    display:block;
    width:auto;
    max-width:100%;
    max-height:52vh;
    margin:0 auto;
}
.ulthera-20260917 #sect3 .ulthera-feature-list {
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    gap:2.8rem;
    padding:0;
}
.ulthera-20260917 #sect3 .feature-item {
    display:flex;
    align-items:flex-start;
    gap:2.2rem;
}
.ulthera-20260917 #sect3 .feature-icon {
    flex:0 0 8.5rem;
    width:8.5rem;
}
.ulthera-20260917 #sect3 .feature-icon img {
    width:100%;
    height:auto;
}
.ulthera-20260917 #sect3 .feature-title {
    margin:0 0 .8rem;
    color:#f1b756;
    font-size:3.4rem;
    line-height:1.3;
    white-space:nowrap;
}
.ulthera-20260917 #sect3 .feature-desc,
.ulthera-20260917 #sect3 .feature-desc span {
    color:#313131;
}

/* =========================================================
   세르프
   ========================================================= */
.xerf-20260917 #sect1 .xerf-hero-swiper,
.xerf-20260917 #sect1 .xerf-hero-bg {
    background:#efcfce;
}
.xerf-20260917 #sect1 .visual_swiper .txt_box {
    width:46%;
    color:#111;
}
.xerf-20260917 #sect1 .visual_swiper .txt0,
.xerf-20260917 #sect1 .visual_swiper .txt1,
.xerf-20260917 #sect1 .visual_swiper .txt2 {
    color:#111;
}
.xerf-20260917 #sect1 .hero-device {
    position:absolute;
    z-index:1;
    right:5%;
    bottom:0;
    width:50%;
    height:96%;
    max-width:none;
    object-fit:contain;
    object-position:center bottom;
}
.xerf-20260917 #sect2 .video_box video {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    background:#000;
}
.xerf-20260917 #sect3 .design-section {
    position:relative;
    width:100%;
    height:calc(var(--vh, 1vh) * 100);
    min-height:720px;
    padding:0 5%;
    background:#fff;
    overflow:hidden;
}
.xerf-20260917 #sect3 .design-title {
    position:absolute;
    z-index:3;
    top:6.5%;
    left:50%;
    width:100%;
    margin:0;
    transform:translateX(-50%);
    text-align:center;
}
.xerf-20260917 #sect3 .design-section .device {
    position:absolute;
    z-index:1;
    left:50%;
    top:55%;
    width:36%;
    height:58%;
    transform:translate(-50%, -50%);
    object-fit:contain;
}
.xerf-20260917 #sect3 .design-section .info {
    position:absolute;
    z-index:2;
    width:31%;
    margin:0;
    color:#777;
    text-align:left;
    word-break:keep-all;
}
.xerf-20260917 #sect3 .design-section .info strong {
    display:block;
    margin-bottom:1.2rem;
    color:#313131;
}
.xerf-20260917 #sect3 .design-section .lt,
.xerf-20260917 #sect3 .design-section .rt {
    top:34%;
}
.xerf-20260917 #sect3 .design-section .lb,
.xerf-20260917 #sect3 .design-section .rb {
    top:64%;
}
.xerf-20260917 #sect3 .design-section .lt,
.xerf-20260917 #sect3 .design-section .lb {
    left:4%;
}
.xerf-20260917 #sect3 .design-section .rt,
.xerf-20260917 #sect3 .design-section .rb {
    right:4%;
}
.xerf-20260917 #sect4 .prod_box > div {
    height:auto;
    min-height:47rem;
}
.xerf-20260917 #sect4 .prod_img {
    padding:0;
    overflow:hidden;
}
.xerf-20260917 #sect4 .prod_img .img {
    width:100%;
    height:auto;
    min-height:0;
    margin:0;
    overflow:hidden;
}
.xerf-20260917 #sect4 .prod_img .img img {
    display:block;
    width:100%;
    height:auto;
    max-width:none;
    max-height:none;
    object-fit:contain;
}
.xerf-20260917 #sect4 .prod_info {
    padding-left:11rem;
    padding-right:5rem;
}
.xerf-20260917 .xerf-pink {
    color:#b86f78;
}
.xerf-20260917 .process_wp .pro_li:after {
    background:#b86f78;
}
.xerf-20260917 .belief_wp .detail dl {
    border-top-color:#b86f78;
}
.xerf-20260917 #sect6 .belief_wp {
    background:url(../image/sub/bg_belief1.jpg) no-repeat 50% 50% / cover;
}
.xerf-20260917 #sect6 .belief_wp .detail dl {
    border-top-color:#d9ada0;
}

/* =========================================================
   포텐자 다이아
   ========================================================= */
.potenza-20260917 #sect1 .potenza-hero-swiper,
.potenza-20260917 #sect1 .potenza-hero-bg {
    background:#53b8ba;
}
.potenza-20260917 #sect1 .visual_swiper .txt_box {
    width:50%;
    color:#fff;
}
.potenza-20260917 #sect1 .visual_swiper .txt0,
.potenza-20260917 #sect1 .visual_swiper .txt1,
.potenza-20260917 #sect1 .visual_swiper .txt2 {
    color:#fff;
}
.potenza-20260917 #sect1 .potenza-device {
    position:absolute;
    z-index:1;
    right:7%;
    bottom:0;
    width:49%;
    height:94%;
    max-width:none;
    object-fit:contain;
    object-position:center bottom;
}
.potenza-20260917 #sect3 {
    background:#fff;
}
.potenza-principle-inner,
.tattoo-principle-inner {
    width:min(1220px, 88vw);
    margin:0 auto;
}
.potenza-principle-heading,
.tattoo-principle-heading {
    margin-bottom:5rem;
    text-align:center;
}
.potenza-principle-heading .f46,
.tattoo-principle-heading .f46 {
    margin:0 0 2rem;
}
.potenza-principle-heading .f22,
.tattoo-principle-heading .f22 {
    margin:0;
}
.potenza-principle-grid {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:3rem;
}
.potenza-principle-card {
    padding:3.5rem 2.5rem;
    text-align:center;
    background:#f6fbfb;
}
.potenza-principle-card img {
    display:block;
    width:min(100%, 24rem);
    margin:0 auto 2.5rem;
}
.potenza-principle-title {
    margin:0 0 1.2rem;
    color:#52b5af;
}
.potenza-principle-card > p:last-child {
    margin:0;
}

/* =========================================================
   문신 제거
   ========================================================= */
.tattoo-20260917 #sect1 .tattoo-hero-bg {
    background-image:linear-gradient(rgba(0,0,0,.16), rgba(0,0,0,.16)), url('/media/tattoo_hero_20260917.jpg');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}
.tattoo-20260917 #sect2 .tattoo-treatment-image img {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
}
.tattoo-20260917 #sect2 .tattoo-heading-line {
    display:block;
}
.tattoo-20260917 #sect3 .prod_img .img {
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}
.tattoo-20260917 #sect3 .tattoo-device-image {
    display:block;
    width:auto;
    height:auto;
    max-width:76%;
    max-height:34rem;
    margin:0 auto;
    object-fit:contain;
}
.tattoo-20260917 #sect4 .tattoo-equipment {
    padding-bottom:9rem;
}
.tattoo-20260917 #sect4 .equipment_swiper .swiper-slide > div {
    height:34rem;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}
.tattoo-20260917 #sect4 .equipment_swiper .swiper-slide img {
    display:block;
    width:auto;
    height:auto;
    max-width:82%;
    max-height:30rem;
    margin:0 auto;
    object-fit:contain;
}
.tattoo-20260917 #sect4 .tattoo-starwalker-image {
    width:auto;
    height:auto;
    max-width:82%;
    max-height:30rem;
    object-fit:contain;
}
.tattoo-principle-grid {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:2.8rem;
}
.tattoo-principle-grid article {
    text-align:center;
}
.tattoo-principle-grid article img {
    display:block;
    width:100%;
    aspect-ratio:375 / 275;
    margin-bottom:2rem;
    object-fit:cover;
}
.tattoo-principle-grid article p {
    margin:0;
    word-break:keep-all;
}
.tattoo-20260917 #sect6 .tattoo-recommend-image {
    padding:0;
    overflow:hidden;
}
.tattoo-20260917 #sect6 .tattoo-recommend-image .img {
    width:100%;
    height:100%;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}
.tattoo-20260917 #sect6 .tattoo-recommend-image img {
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:center center;
}
.tattoo-20260917 #sect6 .tattoo-recommend-desc {
    margin-top:3rem;
}

/* =========================================================
   스킨부스터
   ========================================================= */
.skinbooster-20260917 #sect2 .skinbooster-video {
    position:absolute;
    inset:0;
    background:#000;
}
.skinbooster-20260917 #sect2 .skinbooster-video video {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
}
.skinbooster-20260917 #sect1 .bg16 {
    background-image:url('/media/skinbooster_background.jpg');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
}

/* 엑소좀과 리투오는 쥬베룩과 같은 제품 이미지 비율로 보이도록 크기와 정렬을 통일합니다. */
.skinbooster-20260917 #sect3 .skinbooster-product-reference {
    height:20rem;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:visible;
}
.skinbooster-20260917 #sect3 .skinbooster-product-reference img {
    display:block;
    width:auto;
    height:auto;
    max-width:70%;
    max-height:18rem;
    object-fit:contain;
    margin:0 auto;
}

/* =========================================================
   시술전후
   ========================================================= */
.before-after-v29 #sect1 .before-after-hero-bg-v2 {
    background-image:url(../image/sub/bg_svisual1.jpg);
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-size:cover;
}

@media all and (max-width:1600px) {
    .xerf-20260917 #sect3 .design-section .info {
    }
    .xerf-20260917 #sect3 .design-section .info strong {
    }
}

@media all and (max-width:1200px) {
    .ulthera-20260917 #sect3 .ulthera-feature-body {
        gap:4rem;
    }
    .ulthera-20260917 #sect3 .ulthera-feature-device {
        flex-basis:50%;
    }
    .ulthera-20260917 #sect3 .feature-title {
        font-size:2.8rem;
    }
    .xerf-20260917 #sect1 .hero-device {
        right:2%;
        width:54%;
    }
    .xerf-20260917 #sect3 .design-section .info {
        width:32%;
    }
    .xerf-20260917 #sect4 .prod_info {
        padding-left:8rem;
        padding-right:4rem;
    }
    .potenza-20260917 #sect1 .potenza-device {
        right:4%;
        width:53%;
    }
}

@media all and (max-width:900px) {
    .pc-only {display:none;}
    .potenza-principle-grid,
    .tattoo-principle-grid {
        grid-template-columns:1fr;
        gap:2rem;
    }
}

@media all and (max-width:768px) {
    .ulthera-20260917 #sect1 .visual_swiper .txt_box,
    .xerf-20260917 #sect1 .visual_swiper .txt_box,
    .potenza-20260917 #sect1 .visual_swiper .txt_box {
        width:auto;
    }
    .ulthera-20260917 #sect3 .ulthera-feature-section {
        min-height:0;
        padding:5rem 0;
    }
    .ulthera-20260917 #sect3 .ulthera-feature-body {
        display:block;
    }
    .ulthera-20260917 #sect3 .ulthera-feature-device {
        margin-bottom:3rem;
    }
    .ulthera-20260917 #sect3 .ulthera-feature-device img {
        width:78%;
        max-height:none;
    }
    .ulthera-20260917 #sect3 .feature-icon {
        flex-basis:5.8rem;
        width:5.8rem;
    }
    .ulthera-20260917 #sect3 .feature-title {
        font-size:2rem;
        white-space:normal;
    }
    .ulthera-20260917 #sect3 .feature-desc,
    .ulthera-20260917 #sect3 .feature-desc span {
    }

    .xerf-20260917 #sect1 .hero-device {
        right:-16%;
        bottom:0;
        width:78%;
        height:66%;
    }
    .xerf-20260917 #sect3 .design-section {
        position:relative;
        height:auto;
        min-height:0;
        padding:5rem 6% 11rem;
        display:flex;
        flex-direction:column;
    }
    .xerf-20260917 #sect3 .design-title,
    .xerf-20260917 #sect3 .design-section .device,
    .xerf-20260917 #sect3 .design-section .info {
        position:static;
        width:100%;
        transform:none;
    }
    .xerf-20260917 #sect3 .design-title {
        order:1;
        margin-bottom:3rem;
    }
    .xerf-20260917 #sect3 .design-section .lt {order:2;}
    .xerf-20260917 #sect3 .design-section .rt {order:3;}
    .xerf-20260917 #sect3 .design-section .device {
        order:4;
        width:76%;
        height:30rem;
        margin:2rem auto 3rem;
    }
    .xerf-20260917 #sect3 .design-section .lb {order:5;}
    .xerf-20260917 #sect3 .design-section .rb {order:6;}
    .xerf-20260917 #sect3 .design-section .info {
        margin:0 0 2.3rem;
    }
    .xerf-20260917 #sect3 .design-section .info strong {
    }
    .xerf-20260917 #sect4 .prod_img {
        padding:0;
    }
    .xerf-20260917 #sect4 .prod_box > div {
        min-height:0;
    }
    .xerf-20260917 #sect4 .prod_img .img {
        min-height:0;
    }
    .xerf-20260917 #sect4 .prod_info {
        padding:3rem 2rem;
    }

    .potenza-20260917 #sect1 .potenza-device {
        right:-18%;
        bottom:0;
        width:82%;
        height:68%;
    }
    .potenza-principle-inner,
    .tattoo-principle-inner {
        width:90%;
        padding:6rem 0;
    }
    .potenza-principle-heading,
    .tattoo-principle-heading {
        margin-bottom:3rem;
    }
    .potenza-principle-title {
    }
    .potenza-principle-card > p:last-child,
    .tattoo-principle-grid article p {
    }

    .tattoo-20260917 #sect3 .tattoo-device-image {
        max-width:64%;
        max-height:24rem;
    }
    .tattoo-20260917 #sect4 .tattoo-equipment {
        padding-bottom:11rem;
    }
    .tattoo-20260917 #sect4 .equipment_swiper .swiper-slide > div {
        height:24rem;
    }
    .tattoo-20260917 #sect4 .equipment_swiper .swiper-slide img,
    .tattoo-20260917 #sect4 .tattoo-starwalker-image {
        max-height:21rem;
    }
    .tattoo-20260917 #sect6 .tattoo-recommend-desc {
        margin-top:2rem;
    }
    .skinbooster-20260917 #sect3 .skinbooster-product-reference {
        height:15rem;
    }
    .skinbooster-20260917 #sect3 .skinbooster-product-reference img {
        max-width:72%;
        max-height:13rem;
    }
}


/* =========================================================
   2026-09-18 모바일 줄바꿈 최종 보정
   공통 content.css가 모바일 video_wp 내부의 br을 숨기므로
   해당 페이지 제목에 한해서 명시적으로 줄 구성을 복원합니다.
   ========================================================= */
.ulthera-20260917 #sect2 .ulthera-video-title-line {
    display:block;
}
.xerf-20260917 #sect2 .xerf-video-title-mo {
    display:none;
}

@media all and (max-width:768px) {
    .ulthera-20260917 #sect2 .video_wp .txt_box {
        text-align:left;
    }
    .ulthera-20260917 #sect2 .ulthera-video-title {
        text-align:left;
    }
    .ulthera-20260917 #sect2 .ulthera-video-title-line {
        display:block;
        white-space:nowrap;
    }
    .ulthera-20260917 #sect2 .ulthera-video-title .navy {
        margin-top:.35rem;
    }
    .ulthera-20260917 #sect3 .feature-item,
    .ulthera-20260917 #sect3 .feature-copy,
    .ulthera-20260917 #sect3 .feature-title,
    .ulthera-20260917 #sect3 .feature-desc,
    .ulthera-20260917 #sect3 .feature-desc span {
        text-align:left;
    }
    .ulthera-20260917 #sect3 .feature-copy {
        flex:1 1 auto;
        min-width:0;
    }

    .xerf-20260917 #sect2 .video_wp .txt_box {
        text-align:left;
    }
    .xerf-20260917 #sect2 .xerf-video-title-pc {
        display:none;
    }
    .xerf-20260917 #sect2 .xerf-video-title-mo {
        display:block;
    }
    .xerf-20260917 #sect2 .xerf-video-title-mo br {
        display:block !important;
    }
}


/* =========================================================
   2026-09-18 모바일 영상 제목 줄바꿈 확정
   기존 페이지 폰트는 그대로 사용하고 모바일 줄 구성만 고정합니다.
   ========================================================= */
.ulthera-20260917 #sect2 .ulthera-video-title-mo {
    display:none;
}
.xerf-20260917 #sect2 .xerf-video-title-mo-line {
    display:block;
}

@media all and (max-width:768px) {
    .ulthera-20260917 #sect2 .ulthera-video-title-pc {
        display:none !important;
    }
    .ulthera-20260917 #sect2 .ulthera-video-title-mo {
        display:block !important;
    }
    .ulthera-20260917 #sect2 .ulthera-video-title-mo-line {
        display:block !important;
        white-space:nowrap;
    }
    .ulthera-20260917 #sect2 .ulthera-video-title-mo-line.navy {
        margin-top:.35rem;
    }

    .xerf-20260917 #sect2 .xerf-video-title-mo-line {
        display:block !important;
        white-space:nowrap;
    }
}
