summary

juliecogley · Mar 30, 2024 · 229b0bc · 229b0bc
1 parent 0efb7d7
commit 229b0bc
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 28 deletions.
diff --git a/css/top.css b/css/top.css
@@ -1,24 +1,37 @@
 @charset "UTF-8";
-
+.header{
+height: 0vh;
+}
+.header-content-wrapper{
+padding: 50px 24px;
+}
 
 @media(min-width:1060px) {
-	#nav-open{
+	#nav-open {
 		top: -65px;
 	}
-	
+
 }
+
 .contents-rectangle {
 	display: none;
 }
 
 .section-top {
-	margin: 40px 0 160px 0;
 	position: relative;
+	top: -80px;
+	z-index: -1;
+}
+
+
+.section-top__image-container1 {
+	width: 100%;
+	height: 30vh;
 }
 
-.section-top__image {
+.section-top__image-container2 {
 	width: 100%;
-	height: 100px;
+	height: 15vh;
 }
 
 .section-top__image-1,
@@ -34,7 +47,7 @@
 
 .section-top__image-1 {
 	background-image: url("../img/00top/utuwa_blue.JPG");
-	
+
 }
 
 .section-top__image-2 {
@@ -53,8 +66,7 @@
 	overflow: hidden;
 	display: flex;
 	width: 100vw;
-	padding-top: 10px;
-	padding-bottom: 10px;
+	height: 6vh;
 	margin-inline: calc(50% - 50vw);
 }
 
@@ -125,12 +137,10 @@
 
 
 @media(min-width:1060px) {
-	.section-top {
-	margin: 80px 0 160px 0;
-}
-.section-top__image {
-	height: 200px;
-}
+
+	.section-top__image {
+		height: 200px;
+	}
 
 	.section-top__name h1 {
 		font-size: 13rem;
@@ -183,16 +193,17 @@
 }
 
 @media(min-width:1060px) {
-	.text-container{
-width: 100%;
+	.text-container {
+		width: 100%;
 
 
 	}
+
 	.text1 {
 		position: absolute;
 		bottom: 380px;
 		left: 60%;
-		width:  110px;
+		width: 110px;
 		height: auto;
 	}
 
@@ -201,24 +212,28 @@ width: 100%;
 		position: absolute;
 		bottom: 250px;
 		left: 40%;
-		width:  110px;
+		width: 110px;
 		height: auto;
 	}
 
 	.text3 {
 		position: absolute;
 		bottom: 120px;
 		left: 60%;
-		width:  110px;
+		width: 110px;
 		height: auto;
 	}
 
 	.text4 {
 		position: absolute;
 		bottom: -10px;
 		left: 40%;
-		width:  110px;
+		width: 110px;
 		height: auto;
 	}
 
+}
+
+.footer {
+	display: none;
 }
diff --git a/index.html b/index.html
@@ -82,7 +82,7 @@
   </header>
   <main class="main">
     <div class="section-top">
-      <div class="section-top__image">
+      <div class="section-top__image-container1">
         <div class="section-top__image-1"> </div>
       </div>
       <div class="loop03__box no-tick js-tick">
@@ -106,7 +106,7 @@
         <p class="loop03__item js-tick-item"></p>
       </div>
 
-      <div class="section-top__image">
+      <div class="section-top__image-container2">
         <div class="section-top__image-2"> </div>
       </div>
       <div class="loop03__box no-tick js-tick">
@@ -165,7 +165,7 @@
           その実は何の実なのかもわからないままである。　　　　　　　
         </p>
       </div>
-      <div class="section-top__image">
+      <div class="section-top__image-container2">
         <div class="section-top__image-3"> </div>
       </div>
       <div class="loop03__box no-tick js-tick">
@@ -195,17 +195,17 @@
         </p>
 
         <p class="loop03__item js-tick-item"></p>
-      </div>      <div class="section-top__image">
-
-
+      </div>      
+      <div class="section-top__image-container1">
         <div class="section-top__image-4"> </div>
       </div>
+      <!-- 
       <div class="section-top__name">
           <img class="text1" src="img/00top/中.svg"  alt="naka">
           <img class="text2" src="img/00top/原.svg" alt="hara">
           <img class="text3" src="img/00top/菜.svg" alt="na">
           <img class="text4" src="img/00top/海.svg" alt="mi">
-      </div>
+      </div> -->
     </div>
   </main>
   <footer class="footer">