@charset "utf-8";

.txt-ani {
    transition: clip-path 1s, transform 1s, opacity 1s;
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
    transform: translate3d(0,1em,0) skewY(5deg);
    display: inline-block;
    opacity: 0;
}

.jhs-appear.jhs-appear-active > .txt-ani {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    transform: translate3d(0,0,0) skewY(0deg);
    opacity: 1;
    /* margin-bottom: 1em; */
}

.txt-ani p {
    display: inline-block;
    transition: transform 1s;
    transform: translate3d(0,3vw,0) skewY(15deg);
    transform-origin: left;
}

.jhs-appear.jhs-appear-active > .txt-ani p {
    transform: translateZ(0) skewY(0deg);
}


/* jhs-appear 라이브러리 시작 */
.jhs-appear {
    margin-top: 10px;
}

.jhs-appear-slide-up {
    opacity: 0;
    transition: opacity 1s, transform 0.5s;
    transform: translateY(100%);
}

.jhs-appear-slide-up.jhs-appear-active {
    opacity: 1;
    transform: translateY(0%);
}

.jhs-appear-slide-right {
    opacity: 0;
    transition: opacity 1s, transform 0.5s;
    transform: translateX(-100%);
}

.jhs-appear-slide-right.jhs-appear-active {
    opacity: 1;
    transform: translateX(0%);
}
/* jhs-appear 라이브러리 끝 */