@charset "utf-8";
/* CSS Document */


div.contents{
    min-height:100vh;
}
/*marker*/

ul.marker{
    width:100%;
    max-width:900px;
    margin:3em auto;
    position:relative;
}

ul.marker::before{
    content:" ";
    width:100%;
    height:3px;
    border-top:dashed 2px #c8c8b4;
    position:absolute;
    left:0;
    top:calc(50% - 1.5px);
}

ul.marker li{
    width:22%;
    font-size:0.9em;
    padding:0.8em 0;
    text-align: center;
    position:relative;
}

ul.marker li.active{
    background:#fcd006;
    color:#000;
}

ul.marker li h4{
    font-weight:normal;
    letter-spacing:0.1em;
}

/*form*/

.stack{
    width:80%;
    max-width:600px;
    margin-left:auto;
    margin-right:auto;
}

form p{
    display:inline;
}

form > button{
    display:inline-block;
    margin-right:1em!important;
    margin-left:1em!important;
}

form label span.red{
    display:inline-block;
    font-size:0.7em;
    font-weight:bold;
    vertical-align: top;
}

form > div span.red{
    font-size:0.7em;
    font-weight:bold;
}

/*error*/
form p.error{
    font-size:0.7em;
    display:block;
    margin:0.5em;
}

/*confirm*/

.confirm{
    width:80%;
    max-width:600px;
    margin-left:auto;
    margin-right:auto;
    text-align: center;
}

.confirm > div p{
    display:inline-block;
}

.confirm > div p:first-child{
    font-weight:600;
}

/*thanks*/

div.thanks img{
    width:15%;
    min-width:100px;
    margin:4em auto 3em;
}


div.thanks h3{
    line-height:1.5em;
}


/**/

#privacy div.contents{
    width:70%;
}