bootstrapのcssの変更のやり方を教えて頂きたいです。（初心者で申し訳ございません）

Question

基本的な質問で大変申し訳ございません。
実アプリで一部CSSが崩れてしまっておりまして、なかなか治すことができず
数時間が経過してしまいました・・・。
簡単なご質問で恐縮ですが、どなたか教えて頂けると嬉しいです。

現在　bootstrap 4.6　を使用しています。

bootstrapのアコーディオンで実装された箇所のCSSを一部変更したいのですが、
なぜか反映がされません。

###変えたいCSS
google chlomeの検証で

.accordion > .card > .card-header {
    border-radius: 0;
    margin-bottom: -1px;
}

と表示されている内、margin-bottom: -1px;を0pxにしたいです。

###やってみたこと

.card-header {
    margin-bottom: 0px;
}

.accordion.card.card-header {
    margin-bottom: 0px;
}

といったことを試しておりますが、反映がされません。
どのようにすれば良いのでしょうか？

###追記HTML

<div class="accordion" id="accordion" role="tablist" aria-multiselectable="true">
　<h4 class="QA_title">このサイトについて</h4>
 　<div class="card card1">
　 　<div class="card-header card-header1" role="tab" id="headingOne">
　　　 <h5 class="mb-0">
　　　　 <a class="text-body d-block p-3 m-n3" data-toggle="collapse" 
　　　　　href="#collapseOne" role="button" aria-expanded="false" 
　　　　　aria-controls="collapseOne">
　       サイトの目的は何ですか？
      　</a>
　　 　</h5>
　　 </div><!-- /.card-header -->

　　 <div id="collapseOne" class="collapse" role="tabpanel" 
　　　　　 aria-labelledby="headingOne" data-parent="#accordion">
　　 <div class="card-body">
　　 　サイトの目的は・・・
　 　</div><!-- /.card-body -->
　 </div><!-- /.collapse -->
 </div><!-- /.card -->
</div>

どうぞよろしくお願い申し上げます。

※HTMLを追記させていただきました。

Comments

[naUc]

念のため、対象のHTMLも合わせてご提示いただけますか？
CSSのセレクタ設定に誤りがあるかと思います。

[akikko]

ありがとうございます。
大変嬉しいです。
HTMLの追記をさせて頂きました。

[naUc]

いえいえ。ライブラリや、ページ数が多くなってきますとCSSも複雑になってきますので、
「CSSセレクタ」勉強するといいかと思います。

Answer 1

CSSには詳細度というものがありまして、要素の記述方法によってスタイルの優先度が変更されます。
クラス名にそれぞれスペース抜けてますね、これでどうでしょう。

.accordion .card .card-header {
    margin-bottom: 0;
}

Comments

[akikko]

こちら、コメント入れさせて頂いたと思っていたのですが、できておりませんようでして大変申し訳ございませんでした。
頂きました内容でできました！初心者的な間違いにも関わらず、分かりやすく教えて下さりありがとうございました。

[naUc]

わざわざありがとうございます。
解決できてよかったです。自分も昔、そういったミスはやってました。
CSSセレクタも勉強してみると細かいスタイル適用が使えるようになりますよ。

[akikko]

ありがとうございます！
CSSセレクタも勉強させて頂きます！

[naUc]

って、前も同じこと言ってますね.
しつこくてすみません、失礼しました！