@media screen and (min-width: 768px) {
    body[data-page-name=top] .l-main {
        padding-top: 0;
    }
}
body[data-page-name=top] .l-header-bar-product {
    display: none;
}

@media screen and (max-width: 767px) {
    #top .l-wrapper {
        padding-top: 0;
    }
}

/* mv */
section.v3-top-mv {
    background-image: url(https://gigaplus.makeshop.jp/mysmoothskin/v3/assets/images/top/top-mv-bg.webp);
    background-size: 100%;
    height: var(--535px);
    .v3-top-mv__inner {
        padding: 0 var(--15px);
    }
    .v3-top-mv__catch-primary {
        font-size: var(--30px);
        font-weight: 700;
        line-height: var(--40px);
        letter-spacing: 0.02em;
        margin-top: var(--30px);
        margin-bottom: var(--19px);
    }
    .v3-top-mv__catch-secondary {
        font-size: var(--18px);
        font-weight: 700;
        line-height: var(--25px);
        letter-spacing: 0.04em;
        margin-bottom: var(--4px);
    }
    .v3-top-mv__catch-note {
        font-size: var(--12px);
        line-height: var(--17px);
        margin-bottom: var(--30px);
    }
}

/* lead */
section.v3-top-lead {
    background: #fff;
    padding-top: var(--40px);
    padding-bottom: var(--60px);
    .v3-top-lead__img {
        width: var(--230px);
        display: block;
        margin: 0 auto var(--15px);
    }
    .v3-top-lead__title {
        text-align: center;
        font-size: var(--16px);
        font-weight: 700;
        line-height: var(--22px);
        letter-spacing: 0.02em;
        margin-bottom: var(--5px);
    }
    .v3-top-lead__note {
        text-align: center;
        font-size: var(--12px);
        line-height: var(--18px);
        margin-bottom: var(--41px);
    }
    .v3-top-lead__catch {
        text-align: center;
        font-weight: 700;
        font-size: var(--24px);
        line-height: var(--36px);
        margin-bottom: var(--19px);
    }
    .c-btn {
        margin: 0 auto;
        position: relative;
        width: var(--220px);
        height: var(--44px);
        .icon {
            position: absolute;
            right: var(--10px);
            bottom: 50%;
            translate: 0 50%;
            width: var(--14px);
        }
    }
}

/* lineup */
.v3-top-lineup {
    background: #fff;
    padding-bottom: var(--80px);
    .v3-top-lineup__inner {
        padding: 0 var(--20px);
    }
    .v3-top-lineup__list {
        display: flex;
        flex-direction: column;
        gap: var(--80px);
        .v3-top-lineup__item {
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: row-reverse;
            &:nth-child(even) {
                flex-direction: row;
            }
            .v3-top-lineup__item-text {
                width: var(--167px);
                .name {
                    margin-bottom: var(--20px);
                    font-family: var(--font-source-sans-pro);
                    font-size: var(--22px);
                    font-weight: 600;
                    line-height: var(--28px);
                    span {
                        display: block;
                        font-size: var(--16px);
                        font-weight: 400;
                        line-height: var(--20px);
                        margin-bottom: var(--6px);
                    }
                }
                p {
                    font-size: var(--14px);
                    line-height: var(--24px);
                    margin-bottom: var(--30px);
                }
            }
            .v3-top-lineup__item-img {
                width: var(--168px);
            }
        }
    }
}

/* effect */
.v3-top-effect {
    background: #fff;
    padding-bottom: var(--40px);
    .v3-top-effect__inner {
        padding: 0 var(--17px);
    }
    .v3-top-effect__sub-title {
        text-align: center;
        font-size: var(--22px);
        font-weight: 700;
        line-height: var(--32px);
        margin-bottom: var(--32px);
        small {
            font-size: var(--12px);
        }
    }
    .v3-top-effect__movie-box {
        width: var(--275px);
        margin: 0 auto var(--20px);
    }
    .v3-top-effect__text {
        text-align: center;
        font-size: var(--14px);
        line-height: var(--24px);
    }
}

section.v3-top-award {
    background: #F0F0F0;
    padding: var(--40px) 0;
    position: relative;
    .v3-top-award__inner {
        padding: 0 var(--18px);
    }
    .v3-top-award__heading {
        text-align: center;
        font-size: var(--16px);
        font-weight: 700;
        line-height: var(--28px);
        letter-spacing: 0.02em;
        margin-bottom: var(--19px);
    }
    .v3-top-award__lead {
        text-align: center;
        font-size: var(--13px);
        font-weight: 400;
        line-height: var(--22px);
        letter-spacing: 0.02em;
        margin-bottom: var(--36px);
    }
    .v3-top-award-img {
        width: 100%;
    }
    .v3-top-award-bg {
        width: var(--232px);
        position: absolute;
        top: var(--40px);
        left: var(--7px);
    }
}

/* reason */
.v3-top-reason {
    background: #000;
    padding: var(--40px) 0;
    .v3-top-reason__inner {
        padding: 0 var(--20px);
    }
    .v3-top-reason__heading {
        text-align: center;
        color: #fff;
        font-size: var(--24px);
        font-weight: 700;
        line-height: var(--28px);
        margin-bottom: var(--19px);
    }
    .v3-top-reason__text {
        text-align: center;
        color: #fff;
        font-size: var(--13px);
        line-height: var(--22px);
        margin-bottom: var(--10px);
        &:first-of-type {
            margin-bottom: var(--15px);
        }
        &:last-of-type {
            margin-bottom: 0;
        }
    }
    .v3-top-reason__img {
        display: block;
        width: var(--306px);
        margin: 0 auto var(--15px);
    }

}