.acne {
    position: relative;
    min-height: 900rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: linear-gradient(to bottom, #f8f6fa, #846794);
}

.ac-sb {
    position: absolute;
    top: 15%; right: -10%;
    height: 60%;
    opacity: .2;
    z-index: 1;
}

.model {
    position: absolute;
    bottom: 0; right: 0;
    height: 100%;
    object-fit: cover;
    z-index: 2;
}

.sub-promotion-wrapper {
    width: 80%;
}

.sub-p-text {
    justify-content: flex-start;
    align-items: center;
    margin-left: 0;
    margin-right: auto;
    margin-bottom: 50rem;
}

.sub-p-text p {
    color: #fff;
}

.sub-p-text h5 {
    color: #fff;
    font-size: 80rem;
    font-family: 'Pretendard Variable';
    margin-top: 20rem;
}

.sub-desc {
    color:#fff;
    font-size: 20rem;
    line-height: 1.5;
    border: 1px solid rgba(255, 255, 255, .2);
    background-color: rgba(255, 255, 255, .1);
    letter-spacing: -1.5rem;
}

.sub-desc::before,
.sub-desc::after {
    filter: brightness(0) invert(1);
}

.sub-desc br {
    display: none;
}


.acn-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 160rem;
}

.acn-title h6 {
    color: var(--main-color);
    font-size: 14rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2rem;
    margin-bottom: 40rem;
}

.acn-title h5 {
    color: #333;
    font-size: 50rem;
    font-weight: unset;
    line-height: 1.2;
    font-family: 'Noto Serif KR';
}
.acn-title h5 span {
    color: var(--main-color);
    font-family: 'Noto Serif KR';
}

.acn-title p {
    color: #333;
    font-size: 18rem;
    font-weight: 300;
    line-height: 1.5;
    margin-top: 40rem;
}

.acn-title.dark h6,
.acn-title.dark h5,
.acn-title.dark h5 span,
.acn-title.dark p {
    color: #fff;
}


.acn1 {
    position: relative;
    background-color: #f5f2fa;
}

.a1-flow-wrapper {
    position: absolute;
    bottom: 30rem;
}

.a1-flow {
    color: var(--purple-light);
}

.acn1-1 {
    width: 35%;
    border-radius: 120rem 0 120rem 0;
    z-index: 2;
}


.acn2 .acn-wrapper {
    justify-content: space-between;
}

.acn2-box-wrapper {
    width: 50%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.acn2-box {
    padding: 50rem;
    border: 1px solid var(--purple-light);
}
.acn2-box:nth-child(1),
.acn2-box:nth-child(2) {
    border-bottom: none;
}
.acn2-box:nth-child(1),
.acn2-box:nth-child(3) {
    border-right: none;
}

.acn2-box-icon {
    width: 50rem;
    height: 50rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 12rem;
    background-color: #f5f2fa;
    margin-bottom: 20rem;
}

.acn2-box-icon i {
    color: var(--purple-mid);
    font-size: 20rem;
}

.acn2-box-text h6 {
    color: #333;
    font-size: 20rem;
    font-weight: 600;
}

.acn2-box-text p {
    color: #555;
    font-size: 16rem;
    line-height: 1.5;
    font-weight: 300;
    margin-top: 20rem;
}


.acn3 {
    background-color: #f5f2fa;
}

.acn3 .acn-title {
    width: 100%;
    margin-bottom: 70rem;
}

.acn3-box-wrapper {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30rem;
}

.acn3-box {
    padding: 40rem;
    background-color: #fff;
}

.acn3-box span {
    color: var(--purple-mid);
    display: block;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 20rem;
    letter-spacing: 1rem;
}

.acn3-box-text h6 {
    color: #333;
    font-size: 22rem;
    font-weight: 500;
}

.acn3-box-text p {
    color: #555;
    font-size: 16rem;
    line-height: 1.5;
    font-weight: 300;
    margin-top: 30rem;
}


.acn4 {
    background-color: var(--main-color);
    background-image: linear-gradient(to top, #846794, var(--main-color));
}

.acn4 .acn-title {
    width: 40%;
}

.acn4-box-wrapper {
    width: 50%;
}

.acn4-box {
    color: #fff;
    padding: 50rem 0;
    display: flex;
    gap: 50rem;
    border-bottom: 1px solid rgba(255, 255, 255, .2);
}
.acn4-box:last-child {
    border-bottom: none;
}

.acn4-box .acn3-box-text h6 {
    color: #fff;
    margin-top: -5px;
}
.acn4-box .acn3-box-text p {
    color: #ffffffa8;
}

.acn4-box span {
    font-size: 14px;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 1rem;
    white-space: nowrap;
}

.eqp .ss-text img {
    height: 30rem;
    margin-bottom: 10px;
}

.eqp .ss-text h5 {
    display: flex;
    align-items: flex-end;
    gap: 20rem;
}

.eqp.chamber {
    background-image: linear-gradient(to bottom, #fff, #f5f5f5)
}


/*==================================================*/
@media (min-width: 2250px) {
    .sub-promotion-wrapper {
        width: 60%;
    }
}


@media (max-width: 1650px) {
    .acne {
        min-height: unset;
        height: 800rem;
    }

    .model {
        right: -10%;
    }
    
    .sub-promotion-wrapper {
        width: 90%;
    }

    .sub-desc {
        width: 70%;
    }
}


@media (max-width: 991px) {
    .acne {
        height: 100vh;
        align-items: flex-end;
    }
    .acne::before {
        content: '';
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 60%;
        background-image: linear-gradient(to top, #846794, transparent);
        z-index: 3;
    }
    
    .model {
        right: unset;
        left: 50%;
        transform: translate(-50%, 0);
    }
    
    .sub-p-text {
        width: 100%;
        margin-top: auto;
        margin-bottom: 15%;
        z-index: 4;
    }
    
    .sub-desc {
        width: 90%;
    }
    
    .sub-desc br {
        display: block;
    }


    .acn-wrapper {
        flex-direction: column;
        align-items: flex-end;
        gap: 60rem;
    }

    .acn-title {
        width: 100%;
    }

    .a1-flow-wrapper {
        bottom: 0;
    }
    
    .acn1-1 {
        width: 70%;
    }

    .acn2-box-wrapper {
        width: 100%;
    }

    .acn3-box-wrapper {
        grid-template-columns: repeat(1, 1fr);
    }

    .acn4 .acn-wrapper {
        gap: 30rem;
    }
    
    .acn4 .acn-title {
        width: 100%;
    }

    .acn4-box-wrapper {
        width: 100%;
    }
    
    .a3Swiper .swiper-slide .ss-text {
        height: 450rem;
    }

    .eqp.scar .a3Swiper .swiper-slide .ss-text {
        height: auto;
    }
    
    .eqp.chamber {
        overflow: hidden;
    }
    
    .eqp.chamber .acn-title {
        flex-direction: column;
        gap: 30px !important;
        margin-top: 20rem;
    }

    .eqp.chamber img {
        transform: scale(1.15);
    }
}


@media (max-width: 550px) {
    .sub-p-text p {
        font-size: 24rem;
    }
    
    .sub-p-text h5 {
        font-size: 90rem;
    }

    .sub-desc {
        padding: 30rem 50rem;
        font-size: 24rem;
    }

    .sub-desc::before,
    .sub-desc::after {
        width: 70rem;
        height: 70rem;
    }

    .acn-title h6 {
        font-size: 20rem;
    }

    .acn-title h5 {
        font-size: 60rem;
    }

    .acn-title p {
        font-size: 24rem;
    }
    .acn-title p br {
        display: none;
    }

    .acn2-box-icon {
        width: 64rem;
        height: 64rem;
    }
    
    .acn2-box-icon i {
        font-size: 28rem;
    }

    .acn2-box-text h6,
    .acn3-box-text h6 {
        font-size: 32rem;
    }

    .acn2-box-text p,
    .acn3-box-text p {
        font-size: 24rem;
    }

    .acn2-box-text p br {
        display: none;
    }

    .acn3-box {
        padding: 60rem;
    }
}