Sassコンパイルのアウトプット先の位置がおかしい

前提・実現したいこと

Sassのファイルが自動的にコンパイルできる環境構築をおこなっていますが、ターミナルから「gulp sass」と打つことでコンパイルができてカレントディレクトリと同じ階層にcssディレクトリが作成されて、cssファイルがうまくコンパイルできます。

発生している問題・エラーメッセージ

しかし、sassファイルを常時監視するように設定したコマンドの「gulp sass:watch」コマンドをターミナルで打った後に、sassファイルを更新すると、なぜかsassディレクトリで更新したsassファイルのcssファイルが、sassディレクトリ内にコンパイルされてしまいます(以前に「gulp sass」コマンドでコンパイルしたcssディレクトリのファイルも更新はされます)。

常時監視する「gulp sass:watch」コマンドで、変更されたsassファイルがcssディレクトリ内にうまくコンパイルされるような設定方法がわからないので、ご教授いただきたいです。

該当のソースコード

javascript
1var gulp = require('gulp');
2var sass = require('gulp-sass');
3
4gulp.task('sass', function() {
5  return gulp.src('./sass/**/*.scss')
6    .pipe(sass({outputStyle: 'expanded'}))
7    .pipe(gulp.dest('./css'));
8});
9
10gulp.task('sass:watch', function() {
11  gulp.watch('./sass/**/*.scss', gulp.task('sass'));
12});