Spriteの生成を行えるようにした

以下のような構成を想定。

```text
public
├hoge
│  ├── css
│  ├── img
│  │   └── sprite.png           # 生成される画像ファイル
│  ├── index.html
│  ├── scss
│  │   ├── _sprite.scss         # 生成されるscssファイル
│  │   └── _sprite_retina.scss  # retina用にパラメータを弄ったファイルでリポジトリで管理
│  └── sprite                    # sprite用画像置き場
│      ├── comments2.png
│      ├── comments3.png
│      ├── comments4.png
│      ├── comments5.png
│      └── comments6.png
│
├ foo
│  ├── css
│  ├── img
：  ：
```

gulp.spritesmithがretina用のものは吐いてくれない？ので自分でパラメータを弄ったものを
予め `_sprite_retina.scss` として突っ込んであります。

ベースディレクトリを追加する場合は `gulpfile.js` 内の `config` に
新しいベースディレクトリを追記していけばOK。

現状 `sprite -> css` の順で処理が行われる用になっているけど、
spriteの処理が重くて待ってられない！なんてなった時はその時に分割すれば良いかなという感じです。