body{ background: #f8f8f8; line-height: 1.8}
#flashMessage, .error{
    padding:15px;
    padding-left:30px;
    margin-bottom:20px;
    background:#FFDFBF;
    color:#FF7A45;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -webkit-box-shadow: 3px 3px 3px #fff;
}
#main{
    width:100%;
    margin: 30px auto;
    background: #fff;
    padding: 30px 0px;
}
h2{
    color:#FFF;
    text-align: center;
    font-size: 1.5em !important;
    padding: 15px;
    margin-bottom: 50px !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-size: 100% !important;
    background: #444444;
    position: relative;
}

h2:before {
    content: "";
    position: absolute;
    bottom: -15px;
    left: 50%;
    margin-left: -10px;
    width: 0;
    height: 0;
    border-top: 15px solid #444444;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
}

.btn_blue{
    padding: 0.6em;
    background: #2492df;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    box-shadow: 0px 7px 0px 0px #1b7dc1;
    -moz-box-shadow: 0px 7px 0px 0px #1b7dc1;
    -webkit-box-shadow: 0px 7px 0px 0px #1b7dc1;
    display: inline-block;
    width: 80%;
    color: #fff;
    font-size: 1.4em;
    font-weight: bold;
    margin-bottom: 20px;
}
.btn_blue:hover {
    background-color: #59b1eb;
    color:#f8f8f8;
}
.btn_blue,
.btn_blue::before,
.btn_blue::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}

/* お問合せフォーム */
#contact-box h1{ font-size:1.5em;}
#contact-box .error-message{ color:#FF7A45;}
#contact-box .input label {font-size: 0.9em;font-weight: 100;color:#666; display: block;}
#contact-box .input label.comfirm { background: #eee; padding:5px;}
#contact-box span.label{float:right; display: inline-block;padding: .4em .6em .3em;}
#contact-box div.input{ margin-bottom: 12px;}
#contact-box #g-captcha{ margin-top: 20px;}
#contact-box .default label{ padding-left: 10px;font-weight: 100;}


@media screen and (min-width: 767px) {
    #main{
        width:680px;
    }
    .btn-blue{
        width: 50%;
    }
    #inputName{ width:50% !important; }
}

table {
    border-collapse: collapse;
    width: 100%;
    margin-bottom: 20px;
}
table th,
table td {
    padding: 10px;
    border: 1px solid #999;
    font-weight: normal;
}
table th {
    background-color: #eee;
    text-align: center;
    font-size: smaller;
    width: 30%;
}

@media screen and (max-width: 400px) {
    table {
        border-top: 1px solid #999;
    }
    table td {
        display: block;
        text-align: center;
    }
    table th {
        display: block;
        border-top: none;
        border-bottom: none;
        width: 100%;
    }

}

/*
* Discord Screen
*/
#discord-screen .avatar {
    height: 3rem;
    width: 3rem;
    position: relative;
    display: inline-block !important;
}

#discord-screen .avatar-img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    background-color: rgb(23 162 184);
    color: #ffffff;
}

#discord-screen .avatar-xxl {
    height: 5rem;
    width: 5rem;
}

@media (min-width: 768px) {
    #discord-screen .avatar-xxxl {
        width: 8rem;
        height: 8rem;
    }
}

#discord-screen .btn-join {
    color: #fff;
    background-color: #5764f2;
    border-color: #5764f2;
    border-radius: 1.5rem;
    padding: .4rem 1.8rem;
}
#discord-screen .btn-joined {
    background-color: rgb(23 162 184);
    border-color: rgb(23 162 184);
    color: #fff;
    border-radius: 1.5rem;
    padding: .4rem 1.8rem;
}