.s-sec-mainview {
    padding: 10px;
}

.s-mv-inner {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
    background-size: contain;
    aspect-ratio: 1391 / 712;
    margin: 0 auto;
    align-content: flex-end;
    user-select: none;
}

.s-mv-table {
    width: 100%;
    height: 92%;
    display: grid;
    grid-template-columns: repeat(11, 1fr);
    grid-template-rows: repeat(8, 1fr);
    row-gap: 0%;
    column-gap: 0%;
}


/** webkit
_::-webkit-full-page-media, _:future, :root .s-mv-table {
	padding-top: 4vw;
}
**/

.s-mv-icon {
    width: 100%;
    height: auto;
}

.s-mv-table > div > img {
    width: 100%;
    height: auto;
}

/* MV fade */
.fade-up {
    animation-name:fadeUpAnime;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
}
@keyframes fadeUpAnime{
    from {
        opacity: 0;
    transform: translateY(100px);
}

to {
    opacity: 1;
    transform: translateY(0);
}
}

/* MV animation */
.s-delay-time06{
    animation-delay: 0.6s;
}

.s-delay-time09{
    animation-delay: 1s;
}

.s-delay-time12{
    animation-delay: 1.2s;
}

/* MV icons */
.s-mv-tipicon {
    width: 32.859375vw;
    height: auto;
    text-align: center;
}

.s-mv-tipicon2 {
    width: 38.5vw;
    height: auto;
}

.s-mv-tipicon3 {
    width: 28vw;
    height: auto;
}

.s-mv-period {
    width: 100%;
    color: #f4f399;
    text-align: center;
    padding-left: 1.3vw;
    transition: all 0.5s;
}

.s-mv-text {
    width: 100%;
    font-size: min(1.11vw, 35px);
    margin: 0;
    padding: 0;
}

.s-mv-text-big {
    width: 100%;
    font-size: min(3vw, 60px);
}

.s-mv-pc {
    display: initial;
}

.s-mv-sp {
    display: none;
}

/* smartphone */
@media screen and (max-width: 800px) {

    .s-mv-pc {
        display: none;
    }

    .s-mv-sp {
        display: initial;
    }

    .s-mv-inner {
        width: 100%;
        height: auto;
        max-width: initial;
        max-height: initial;
        aspect-ratio: 705 / 1257;
        margin: 0 auto;
        user-select: none;
    }

    .s-mv-table {
        width: 90%;
        height: 90%;
        grid-template-columns: repeat(5, 1fr);
        grid-template-rows: repeat(8, 1fr);
        margin: 0 auto 0.5em auto;
    }

    /* MV icons */
    .s-mv-tipicon {
        width: 90%;
        height: auto;
        text-align: center;
    }

    .s-mv-tipicon2 {
        width: 105%;
        height: auto;
    }

    .s-mv-tipicon3 {
        width: 95%;
        height: auto;
    }

    .s-mv-hamburger {
        position: absolute;
        top: 0.6em;
        right: 1em;
    }

    .s-mv-period {
        margin-top: 1vh;
    }

    .s-mv-text {
        font-size: 4vw;
    }

    .s-mv-text-big {
        font-size: 6vw;
    }
}