/* ==== ==== ==== ==== ==== ==== 
    contact_message
==== ==== ==== ==== ==== ==== */
.contact_message{
    margin-bottom: 30px;
    background-color: #E2E8F2;
    padding: 20px 30px;
    width: 100%;
    height: auto;

    display: -moz-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;

    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.contact_message p,
.contact_message a{
    font-size: 20px;
}
.contact_message p{
    margin: 0;
    color: red;
    font-weight: 700;
}

.contact_message a{
    padding: 0.5em 1em;
    display: inline-block;

    text-align: center;
    color: #FFF;
    font-weight: 700;
    background-color: #8db13f;
}
/*  ==== レスポンシブ（1800以上） ==== ==== ==== */
@media screen and (min-width:1800px) {
    .contact_message p,
    .contact_message a{
        font-size: 18px;
    }
}
/*  ==== レスポンシブ（1200以下） ==== ==== ==== */
@media screen and (max-width:1200px) {
    .contact_message p,
    .contact_message a{
        font-size: 16px;
    }
    .contact_message p{
        margin-bottom: 10px;
        width: 100%;
    }
}
/*  ==== レスポンシブ（ 600以下） ==== ==== ==== */
@media screen and (max-width:600px) {
    .contact_message{
        padding: 20px 3%;
    }
    .contact_message p{
        text-align: center;
    }
    .contact_message a{
        margin: 0 auto;
    }
}
/*  ==== レスポンシブ（400以下） ==== ==== ==== */
@media screen and (max-width:400px) {
    .contact_message p,
    .contact_message a{
        font-size: 14px;
    }
}


/* ==== ==== ==== ==== ==== ==== 
        投稿内容（the_content();）
==== ==== ==== ==== ==== ==== */

/*  ==== contact_form_wrap ==== ==== ==== ==== ==== ==== ==== ==== */
.contact_form_wrap .contact_notes{
    text-align: center;
    font-size: 14px;
    color: red;
}

/*  ==== the_content_wrap ==== ==== ==== ==== ==== ==== ==== ==== */
.the_content_wrap{
    margin: 0 auto;
    width: 100%;
}

/*  ==== contact_table ==== ==== ==== ==== ==== ==== ==== ==== */
.contact_table{
    margin: 0 auto;
    width: 100%;
    max-width: 1200px;

    table-layout: auto;
}

/*  --- tr --- --- */
.contact_table tr{
    width: 100%;
    display: block;
    margin-bottom: 30px;
}
.contact_table tr{
    border-top: #999 solid 1px;
    border-left: #999 solid 1px;
    border-right: #999 solid 1px;
    margin-bottom: 0px;
}
.contact_table tr:last-child{
    border-bottom: #999 solid 1px;
}

/*  --- th td --- --- */
.contact_table th,
.contact_table td{
    padding: 15px;
}
/*  --- th --- --- */
.contact_table th{
    width: 400px;
    text-align: left;
    vertical-align: middle;
    font-weight: bold;
    margin-bottom: 0;
    /*
    color: #2E395E;
    background-color: #BAC8D5;
    background-color: #28a738;
    */
    background-color: #d0efdf;
}



/*  --- td --- --- */
.contact_table td{
    width: calc(100% - 400px);
}
.contact_table td input,
.contact_table td textarea{
    width: 100%;
    padding: 0.5em;
}
.contact_table td input[type="checkbox"]{
  width:auto;
}

/*  --- required_mark（必須マーク） --- --- */
.contact_table th span.required_mark{
    margin-left: 8px;
    padding: 0.3em 0.5em;
    color: #FFF;
    /*
    background-color: #2E395E;
    */
    background-color: #28a738;
}

/*  ==== btn-box ==== ==== ==== ==== ==== ==== ==== ==== */
.btn-box{
    margin: 10px auto 10px;
    text-align: center;
}
.btn-box button,
.btn-box input{
    border: solid 0px transparent;
    padding: 0.5em 2em;
    /*
    background-color: #2E395E;
    */
    background-color: #28a738;
    color: #FFF;
    appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    font-size: 16px;
}
.btn-box input[type="submit"]{
    padding: 0.5em 3em;
}



/*  ==== レスポンシブ（900以下） ==== ==== ==== */
@media screen and (max-width:900px) {
    /*  --- th td --- --- */
    .contact_table th,
    .contact_table td{
        display: block;
        width: 100%;
        padding: 15px;
    }
}



/*  ==== レスポンシブ（400以下） ==== ==== ==== */
@media screen and (max-width:400px) {
    /*  --- th --- --- */
    .contact_table th{
        font-size: 4.0vw;
    }
}


/* ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ====
    thanksページ
==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== */
#contact_thanks{}

#contact_thanks .page_content{
    margin: 60px auto;
}

#contact_thanks .contact_thanks_message{
    margin: 0px auto;
    text-align: center;
}
/*  ==== レスポンシブ（600以下） ==== ==== ==== */
@media screen and (max-width: 600px) {
    #contact_thanks .contact_thanks_message{
        text-align: left;
    }
}