@charset "UTF-8";
/* CSS Document　default */
/*Contact Form 7カスタマイズhttps://kagesai.net/contactform7perfectguide/*/
/*スマホContact Form 7カスタマイズ*/
@media(max-width:500px) {
        .inquiry th, .inquiry td {
                display: block !important;
                width: 100% !important;
                border-top: none !important;
                -webkit-box-sizing: border-box !important;
                -moz-box-sizing: border-box !important;
                box-sizing: border-box !important;
        }
        .inquiry tr:first-child th {
                border-top: 1px solid #d7d7d7 !important;
        }
        /* 必須・任意のサイズ調整 */
        .inquiry .haveto, .inquiry .any {
                font-size: 10px;
        }
}
/*見出し欄*/
.inquiry th {
    text-align: left;
    font-size: 14px;
    color: #444;
    padding: 10px;
    width: 0%;
    background: #f7f7f7;
    border: solid 1px #d7d7d7;
}
/*通常欄*/
.inquiry td {
        font-size: 13px;
        border: solid 1px #d7d7d7;
}
/*横の行とテーブル全体*/
.entry-content .inquiry tr, .entry-content table {
        border: solid 1px #d7d7d7;
}
/*必須の調整*/
.haveto {
        font-size: 7px;
        padding: 5px;
        background: #ff9393;
        color: #fff;
        border-radius: 2px;
        margin-right: 5px;
        position: relative;
        bottom: 1px;
}
/*任意の調整*/
.any {display: none;
        font-size: 7px;
        padding: 5px;
        background: #93c9ff;
        color: #fff;
        border-radius: 2px;
        margin-right: 5px;
        position: relative;
        bottom: 1px;
}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item {
        display: block;
}
/*送信ボタンのデザイン変更*/
#formbtn {
        display: block;
        padding: 1em 0;
        margin-top: 30px;
        width: 100%;
        background: #ffaa56;
        color: #fff;
        font-size: 18px;
        font-weight: bold;
        border-radius: 2px;
        border: none;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover {
        background: #fff;
        color: #ffaa56;
}


.wpcf7-form-control{
    
 

    width: 100%;
}

/*
<table class="inquiry">
<tr>
<th>
<span class="haveto">必須</span><span>お名前</span>
</th>
<td>
[text* your-name class:textsp placeholder"影影 男男"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>メールアドレス</span>
</th>
<td>[email* your-email class:mailsp placeholder"kagekage@gmail.com"]</td>
</tr>
<tr>
<th>
<span class="any">任意</span><span>電話番号</span>
</th>
<td>
[tel your-tel class:tel placeholder"090-1111-2222"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>ドロップダウンメニュー</span>
</th>
<td>
[select* dpmenu include_blank class:drop "サンプル1" "サンプル2" "サンプル3"]
</td>
</tr>
<tr>
<th>
<span class="any">任意</span><span>チェックボックス横並び【１つを選択】</span>
</th>
<td>
[checkbox checkbox-1 exclusive use_label_element default:1 class:check1 "サンプル4" "サンプル5" "サンプル6"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>チェックボックス横並び【複数を選択】</span>
</th>
<td>
[checkbox* checkbox-2 use_label_element default:1 class:check2 "サンプル7" "サンプル8" "サンプル9"]</td>
</tr>
<tr>
<th>
<span class="any">任意</span><span>チェックボックス縦並び【１つを選択】</span>
</th>
<td>
[checkbox checkbox-3 exclusive use_label_element default:1 class:verticallist class:check3 "サンプル10" "サンプル11" "サンプル12"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>チェックボックス縦並び【複数を選択】</span>
</th>
<td>
[checkbox* checkbox-4 use_label_element default:1 class:verticallist class:check4 "サンプル13" "サンプル14" "サンプル15"]
</td>
</tr>
<tr>
<th>
<span class="any">任意</span><span>ラジオボタン横並び</span>
</th>
<td>
[radio radio-1 use_label_element default:1 class:radio1 "サンプル16""サンプル17""サンプル18"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>ラジオボタン縦並び</span>
</th>
<td>
[radio radio-2 use_label_element default:1 class:verticallist class:radio2 "サンプル19""サンプル20""サンプル21"]
</td>
</tr>
<tr>
<th>
<span class="any">任意</span><span>数値のスピン形式</span>
</th>
<td>
[number number-1 min:10 max:100 placeholder class:number1 "数値の値は指定できる"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>日付</span>
</th>
<td>
[date* date-960 placeholder class:datesp ]
</td>
</tr>
<tr>
<th>
<span class="any">任意</span><span>中級者向け回答形式のタグ</span>
</th>
<td>
[quiz quiz-1 class:qyizsp "質問：2019年に発表された新元号は？|令和"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>郵便番号</span>
</th>
<td>
[text* your-postalcode class:p-postal-code placeholder"123-4567"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>都道府県</span>
</th>
<td>
[text* your-prefectures class:p-region placeholder"◯◯県"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>ご住所</span>
</th>
<td>
[text* your-address class:p-locality placeholder"○○市○○1-2-3 ○○マンション 101号室"]
</td>
</tr>
<tr>
<th>
<span class="haveto">必須</span><span>お問い合わせ内容</span>
</th>
<td>
[textarea* your-message class:content placeholder "１行以上のテキスト入力欄"]
</td>
</tr>
</table>
[acceptance acceptance-442 class:spam1]スパムメール防止のため、こちらのボックスにチェックを入れてから送信してください。
[submit id:formbtn "上記の内容で送信する"]*/