Fix font

Squash and merge the following commits into develop:
* fix: resolve disappearance Manrope font

src/pages/Layout.tsx

@@ -14,10 +14,10 @@ interface LayoutProps {
 
 const Layout = ({ children }: LayoutProps) => {
   return (
-    <div className={manrope.className}>
+    <main className={manrope.className}>
       <Navbar />
       {children}
-    </div>
+    </main>
   )
 }
 

src/pages/_app.tsx

@@ -1,6 +1,12 @@
 import type { AppProps } from 'next/app'
 import Head from 'next/head'
 import Layout from './Layout'
+import { Manrope } from 'next/font/google'
+
+const manrope = Manrope({
+  subsets: ['latin'],
+  weight: ['200', '300', '400', '500', '600', '700', '800'],
+})
 
 import GlobalStyle from '@/styles/GlobalStyle'
 
@@ -24,6 +30,11 @@ export default function App({ Component, pageProps }: AppProps) {
           href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css"
         /> */}
       </Head>
+      <style jsx global>{`
+        html {
+          font-family: ${manrope.style.fontFamily};
+        }
+      `}</style>
       <Layout>
         <Component {...pageProps} />
       </Layout>