﻿.txt
{
    text-align: center;
    font-size: 2.8646vw;
    color: #282828;
    font-family: "游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝",serif;
    line-height: 1.8;
    letter-spacing: -.1em;
    margin: 1em;
}
.page_sub_ttl
{
    text-align: center;
    margin-top: 50px;
}
.style_chara_wrap
{
    position: relative;
    padding-top: 106.7708333%;
    margin-bottom: 2em;
}
.arrw-y
{
    width: 11.5885416%;
    position: absolute;
    top: 33%;
    left: 33%;
    opacity: 0;
}
.arrw-r
{
    width: 11.5885416%;
    position: absolute;
    top: 33%;
    right: 33%;
    opacity: 0;
}
.chara01
{
    width: 40.8854166%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0;
}
.chara02
{
    width: 42.0572916%;
    position: absolute;
    top: 42%;
    left: 1%;
    opacity: 0;
}
.chara03
{
    width: 69.6614583%;
    position: absolute;
    top: 41%;
    right: -1%;
    opacity: 0;
}
.style_ttl_h4
{
    text-align: center;
    color: #863b03;
    font-size: 3.3855vw;
    font-family: "游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝",serif;
}
.ss_img
{
    width: 66.9270833%;
    margin: 0 auto 2em;
    text-align: center;
}
@media screen and (min-width: 769px)
{
    .txt
    {
        font-size: 16px;
        width: 522px;
        margin: 1em auto;
    }
    .style_chara_wrap
    {
        padding-top: 820px;
    }
    .style_ttl_h4
    {
        font-size: 26px;
    }
    .arrw-y
    {
        width: auto;
        top: 260px;
        left: 390px;
    }
    .arrw-r
    {
        width: auto;
        top: 260px;
        right: 360px;
    }
    .chara01
    {
        width: auto;
    }
    .chara02
    {
        width: auto;
        top: 330px;
        left: 140px;
    }
    .chara03
    {
        width: auto;
        top: 320px;
        right: 90px;
    }
}
.chara01_anime
{
    -webkit-animation-name: chara01_anime;
    animation-name: chara01_anime;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: .4s;
    animation-delay: .4s;
}
@-webkit-keyframes chara01_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(0,-10%);
        transform: translate(0,-10%);
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
}
@keyframes chara01_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(0,-10%);
        transform: translate(0,-10%);
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
}
.arrw-y_anime
{
    -webkit-animation-name: arrw-y_anime;
    animation-name: arrw-y_anime;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: .8s;
    animation-delay: .8s;
}
@-webkit-keyframes arrw-y_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(10%,-10%);
        transform: translate(10%,-10%);
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
}
@keyframes arrw-y_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(10%,-10%);
        transform: translate(10%,-10%);
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
}
.chara02_anime
{
    -webkit-animation-name: chara02_anime;
    animation-name: chara02_anime;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
}
@-webkit-keyframes chara02_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(75%,-100%) scale(.6);
        transform: translate(75%,-100%) scale(.6);
    }
    40%
    {
        opacity: .2;
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0) scale(1);
        transform: translate(0,0) scale(1);
    }
}
@keyframes chara02_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(75%,-100%) scale(.6);
        transform: translate(75%,-100%) scale(.6);
    }
    40%
    {
        opacity: .2;
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0) scale(1);
        transform: translate(0,0) scale(1);
    }
}
.arrw-r_anime
{
    -webkit-animation-name: arrw-r_anime;
    animation-name: arrw-r_anime;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
}
@-webkit-keyframes arrw-r_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(-10%,-10%);
        transform: translate(-10%,-10%);
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
}
@keyframes arrw-r_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(-10%,-10%);
        transform: translate(-10%,-10%);
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
}
.chara03_anime
{
    -webkit-animation-name: chara03_anime;
    animation-name: chara03_anime;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: 2.6s;
    animation-delay: 2.6s;
}
@-webkit-keyframes chara03_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(-25%,-80%) scale(.6);
        transform: translate(-25%,-80%) scale(.6);
    }
    40%
    {
        opacity: .2;
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0) scale(1);
        transform: translate(0,0) scale(1);
    }
}
@keyframes chara03_anime
{
    0%
    {
        opacity: 0;
        -webkit-transform: translate(-25%,-80%) scale(.6);
        transform: translate(-25%,-80%) scale(.6);
    }
    40%
    {
        opacity: .2;
    }
    100%
    {
        opacity: 1;
        -webkit-transform: translate(0,0) scale(1);
        transform: translate(0,0) scale(1);
    }
}