CSSの修正方法を教えて下さい。

＃ 回答のコメントに書いちゃうと、rouge_2008 さんのコメントが折りたたまれちゃうので、こちらに。

https://developer.mozilla.org/ja/docs/Web/Guide/CSS/Understanding_z_index/The_stacking_context
これを読んで、何となく分かったような気にもなったのですが、

#menutop-wrapper に z-index を指定して、コンテンツのタブの部分に、それよりも大きい z-index を指定すると、やっぱりメニューがタブの下に潜り込みます。

div#menutop-wrapper　　z-index: 20;
div#columns-wrapper
　　div#p7TP3tabs_1　　z-index: 30;

タブの親である #columns-wrapper に位置指定や、#menutop-wrapper よりも小さい z-index を指定しても、やっぱりメニューがした。

"stacking context" という言い方をわざわざしているから、要素の階層構造とはまた違った何かなのかなあ...

やっぱり、よく分からんです　(´・ω・｀)

私もまだよく分かっていませんが、質問者さんのサイトだと説明とは違う動作に見えますね・・・
関連ページのリンクにありますが、次のページに参考になる情報があるかもしれません。(※私は未読ですが。)

・CSS の z-index の理解 - CSS | MDN
https://developer.mozilla.org/ja/docs/Web/CSS/Understanding_z_index

※以下、「4.スタックの文脈 : スタック文脈についての覚書」で、シンプルな例が紹介されています。
残念ながら画像なのでソースの確認ができませんが、「DIV #3 (z-index:4)」が子要素(z-index:6の要素)も含めて丸ごと「DIV #1 (z-index:5)」の下になっています。

・スタック文脈 - Web developer guide | MDN
https://developer.mozilla.org/ja/docs/Web/Guide/CSS/Understanding_z_index/The_stacking_context


上記が仕様上の正しい動作だと思いますので、質問者さんのサイトの場合、他にも影響している親要素があるのかもしれません。

「div#columns-wrapper」はスタック文脈になる条件のどれにも該当しないようです。
「z-index」を追加するだけでなく、位置指定で「relative」を指定すると想定した動作になります。(※「位置指定されていて（absolutely か relatively）、z-index 値が "auto" 以外の要素」に該当するため)

うっかりしていて気がつきませんでした・・・

むずかしいなあ、これ。

css プロパティの継承は、ブラウザの開発環境でたどれるようになったけれど、これは目視ですもんね。
一から自分で作るときにはまだしも、パーツを組み合わせて作るようなときは、ちょっときついですね。

ほとんど確認しないので分からないんですが、最近何かCSS関連の新機能が追加されたんですか？
スタック文脈の描画順位も一覧表示される機能ができるといいですね。

回答とコメント、本当にありがとうございます。

やり取りのレベルが高度すぎて、どうすべきか決められないので、まずはa-kuma3さんにいただいた回答を試してみます。

実はこのメニュー、下だけではなく、横に展開した際も右側の枠の下に潜り込んでしまいます。この点については、改めて別に質問させていただきます。どうぞよろしくお願いします。

.p7TP3-05 .p7TP3tabs_05 {
position: relative;
/* z-index: 10; これを無効にする */
overflow: hidden;
zoom: 1;
border-top: 1px solid #9CBCBC;
border-right: 1px solid #9CBCBC;
border-left: 1px solid #9CBCBC;
}

上記のように、該当箇所を無効にしたのですが、何故でしょう、直りません。

他に説明いただいた方法も試してみます。

.menutop-wrapper {
background-color: #ffffff;
border-bottom: 1px solid #000;
box-shadow: 0px 0px 30px #999;
position: relative;
z-index: 10;
text-align: center;
padding: 5px;
}

rouge_2008さんに、教えていただいたように
z-index:11　にすると治りました。（ローカル上です。まだアップしてません。）

これで良いのでしょうか？

はい、「.menutop-wrapper」の「z-index」を「11」以上に指定すれば大丈夫です。
※削除しても同様に解決しますが、子要素の重なり順を指定する必要があって指定しているのかもしれませんので、そちらの方法がいいと思います。


※a-kuma3さんの回答ですが、タブメニューの「z-index」指定を変更する方法は、他にも2か所ほど変更する必要があるようです。
同じく子要素の重なり順を指定する必要があって加えたスタイルかもしれませんので、こちらの方法にする場合も、「z-index」指定は残して数値を変更するようにした方がいいと思います。

3か所変更するのはちょっと面倒かもしれませんので、上記コメント内で出ているそれぞれの親要素の重なり順を指定する方法を試してみてください。(※タブメニューを含むコンテンツエリアの重なり順をメニューより下にします。)

「.menutop-wrapper」は「10」のままで大丈夫です。(※変更なし)
「.columns-wrapper」は「9」以下にして、位置指定を加えます。

.columns-wrapper {
position: relative;
z-index: 9;
}

消す方は上手く動いてないですね　(´・ω・｀)
いじっているうちに、他にも書き換えたところがあったのが分からなくなっちゃったか。
z-index を 0 にする方なら動きます。

.p7TP3-05 .p7TP3tabs_05 {
z-index: 0;
}

＃ まあ、rouge_2008 さんので解決してるから良いか