divタグをアコーディオン形式で開きたい

前提・実現したいこと

div内の画像をクリックするとアコーディオンの別のdivタグがあらわれるようにしたいです。

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

画像をクリックしてもアコーディオンが開きません。

該当のソースコード

html
1<body>
2    <h1>New York Stories</h1>
3    <a class="anchor" href="#">Scroll</a>
4    <!--start portfolio　details -->
5    <div class="menu">
6      <label class="label1" for="type1">
7    <div class="portfolio-detail-0"></div>
8  </label>
9  <input type="checkbox" id="type1" class="accordion">
10  <label class="slide" id="links1">
11  <div class="view-box"><p>aaa</p></div>
12  </label>
13  </div>
14
15  
16    <div class="portfolio-detail-1"></div>
17    <div class="portfolio-detail-2"></div>

scss
1* { 
2    box-sizing: border-box;
3  }
4  body {
5    font-family: Calluna, Arial, sans-serif;
6    background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url(file:///Users/ryoyokoyama/pythonBox/portfolio/img/portfolio-main.jpg);
7    background-repeat: no-repeat;
8    background-attachment: fixed !important;
9    background-size: cover !important;
10    background-position: center top !important;
11    padding: 1rem;
12    padding-top: 45%;
13    color: #fff;
14    z-index: 1;
15  }
16  
17  h1 {
18    font-size: 4rem;
19    text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
20    line-height: 1;
21    position: absolute;
22    top: 10px;
23    font-weight: 100;
24  }
25  p {
26    font-size: 1.3rem;
27    text-align: left;
28    line-height: 1.6;
29    margin-left: 8rem;
30    margin-right: 8rem;
31    color: #000;
32  }
33  h2 {
34    text-align: center;
35    text-transform: uppercase;
36    margin-bottom: 0;
37  }
38  span {
39    display: block;
40    margin: 0;
41    text-align: center;
42    font-size: 3rem;
43  } 
44  a {
45     
46        display: inline-block;
47        position: absolute;
48        right: 50vw;
49        bottom: 0;
50        z-index: 2;
51        padding: 10px 10px 110px;
52        overflow: hidden;
53        color: #fff;
54        font-size: 14px;
55        font-family: 'Josefin Sans', sans-serif;
56        line-height: 1;
57        letter-spacing: .2em;
58        text-transform: uppercase;
59        text-shadow: 0 0 7px rgba(0, 0, 0, 1) !important;
60        text-decoration: none;
61        writing-mode: vertical-lr;
62     
63      &::after {
64        content: '';
65        position: absolute;
66        bottom: 0;
67        left: 50%;
68        width: 1px;
69        height: 100px;
70        background: #fff;
71      }
72      &::before {
73        content: '';
74        position: absolute;
75        bottom: 0;
76        left: 50%;
77        width: 1px;
78        height: 100px;
79        background: rgba(255, 255, 255, .4);
80      }
81      &::after {
82        animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite;
83      }
84      @keyframes sdl {
85        0% {
86          transform: scale(1, 0);
87          transform-origin: 0 0;
88        }
89        50% {
90          transform: scale(1, 1);
91          transform-origin: 0 0;
92        }
93        50.1% {
94          transform: scale(1, 1);
95          transform-origin: 0 100%;
96        }
97        100% {
98          transform: scale(1, 0);
99          transform-origin: 0 100%;
100        }
101      }
102  }
103  div {
104    &.portfolio-detail-0 {
105        background-image:
106        url(file:///Users/ryoyokoyama/pythonBox/portfolio/img/portfolio-detail0.jpg);
107        height: 50vh;
108        width: 70vw;
109        background-size: cover;
110        position: relative;
111        top: 300px;
112        right: -25vw;
113        z-index: 2;
114    }
115    &.portfolio-detail-1 {
116        background-color: burlywood;
117        height: 50vh;
118        width: 70vw;
119        background-size: cover;
120        position: relative;
121        top: 550px;
122        right: -25vw;
123        z-index: 2;
124    }
125    &.portfolio-detail-2 {
126        background-color: burlywood;
127        height: 50vh;
128        width: 70vw;
129        background-size: cover;
130        position: relative;
131        top: 800px;
132        right: -25vw;
133        z-index: 2;
134    }
135    &.btn {
136    position: relative;
137    top: 1500px;
138    z-index: 3;
139        a {
140        &.btn--orange {
141            color: #fff;
142            background-color: #eb6100;
143          }
144          
145        &.btn--orange:hover {
146            color: #fff;
147            background: #f56500;
148          }
149          
150        &.btn-c {
151            font-size: 1.8rem;
152            position: relative;
153            padding: 1.5rem 2rem 1.5rem 2rem;
154            border-radius: 100vh;
155          }
156          
157        &.btn-c i.fa {
158            margin-right: 1rem;
159          }
160    }
161    }
162    
163    div {
164        label {
165            &.label1 {
166                display: block;
167                margin: 0 0 4px 0;
168                padding : 15px;
169                line-height: 1;
170                color :#fff;
171                background : green;
172                cursor :pointer;
173            }
174            div {
175
176            }
177        }
178        input {
179            display: none;
180            &#type1:checked ~ #links1 div {
181                height: 54px;
182                opacity: 1;
183            }
184        }
185        label {
186            &.slide {
187                margin: 0;
188                padding: 0;
189                background :#f4f4f4;
190                list-style: none;
191            }
192            div {
193                &.view-box {
194                    height: 0;
195                    overflow: hidden;
196                    -webkit-transition: all 0.5s;
197                    -moz-transition: all 0.5s;
198                    -ms-transition: all 0.5s;
199                    -o-transition: all 0.5s;
200                    transition: all 0.5s;
201                }
202            }
203        }
204    }
205  }

js
1var nystories = document.querySelector(".anchor").offsetTop;
2window.onscroll = function gradation() {
3  if (window.pageYOffset > 0) {
4 var opac = (window.pageYOffset / nystories);
5    console.log(opac);
6  document.body.style.background = "linear-gradient(rgba(51,102,102," + opac + "), rgba(0,51,51," + opac + ")), url(file:///Users/ryoyokoyama/pythonBox/portfolio/img/portfolio-main.jpg) no-repeat";
7  }
8}