fix: メインビジュアルをレスポンシブにリサイズ

Author: yamageji

apps/web/app/components/TopPageSection.vue

@@ -21,7 +21,8 @@ const getAnchorPath = computed(
         <p class="place">
           Otemachi PLACE HALL &amp; CONFERENCE
           <br /><time datetime="2024-10-19T00:00+09:00"
-            >{{ $t('top_page.date') }}<template v-if="locale === 'ja'"><span class="day-of-week">SAT</span></template></time
+            >{{ $t('top_page.date')
+            }}<template v-if="locale === 'ja'"><span class="day-of-week">SAT</span></template></time
           >
         </p>
       </div>
@@ -80,6 +81,7 @@ const getAnchorPath = computed(
   z-index: -1;
   width: 100%;
 }
+
 .image-wrapper {
   position: relative;
   width: 100%;
@@ -149,8 +151,8 @@ const getAnchorPath = computed(
   }
   .image-wrapper {
     background-size: auto 100%;
+    background-image: url('/main-visual-tablet.png');
   }
-
   .section-title {
     font-size: var(--font-size-heading500);
     font-weight: 700;
@@ -179,6 +181,9 @@ const getAnchorPath = computed(
 }
 
 @media (--mobile) {
+  .image-wrapper {
+    background-image: url('/main-visual-mobile.png');
+  }
   .day-of-week {
     font-size: var(--font-size-body100);
   }