どうも7noteです。select要素にcssが使いにくいので、他の方法を考えてみました。

select要素にはCSSが調整難しいため、自由に調整できるdiv要素でできる方法を書いていきます。
また、PCとスマホでselect要素風とそうじゃない動きに切り分けるなどが必要な時にも使えると思います。

書き方

※jQueryを使用しています。

index.html

<ul>
  <li class="check" link="no1" style="display: list-item;">その１</li> // linkの値と、pタグのクラスを揃える
  <li link="no2">その２</li>
  <li link="no3">その３</li>
  <li link="no4">その４</li>
  <li link="no5">その５</li>
</ul>

<p class="no1">テキスト１</p>
<p class="no2">テキスト２</p>
<p class="no3">テキスト３</p>
<p class="no4">テキスト４</p>
<p class="no5">テキスト５</p>

style.css

ul {
  width: 200px;                   /* セレクトボックスの横幅 */
  border: solid 1px #333;         /* 見やすく境界線を引く */
  position: absolute;             /* 選択肢が開いた時に高さが変わるので指定 */
  top: 0px;                       /* 好きな位置に */
  left: 0px;                      /* 好きな位置に */
}
ul li {
  padding: 5px 10px 5px 20px;     /* optionの余白と同等 */
  display: none;                  /* 最初は非表示 */
  list-style: none;               /* 「・」を非表示にする */
}
ul li.check {
  color: #fff;                    /* 選択されたもののみ装飾 */
  font-weight: bold;              /* 選択されたもののみ装飾 */
  background: #999;               /* 選択されたもののみ装飾 */
}

p {
  display: none;                  /* 最初は非表示 */
  margin-left: 220px;             /* セレクトボックスとかぶらないように位置調整 */
}

script.js

$(function () {
  var click_flg = true;                   // クリックを許可する変数を設定
  $('.check').show();                     // ページ読み込み時、任意のselect1つだけ表示
  $('.no1').show();                       // ページ読み込み時、任意のテキスト1つだけ表示
  $('ul li').on('click', function(){      // セレクトボックスのどれかがクリックされた時
    if(click_flg){                        // クリックが許可されているかどうか
      click_flg = false;                  // ボタンを一時的に無効
      $('ul li').removeClass('check');    // 全てのliからcheckを削除してから、
      $(this).addClass('check');          // 選択されたものにcheckのクラスを付ける
      $('ul li').not('.check').fadeToggle(400, function() { // check以外の表示と非表示を切り替える
        click_flg = true;                   // コールバック関数を使い、アニメーションが終わってからtrueにするように指定
      });
      $('p').hide();                        // pを全て非表示
      $('.' + $(this).attr('link')).show(); // selectされているlinkと同じクラスをもつpだけ表示
    }
  });
});