Contact Form7で文字サイズを変更したい
WordPressでホームページを作っています。
プラグインのContact Form7を使ってお問い合わせページを作成していますが、問い合わせフォームの入力する部分の文字サイズを大きくしたいと思います。
どこをどう調整したらいいかよく分からないので、ご存知の方いらっしゃればアドバイスお願いいたします。
htmlとcssは以下になります。
参考に画像も添付いたします。
■html
<table class="table table-bordered table-striped table-contactform7">
<tr>
<th><span class="required-contactform7">必須</span><span class="title-contactform7">お名前</span></th>
<td>[text* your-name akismet:author watermark"例：山田 太郎"] </td>
</tr>
<tr>
<th><span class="required-contactform7">必須</span><span class="title-contactform7">メールアドレス</span></th>
<td>[email* your-email akismet:author_email watermark"例：×××@×××.com"]</td>
</tr>
<tr>
<th><span class="required-contactform7">必須</span><span class="title-contactform7">郵便番号</span></th>
<td>[text* zip id:zip watermark"例：840-0015"] </td>
</tr>
<tr>
<th><span class="required-contactform7">必須</span><span class="title-contactform7">都道府県</span></th>
<td>[text* pref id:pref watermark"例：佐賀県"]</td>
</tr>
<tr>
<th><span class="required-contactform7">必須</span><span class="title-contactform7">ご住所</span></th>
<td class="address-100">[text* addr id:addr watermark"例：佐賀市木原２丁目２５-１０ UTビル２F東号室"]</td>
</tr>
<tr>
<th><span class="required-contactform7">必須</span><span class="title-contactform7">お電話番号</span></th>
<td>[text* text-17 watermark"例：0952-60-6240"]</td>
</tr>
<tr>
<th><span class="required-contactform7">必須</span><span class="title-contactform7">ご相談内容</span></th>
<td>[radio radio-256 use_label_element "月額3,000円HP" "月額9,800円HP" "ウェブ広告代行" "その他のご相談"]</td>
</tr>
<tr>
<th><span class="required-contactform7">必須</span><span class="title-contactform7">メッセージ本文</span></th>
<td class="message-100">[textarea* your-message watermark"業種・目的・デザインイメージなど"]</td>
</tr>
</table>
<p class="text-xs-center">[submit class:btn class:btn-success class:btn-lg "送信する"]</p>
■css
/***** コンタクトフォーム *****/
.table-contactform7{
overflow: hidden;
table-layout: fixed;
}
.required-contactform7{
padding: 5px;
background: #DE8686;
color: #fff;
border-radius: 3px;
margin-right: 3px;
}
.unrequired-contactform7{
padding: 5px;
background: #BDBDBD;
color: #fff;
border-radius: 3px;
margin-right: 3px;
}
.table-contactform7 th{
font-weight:bold;
}
.table-contactform7 input,
.table-contactform7 textarea{
max-width: 90% !important;
height: 30px;
margin: 5px 10px 10px 5px;
}
.address-100 input{
max-width: 90% !important;
margin: 5px 10px 10px 5px;
}
.message-100 textarea{
width: 100%;
height: 100px;
margin: 5px 10px 10px 5px;
}
@media screen and (min-width: 900px){
.table-contactform7 th{
width:28%;
}
}
@media screen and (max-width: 900px){
.table-contactform7{
display:block;
}
.table-contactform7 tbody,
.table-contactform7 tr{
display: block;
width: 100%;
}
.table-contactform7 th{
width:100%;
display:block;
margin: 0 auto;
border:none;
}
.table-contactform7 td{
display: list-item;
list-style-type:none;
margin:0;
padding:0;
width: 100%;
border-top: none !important;
}
}
補足
ご回答ありがとうございます。 上記cssファイルに管理画面で作成したid名またはclass名を書き込んで編集すると言う事で良いのでしょうか？