.secret1__challenge__step {
    padding-top: 3vw;
}

@media (min-width:768px) {

    .secret1__challenge__step {
        position: relative;
        width: 100vw;
        margin: 0 auto;
        --lead: 15vw;
        --item-w: 28.36vw;
        --arrow-w: 4vw;
        --gap: 2.5vw;
    }

    .secret1__challenge__step__list__detail {
        margin-right: var(--gap);
    }

    .secret1__challenge__step__list__detail:last-child {
        margin-right: 0;
    }

    .secret1__challenge__step__wrapper {
        overflow: hidden
    }

    .secret1__challenge__step__list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        align-items: flex-start;
        padding-left: var(--lead);
        transition: transform .4s ease;
        will-change: transform;
    }

    .secret1__challenge__step__list__detail {
        flex: 0 0 auto;
        width: var(--item-w);
        margin-right: var(--gap);
    }

    .secret1__challenge__step__list__detail img {
        display: block;
        width: 100%;
        height: auto
    }

    .secret1__challenge__step__nav {
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 5;
    }

    .secret1__challenge__step__nav button {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: var(--arrow-w);
        height: var(--arrow-w);
        border: 0;
        border-radius: 50%;
        background: transparent;
        padding: 0;
        pointer-events: auto;
        cursor: pointer;
        left: calc(var(--lead) + var(--item-w) + (var(--gap) / 2) - (var(--arrow-w) / 2));
    }

    .secret1__challenge__step__nav button img {
        display: block;
        width: 100%;
        height: auto;
        transition: transform .2s;
    }

    .secret1__challenge__step[data-index="0"] .secret1__challenge__step__list {
        transform: translateX(0);
    }

    .secret1__challenge__step[data-index="1"] .secret1__challenge__step__list {
        transform: translateX(calc(-1 * (var(--item-w) + var(--gap))));
    }

    .secret1__challenge__step[data-index="2"] .secret1__challenge__step__list {
        transform: translateX(calc(-2 * (var(--item-w) + var(--gap))));
    }

    .secret1__challenge__step .secret1__challenge__step__nav img {
        transform: none;
    }

    .secret1__challenge__step[data-dir="-1"] .secret1__challenge__step__nav img {
        transform: scaleX(-1);
    }

    .secret1__challenge__step__list__detail.is-spacer {
        visibility: hidden;
    }
}

@media (max-width:767px) {

    .secret1__challenge__step__nav {
        display: none;
    }

    .secret1__challenge__step__list {
        display: block;
        padding-left: 0;
        margin: 0 auto;
        list-style: none;
    }

    .secret1__challenge__step__list__detail {
        width: 100%;
        margin: 0 auto 1.5vw;
    }

    .secret1__challenge__step__list__detail:last-child {
        margin-bottom: 0;
    }

    .secret1__challenge__step__list__detail img {
        display: block;
        max-width: 87.96vw;
        width: 100%;
        height: auto;
        margin: 0 auto;
    }
}