シリウスレスポンシブテンプレートに備えあるスマートフォン対応のメニュー表示仕様の
ハンバーガメニューのカラーはサイト全体に合わせておりますね。

ま、スマートフォンでグローバルナビゲーションは認識ずらくなるのでその対応として世間一般で
つかわれるデザインでしょうからそれはそれでよいのですが、ヘッダー画像の色合いによっては
さてと？どこにあるのやらとなってしまうこともあるようです..

こんな感じでしょうか？..当サイトの過去例...

読者様に、見ずらいよと指摘を受けるまで気が付かなかった...んです..

そうなんですよね...

で、サポートへもどこをどうすれば色替えできるのかと追加質問受けて記事を追加となりました...

皆さんも同様の悩みがありましたらカラー変更で見やすくする手立てとして参考にしてください..

細かな解説は省きますが、要所を指示しておきますので、書き換えればよいだけです..

スタイルシートの指示項目を確認して下さい...

以下...

初期で何も書き足していなければ、582番目付近から下

変更箇所を確認してくださいね...

@media screen and (max-width: 640px) {
#nav {
border-bottom: none;
background-color: none;
}
#topmenubox {
padding: 0;
position: relative;
margin: 0;
}
#topmenubox #topmenubtn {
color: #333333;/*ハンバーガーの下　MENUの変更はここです*/
cursor: pointer;
display: block;
font-size: 10px;
height: 20px;
padding-top: 15px;
position: absolute;
right: 10px;
text-align: center;
top: -45px;
width: 40px;
}
#topmenubox #topmenubtn:before {
border-bottom: 3px solid #333333;/*ＨＢ　カラー指定　ここです*/
border-top: 3px solid #333333;/*ＨＢ　カラー指定　ここです*/
content: "";
height: 3px;/*サイズ指定*/
left: 7px;/*サイズ指定*/
position: absolute;
top: 0;
width: 26px;
}
#topmenubox #topmenubtn:after {
border-top: 3px solid #333333;/*ＨＢ　カラー指定　ここです*/
content: "";
height: 0;
left: 7px;
position: absolute;
top: 12px;
width: 26px;
}

以下でも細かな指示を出していますが、何となくどこをどうすればとか？
自己努力でお願いします..

#topmenu ul {
display: none;
table-layout: auto;
margin: 0;
padding: 0;
}
#topmenu ul.menuon {
display: block;
}
#topmenu li {
border-bottom: 1px solid #777777;
display: block;
text-align: left;
}
#topmenu li:last-child {
border-bottom: none;
}
#topmenu li a {
color: #fff;
padding: 8px 45px 8px 20px;
position: relative;
text-align: left;
}
#topmenu li a:before {
border-bottom: none;
border-left: none;
border-right: 2px solid #ffffff;
border-top: 2px solid #ffffff;
background-color: transparent;
height: 5px;
margin-top: -4px;
right: 20px;
top: 50%;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
width: 5px;
}
#topmenu li:first-child a:after {
background-color: transparent;
left: 0;
width: 0;
}
#topmenu li:last-child{
border-right: none;
}
}

MENU（テキスト）のカラー変更

ハンバーガーアイコンの下に表示するMENUのカラーはスタイルシートですが、フォントスタイル
を変えるか？テキストそのものを変更する際はＨＴＭＬで書き換えます...

ＨＴＭＬテンプレートソースより以下項目をお探しください...

<% topMenu2 | tag_put(<div id="topmenubtn">MENU</div>) | tag_insert(div id="topmenubox") | tag_insert(div id="nav") %>

変更は、MENUを書き換えるだけです...

サイズも項目の数値指定を変更で変えることができます...

今日はここまで...何かしら気が付きましたら記事追加します...

ハンバーガーメニューのカスタマイズ
グローバル　ナビゲーションカスタマイズまとめ
トップページ

関連ページ

グローバルナビ、背景カラーとフォントカラーの変更方法

シリウスレスポンシブ構造標準のグローバル　ナビ 背景カラー、フォントカラーの変更方法の解説

ハンバーガーメニューの固定化？

シリウスレイアウトがスマートフォンサイズに縮小するとＧナビはハンバーガーデザインに切り替わりますが、スクロールオンでも位置固定、いつでもメニューをオープンできる状態にする指定方法。

ハンバーガーメニューからドロワースタイルに可変させる手順

シリウス風のハンバーガーデフォルト形式何ですが、横から滑り表示するメニュー一覧（drawer）を設定する手順のご案内です。