nth-child(n)とnth-of-type(n)の違い〜CSS3

CSS3から追加されたn番目の子要素を指定できるnth-child(n)とnth-of-type(n)の違いです。
nth-child(n)は、ある親要素の全ての子要素の中のn番目の子要素を表します。
nth-of-type(n)はある親要素の中で兄弟関係にある同じ種類の要素の中のn番目の要素です。

nth-child(n)とnth-of-type(n)の違いは数え方の違いです。
nth-child(n)は違う種類の要素を含めて同じ階層の中で何番目の子供か数え、nth-of-type(n)は同じ種類の子供の何番目か数えます。

図解するとこんな感じです。

nth-child(n)のサンプル
nth-of-type(n)のサンプル

#main p:nth-of-type(2){
	color:blue;
}
#main p:nth-child(5){
	color:red;
}

<div id="main">
      <h2>CochoCochoについて</h2>
      <p class="first">CochoCochoは、チョコ好きの心をくすぐるようなチョコレートを手作りしたり、世界中を旅して集めた「めずらしいチョコ」や「Happyなチョコ」をご提供させていただきます。<br>また、四季を通してチョコレートのイベントを開催してチョコ好きのコミュニティーの場を提供させていただきます。</p>
      <h2>四季折々のイベント</h2>
      <ul id="fest">
      	<li>世界チョコレート博覧会</li>
        <li>星がきらめくチョコレートな夜</li>
        <li>チョコの紅葉</li>
        <li>白い変人たち</li>
      </ul>
      <p>CochoCochoでは、春、夏、秋、冬と、四季折々のチョコレートイベントを楽しむことができます。 <br />
      春は、「世界チョコレート博覧会」。夏の夜に開催される「星がきらめくチョコレートな夜」。秋には、赤や黄色に染まり色鮮やかな紅葉に包まれまた森をイメージしたカラーリングチョコの大会「チョコの紅葉」。そして冬は、雪に覆われた一面の銀世界をイメージしたホワイトチョコの響宴「白い変人たち」を開催しています。</p>
    </div>