@charset "Shift_JIS";

.animCntn{
    position: relative;
    width: 300px;
    height:598px;
    overflow:hidden;
    margin:auto;
}
.animItem{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 300px;
    height:598px;
    background-size:300px 598px;
}
.anim01{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img01.png");
    opacity:0;
}
.anim02{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img02.png");
    opacity:0;
}
.anim03{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img03.png");
    opacity:0;
}
.anim04{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img04.png");
    opacity:0;
}
.anim04Child01{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img04_01.png");
    opacity:0;
    top:-420px;
}
.anim04Child02{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img04_02.png");
    opacity:0;
}

.anim05{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img05.png");
    opacity:0;
}
.anim06{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img06.png");
    opacity:0;
}
.anim07{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img07.png");
    opacity:0;
}
.anim07Child01{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img07_01.png");
    opacity:0;
    top:-420px;
}
.anim07Child02{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img07_02.png");
    opacity:0;
}

.anim08{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img08.png");
    opacity:0;
}
.anim08Child01{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img08_02.png");
    height:1150px;
    background-size:300px 1150px;
    opacity:0;
}
.anim09{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img09.png");
    opacity:0;
}
.anim10{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img10.png");
    opacity:0;
}
.anim11{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img11.png");
    opacity:0;
}
.anim12{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img12.png");
    opacity:0;
}

.bgBlack{
    background-image:url("https://img.dinos.co.jp/images/cms/app/img12.png");
    opacity:1;
}

.frame01{
    background-image:url("https://img.dinos.co.jp/images/cms/app/back.png");
}
.tap01{
    position: absolute;
    width:45px;
    height:45px;
    border-radius:50%;
    background-color:#cc0000;
    opacity:0;
    bottom:20px;
    right:70px;
}
.tap02{
    position: absolute;
    width:81px;
    height:22px;
    border-radius:20px;
    opacity:0;
    top:218px;
    right:51px;
    box-sizing:border-box;
    background-color:#ff6600;
}

.tap03{
    position: absolute;
    width:86px;
    height:24px;
    border-radius:20px;
    opacity:0;
    top:171px;
    right:35px;
    box-sizing:border-box;
    background-color:#ff6600;
}

/*ˆÈ‰ºSP—p*/
@media screen and (max-width: 767px) {
    .animCntn{
        width: 200px;
        height:399px;
    }
    .animItem{
        width: 200px;
        height:399px;
        background-size:200px 399px;
    }
    .anim08Child01{
        height:767px;
        background-size:200px 767px;
    }
    
    .tap01{
        width:30px;
        height:30px;
        bottom:14px;
        right:47px;
    }
    .tap02{
        width:54px;
        height:15px;
        top:145px;
        right:34px;
    }
    
    .tap03{
        width:57px;
        height:16px;
        top:114px;
        right:23px;
    }
    
}