*,
input,
select,
textarea,
button{
    position: relative;
    font-family: 'Noto Sans JP', sans-serif;
    font-size:15px;
}

form input{
    padding: .2em;
    border:1px solid #ccc;
    border-radius:4px;
}

/* message */
.alert,
.message{
    margin:0 auto 16px;
    padding:10px 42px;
    width: 100%;
    max-width:600px;
    /*height: 41px;*/
    font-size: 14px;
    line-height: 20px;
    color: #5F925F;
    background: #E0F9E2;
    border: 1px solid #94F594;
    border-radius: 10px;
}

.message.float_top{
    position: fixed;
    top: 16px;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 999;
}

.alert_success:before,
.success::before{
    position: absolute;
    content:url(/img/alert_chk.svg);
    margin: auto;
    width:20px;
    height:20px;
    top:0;
    bottom:0;
    left:16px;
}

.alert_info:before{
    position: absolute;
    content:url(/img/alert_info_error.svg);
    margin: auto;
    top:0;
    bottom:0;
    left:16px;
}

.alert_notificaion:before{
    position: absolute;
    content:url(/img/alert_info_notification.svg);
    margin: auto;
    width:20px;
    height:20px;
    top:0;
    bottom:0;
    left:16px;
}

.warning{
    color: #DF0101;
    background: #FEECEC;
    border: 1px solid #DF0101;
}

.alert_warning:before,
.warning:before{
    position: absolute;
    content:url(/img/alert_info_worning.svg);
    margin: auto;
    width:20px;
    height:20px;
    top:0;
    bottom:0;
    left:16px;
}

.alert_cancel:before{
    position: absolute;
    content:url(/img/aler_cancel.svg);
    margin: auto;
    width: 20px;
    height: 20px;
    top:0;
    bottom:0;
    left:16px;
}

.float_tips{
    position:absolute;
    display: block;
    margin: auto;
    padding:.5em;
    width:250px;
    text-align:left;
    background-color: #fff;
    bottom:100%;
    left:-75px;
    right:0;
    box-shadow:2px 2px 10px #aaa;
    border-radius:8px;
}

main th{
    white-space: pre;
}

.fs-xs{
    font-size:80%;
}