レスポンシブサイズの画像の幅が変わらない

Question

前提・実現したいこと

すみません、初歩的な質問で悩んでおります。
レスポンシブデザインで解決できません。
画像のクラスにwidth:〇〇px;と記述しても反映されません。

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

画像の幅の指定をしても反映されない

該当のソースコード

sample.html
<div class="mt-3 d-flex flex-sm-column col-12 justify-content-center">
              <div class="campus col-6 col-md-12 m-sm-12">
                <img src="{{ asset('/images/campus.jpg') }}" class="campus-image img-thumbnail img-fluid mt-1" >
                <p class="campus-text text-dark">写真1</p>
              </div>

              <div class="bukatsu col-6">
                <img src="{{ asset('/images/sample.jpg') }}" class="sample-image img-thumbnail img-fluid mt-1 mx-auto ">
                <p class="bukatsu-text text-white">写真2</p>
              </div>
            </div>

/* ナビゲーション 750px以下のcss */
@media screen and (max-width: 750px) {
  .campus {
    position: relative;
    margin: auto;
  }
  
  img.campus-image {

    height: 500px;

  }
  .campus-text {
    font-size: 15px;
    font-weight: bold;
    position: absolute;
    top: 12%;
    left: 40%;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
  }

試したこと

img.campus-image {
    width:200px;
    height: 500px;

  }

と記述しても変化がありませんでした。また、他のクラスに同様のことをしても反映されませんでした。
col-12のグリッドシステムが原因でしょうか?

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Comments

[hatena19]

BootStrap を使っているのでしょうか。ならば、タグにBootStrapを追加してください。また、BootStrapのバージョンも質問に追記してください。
あと、現状のレイアウトと理想のレイアウトを画像で提示してもらうと回答が付きやすいかと。

Answer 1

デベロッパーツールなどを使用して他のcssが邪魔していないか確認されてますでしょうか。