@charset "UTF-8";

/* entry */
section#entry {
    width: 960px;
    margin: 0 auto;
    font-weight: 600;
}
section#entry > h2 {
    margin-bottom: 20px;    
    text-align: center;
    font-size: 3.1rem;
    font-family: fot-tsukuardgothic-std, sans-serif;
    color: #FF80C0;
    line-height: 1.7;   
}

section#entry > p.txt {
    margin: 0 auto 26px;
    font-size: 2.0rem;
    line-height: 2.2;    
    display: flex;
    justify-content: center;
}

#flow {
    font-size: 2.0rem;
    margin-bottom: 57px;
    padding: 39px 0 18px;
    border-radius: 15px;
    box-shadow: 0 0 10px #D6D6D6;
}

#flow > h2 {
    margin-bottom: 11px;
    text-align: center;
    font-size: 3.1rem;
    font-family: fot-tsukuardgothic-std, sans-serif;
    color: #FF80C0;
    line-height: 1.7;
}
#flow p.txt {
    margin-bottom: 10px;
    font-size: 2.4rem;
    font-family: ab-kokoro-no1, sans-serif;
    color: #D6D6D6;
    text-align: center;
}
#flow p.txt2 {
    margin-bottom: 66px;
}

#flow p.txt3 {
    margin-bottom: 47px;
    line-height: 1.5;
}

#flow p.txt4{
    margin-bottom: 30px;    
}

#flow ol {
    margin-left: 40px;
    margin-bottom: 56px;
    counter-reset: count 0;
}
#flow li{margin-bottom: 22px;}

#flow li:before {
    content: counter(count) " ";
    counter-increment: count 1;
    margin-right: 13px;
    width: 37px;
    height: 37px;
    background: #FFF0F8;    
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-size: 2.3rem;
    color: #FF80C0;
    border-radius: 50px;
    text-align: center;
    display: inline-block;
    line-height: 1.5;
    
}

.copy{
    margin-top: 50px;
    padding-bottom: 20px;
    font-size: 1.4rem;
}

@media screen and (max-width:768px) {
    section#entry{width: 96%;}
    
    section#entry > h2{
        margin-bottom: 10px;    
        font-size: 1.9rem;
        letter-spacing: -1px;    
    }
    
    section#entry > p.txt{
        width: 96%;
        margin: 0 auto;
        text-align: center;
        font-size: 1.6rem;}
    
    #flow{
        margin-bottom: 37px;
        padding: 19px 0 1px;
    }
    #flow p.txt{font-size: 1.6rem;}
    #flow > h2{font-size: 1.9rem;}
    #flow p.txt2{
        font-size: 1.6rem;
        margin-bottom: 36px;}
    
    #flow ol {
        margin-left: 20px;
        margin-bottom: 20px;
    }
    #flow li{
        display: flex;
    }
    #flow li span{
        width: 80%;
        font-size: 1.5rem;    
    }
    
    #flow li:before{
        width: 30px;
        height: 30px;    
        font-size: 2rem;    
    }
    
    #flow p.txt3 {
        width: 90%;
        margin: 0 auto;
        margin-bottom: 27px;
        font-size: 1.6rem;
    }
    #flow p.txt4 {
        margin-bottom: 20px;
        font-size: 1.4rem;
    }

}