@charset "utf-8";

*, *:before, *:after {
    box-sizing: border-box;
}
body{
    padding: 0;
}
.wrap{
    max-width: 100%;
    margin: 0;
}
.body-wrap{
    width: min(100%,650px);
    margin: 0 auto;
    & img{
        width: 100%;
    }
}
.main-contents{

}

/*ボタン*/
.purchase{
    background: #990100;
    padding: min(5vw,35px) min(5vw,30px);
    & input{
        background: none;
        border: none;
        padding: 0;
    }
}
.purchase-btn{
    display: block;
    text-decoration: none;
    transition: .2s all ease-in-out;
    -webkit-animation: anim_sc 1.5s infinite;
    animation: anim_sc 1.5s infinite;
    height: auto;
    width: 100%;
    filter: drop-shadow(5px 5px 10px rgb(0,0,0,0.5));
    -o-object-fit: contain;
    object-fit: contain;
}
@-webkit-keyframes anim_sc {
    0% {
        transform: scale(1)
    }
    30% {
        transform: scale(1)
    }
    40% {
        transform: scale(1.05)
    }
    50% {
        transform: scale(1)
    }
    60% {
        transform: scale(1.05)
    }
    70% {
        transform: scale(1)
    }
    100% {
        transform: scale(1)
    }
}
@keyframes anim_sc {
    0% {
        transform: scale(1)
    }
    30% {
        transform: scale(1)
    }
    40% {
        transform: scale(1.05)
    }
    50% {
        transform: scale(1)
    }
    60% {
        transform: scale(1.05)
    }
    70% {
        transform: scale(1)
    }
    100% {
        transform: scale(1)
    }
}

/*動画リンク*/
.movie{
    & iframe{
        aspect-ratio:560/315;
        width: 100%;
        height: auto;
        object-fit: contain;
    }
    /* & a{
        display: block;
        transition: 0.3s;
        position: relative;
        &::before{
            content: "";
            display: block;
            position: absolute;
            translate:-50% -50%;
            top: 50%;
            left: 50%;
            background: url(../img/play-btn.svg) center/contain no-repeat;
            aspect-ratio: 1;
            width: min(15vw,80px);
        }
        &:hover{
            opacity: 0.7;
        }
        & img{
            width: 100%;
        }
    } */
}
/* @-webkit-keyframes poyon {
    0% {
        transform: scale(1, 1);
    }
    20% {
        transform: scale(1.05, 1.05);
        filter: drop-shadow(5px 5px 10px rgb(0,0,0,0.5));
    }
    90% {
        transform: scale(1, 1);
    }
    100% {
        transform: scale(1, 1);
    }
}
@keyframes poyon {
    0% {
        transform: scale(1, 1);
    }
    20% {
        transform: scale(1.05, 1.05);
        filter: drop-shadow(5px 5px 10px rgb(0,0,0,0.5));
    }
    90% {
        transform: scale(1, 1);
    }
    100% {
        transform: scale(1, 1);
    }
} */
 