display: -ms-flexbox;について

分からないこと
・Vscodeでsassを使ってコードを書いています。
毎回,
flexBoxを使うと、
display: -ms-flexbox;とコンパイルされたstyle.cssに表記され、ここがエラー表示されます。
何が原因なのでしょうか？

・やったこと
display: -ms-flexbox;と
[CSSTree] Invalid value for display propertyで検索しますが、エラー表示解消のページが出てきません

原因をおしえていただけると幸いです。

この原因はどんな原因があるのでしょうか？

HTML
1 <header class="header">
2        <div class="image_word">
3            <img src="image/logo_transparent.png" id="logo" alt="Coding Practice">
4        </div>
5        <div class="header-wrapper">
6        <nav class="header-nav"> 
7            <ul class="header-list">
8                <li class="list-item"> <a href="#">Top</a></li>
9                <li class="list-item"><a href="#">My Challenge</a></li>
10                <li  class="list-item"><a href="#">Just Continue</a></li>
11            </ul>
12         </nav>
13         </div>
14
15    </header>
16

CSS
1.header {
2  max-width: inherit;
3  height: 80px;
4  display: -webkit-box;
5  display: -webkit-flex;
6  display: -ms-flexbox;
7  display: flex;
8}

SCSS
1.header{
2    max-width: inherit;
3    height: 80px;
4    display: flex;
5    .image_word{
6        display: flex;
7        margin: 20px 0;
8        margin-left: 213px;
9        
10    }
11    .header-wrapper{
12        align-content: flex-end;
13        padding-right: 213px;
14        margin: auto;
15        justify-content: space-around;
16        //display: flex;
17        .header-nav{
18            
19
20            .header-list{
21                display: flex;
22                margin: 31px;
23                align-items: center;
24                
25
26                .list-item{
27                    
28                    +.item{
29                        margin-left: 20px;
30                    }
31
32                    >a{
33                        color: #333333;
34                        justify-content: space-between;
35
36
37                    }
38
39                }
40            }
41        }
42    }
43}