firefoxブラウザアプリ（android版）のラジオボタン表示

Question

はじめまして。よろしくお願いいたします。
現在スマホサイトを作成していますが、その中でラジオボタンを表示するページがあります。

chromeではきちんとラジオボタンが表示されますがfirefoxではラジオボタンが
●　のように表示されてしまいます。

firefox

chrome

<p class="gender">
   <label>
      <input type="radio" name="gender" value="男性" checked="checked">
          <span class="radio_text">
                男性
          </span>
   </label>
      <br>
   <label>
      <input type="radio" name="gender" value="女性">
          <span class="radio_text">
                女性
          </span>
      </label>
</p>

.gender label {display: block;
    width:100%;}
input[type=radio] {
    width: 70px;
    height: 70px;
    margin-right: 30px;
    vertical-align: middle;
}
.radio_text {vertical-align: middle;}

firefoxのスマホブラウザはこれがデフォルトなんでしょうか？
htmlやcssの書き方がおかしいのか？？
firefoxで通常のラジオボタンを表示する方法を教えてください。

よろしくお願いいたします。

Comments

[m.ts10806]

３点ご確認願います。　１：PCブラウザではどうか（当方環境では同じ現象にはならず）２：キャッシュクリアを試す　３：ラジオボタンとしての機能は果たしているのか　　　もし３がYesであればスマホ版Firefoxのデザイン仕様という可能性は否めません。もちろんCSSを駆使すれば同じデザイン実現は可能ですが、そうなるとCSSフレームワーク入れるのが楽ですね。

[m.ts10806]

↑ごめんなさい。1の「再現なし」は誤りでした（編集しました）

[houjicha_]

こんばんは。質問ありがとうございます。１．PCのfirefoxブラウザでは通常通りのラジオボタンが表示されます。２．キャッシュクリアはしましたが変化はありません・・・３．はい、ちゃんとラジオボタンとして機能しています。

[_lemon2003_]

手元で確認してみると、普通のラジオボタンでfirefox, chrome では普通に表示されますが、ソースではfirefoxのみ真っ黒みたいな感じになりますね。

[houjicha_]

そうなんです汗　cssでいじってるのが原因かな？と思いますがよく分からないのでラジオボタンごとカスタマイズすることにしました笑

Answer 1

根本的な解決はしていませんが、スタイルシートでラジオボタンごとカスタマイズできましたので
一応解決済みとします。
ご質問下さった皆さんありがとうございました。