aタグのリンクが機能しません。

前提・実現したいこと

aタグのリンクが機能しないので、なんとかしたいです。
↓コーディングの途中でまだ未完成ですが、このサイトです。
このサイト

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

ヘッダーのナビ部分のリンクが機能しません。
ヘッダーのナビとは↓これのTOP ABOUT SERVICE WORKS...というところです。
ヘッダーのナビはこれ

ホバーしても指のマークにならないですし、クリックできません。
さらに、リンク部分をダブルクリックすると、上の方に、謎の大きい青いリンクしたときに表示される四角い部分が表示されます。これがなぜなのかわからないですが、解決へのヒントになるのではないかと思います。
↓青い四角いものはこれです。（下のリンク先の画像ではグレーになっていますが、ダブルクリックしたときは青の四角になっています）
これ

該当のソースコード

html
1<header class="header position-relative z-1">
2        <h1>
3            <img src="img/index/top-h1-logo.png" srcset="img/index/top-h1-logo.png 1x,img/index/top-h1-logo@2x.png" alt="mirai image ロゴ">
4        </h1>
5        <nav class="pc">
6            <ul class="flex jcsb">
7                <li>
8                    <a href="index.html">
9                        TOP
10                    </a>
11                </li>
12                <li>
13                    <a href="about.html">
14                        ABOUT
15                    </a>
16                </li>
17                <li>
18                    <a href="service.html">
19                        SERVICE
20                    </a>
21                </li>
22                <li>
23                    <a href="">
24                        WORKS
25                    </a>
26                </li>
27                <li>
28                    <a href="">
29                        VOICE
30                    </a>
31                </li>
32                <li>
33                    <a href="">
34                        NEWS
35                    </a>
36                </li>
37                <li>
38                    <a href="archive.html">
39                        BLOG
40                    </a>
41                </li>
42                <li>
43                    <a href="">
44                        CONTACT
45                    </a>
46                </li>
47            </ul>
48        </nav>
49        <div class="sns-link pc">
50            <ul>
51                <li>
52                    <a href="">
53                        <img src="img/index/instagram-logo.svg" alt="インスタグラムロゴ">
54                    </a>
55                </li>
56                <li>
57                    <a href="">
58                        <img src="img/index/facebook-logo.svg" alt="フェイズブックロゴ">
59                    </a>
60                </li>
61                <li>
62                    <a href="">
63                        <img src="img/index/twitter-logo.svg" alt="ツイッターロゴ">
64                    </a>
65                </li>
66                <li>
67                    <a href="">
68                        <img src="img/index/line-logo.svg" alt="ラインロゴ">
69                    </a>
70                </li>
71                <li>
72                    <a href="">
73                        <img src="img/index/youtube-logo.svg" alt="ユーチューブロゴ">
74                    </a>
75                </li>
76                <li>
77                    <a href="">
78                        <img src="img/index/mic-logo.svg" alt="マイクロゴ">
79                    </a>
80                </li>
81                <li>
82                    <a href="">
83                        <img src="img/index/note-logo.svg" alt="ノートロゴ">
84                    </a>
85                </li>
86                <li>
87                    <a href="">
88                        <img src="img/index/cart-logo.svg" alt="カートロゴ">
89                    </a>
90                </li>
91            </ul>
92        </div>
93    </header>

css
1.header{
2    background:url(../img/index/top-header-bg@1.5x-80.jpg) no-repeat;
3    background-position:top center;
4    background-size:cover;
5    width:1600px;
6    max-width:100%;
7    margin:0 auto;
8    height:160vh;
9}
10@media screen and (min-width:1600px){
11    .header{
12        background:url(../img/index/top-header-bg-big@1.5x-80.jpg) no-repeat;
13        background-position:top center;
14        background-size:cover;
15        width:100%;
16        height:160vh;
17    }
18}
19@media screen and (max-width:640px){
20    .header{
21        background: url(../img/index/top-header-bg-sp@1.5x-80.jpg) no-repeat;
22        background-position:top center;
23        background-size:cover;
24        height:100vh;
25        width:100%;
26    }
27}
28.header h1{
29    position:absolute;
30    top:20px;
31    left:52%;
32    transform:translateX(-50%);
33}
34.header h1 img{
35    width:87%;
36}
37@media screen and (max-width:640px){
38    .header h1{
39        position:absolute;
40        top:50px;
41        left:100px;
42    }
43    /* .header h1 img{
44        width:60%;
45    } */
46}
47.header nav{
48    position:absolute;
49    top:580px;
50    left:50%;
51    transform:translateX(-50%);
52    width: 80%;
53    max-width:1350px;
54}
55@media screen and (min-width:1150px){
56    .header nav{
57        top:calc(580 / 1150 * 100vw);
58    }
59}
60.header nav ul li a{
61    font-family : 'AbeatbyKai',sans-serif;
62    font-size : 12px;
63    line-height : 52px;
64    letter-spacing : 6px;
65    color : #604C3F;
66}
67.header .sns-link{
68    position:absolute;
69    top:10%;
70    right:30px;
71}
72.sns-link ul li{
73    margin-bottom:50px;
74}
75.sns-link ul li:last-of-type{
76    margin-bottom:0;
77}
78.sns-link ul li a img{
79    width:26px;
80    height:26px;
81}