diff --git a/public/images/fullbody.png b/public/images/fullbody.png
deleted file mode 100644
index fdb892b..0000000
Binary files a/public/images/fullbody.png and /dev/null differ
diff --git a/public/images/fullbody.webp b/public/images/fullbody.webp
new file mode 100644
index 0000000..e097ee6
Binary files /dev/null and b/public/images/fullbody.webp differ
diff --git a/public/images/title.png b/public/images/title.png
deleted file mode 100644
index 3e8c57d..0000000
Binary files a/public/images/title.png and /dev/null differ
diff --git a/public/images/title.webp b/public/images/title.webp
new file mode 100644
index 0000000..55706c0
Binary files /dev/null and b/public/images/title.webp differ
diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index d490b3b..a84b32e 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -20,7 +20,7 @@ const jsonLd: WithContext<JsonLDArticle | JsonLDWebPage> = {
   },
   image: {
     '@type': 'ImageObject',
-    url: 'https://arane.uniproject-tech.net/images/title.png',
+    url: 'https://arane.uniproject-tech.net/images/title.webp',
     license: "https://arane.uniproject-tech.net/license",
     acquireLicensePage: "https://arane.uniproject-tech.net/license",
     creditText: "ramura 2024",
@@ -42,7 +42,7 @@ export const metadata: Metadata = {
     siteName: '荒音の夜 - 現音令彼(あらねしむか)公式サイト',
     images: [
       {
-        url: 'https://arane.uniproject-tech.net/images/title.png',
+        url: 'https://arane.uniproject-tech.net/images/title.webp',
         width: 800,
         height: 600,
       }
@@ -60,7 +60,7 @@ export default function Home() {
         type="application/ld+json"
         dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
       />
-      <main className="flex min-h-screen items-center justify-center bg-[#1f1f1f] text-white bg-[url('../images/wipe.png')]">
+      <main className="flex min-h-screen items-center justify-center text-white bg-custom-gradient">
         <div id="about-desc" className="m-9 p-9">
           <h1 className="text-6xl font-bold">About</h1>
           <ul className="text-1xl leading-6 p-4">
@@ -88,7 +88,7 @@ export default function Home() {
         </div>
         <Image
           className="leading-none m-0 p-0"
-          src="/images/fullbody.png"
+          src="/images/fullbody.webp"
           alt="logo"
           width={500}
           height={0}
diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index ce5c4d5..01bf5b4 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -11,7 +11,7 @@ export const metadata: Metadata = {
     siteName: '荒音の夜 - 現音令彼(あらねしむか)公式サイト',
     images: [
       {
-        url: 'https://arane.uniproject-tech.net/images/title.png',
+        url: 'https://arane.uniproject-tech.net/images/title.webp',
         width: 800,
         height: 600,
       }
diff --git a/src/app/download/page.tsx b/src/app/download/page.tsx
index f2c9dba..eef72d7 100644
--- a/src/app/download/page.tsx
+++ b/src/app/download/page.tsx
@@ -1,4 +1,4 @@
-//<a href="download?file=foo.png">Download</a>
+//<a href="download?file=foo.webp">Download</a>
 import Image from "next/image";
 import { Button } from "@/components/button-legacy";
 import { Metadata } from "next";
@@ -14,7 +14,7 @@ export const metadata: Metadata = {
     siteName: '荒音の夜 - 現音令彼(あらねしむか)公式サイト',
     images: [
       {
-        url: 'https://arane.uniproject-tech.net/images/title.png',
+        url: 'https://arane.uniproject-tech.net/images/title.webp',
         width: 800,
         height: 600,
       }
@@ -26,15 +26,16 @@ export const metadata: Metadata = {
 
 export default function Home() {
   return (
-    <main className="flex min-h-screen p-0 m-0 justify-center items-center bg-[#1f1f1f] bg-[url('../images/wipe.png')]">
+    <main className="flex min-h-screen p-0 m-0 justify-center items-center bg-custom-gradient">
       <div>
         <h1 className="text-4xl text-white font-bold">Download</h1>
         <p className="text-white">
           ダウンロードする前に、一度、利用規約をお読みください。<br />
-          なお、特殊音源に関しては、単体では使用できません。特殊音素のエイリアスはEです。
+          なお、特殊音源に関しては、単体では使用できません。<br />
+          特殊音素のエイリアスはEです。
         </p>
         <br />
-        <div className="flex">
+        <div className="flex flex-wrap">
           <Button<"Link">
             href="/download/dl-endpoint?file=tandokuon.zip"
             className="mt-4"
@@ -62,11 +63,10 @@ export default function Home() {
             特殊音源
           </Button>
         </div>
-
       </div>
       <Image
         className="leading-none m-0 p-0"
-        src="/images/fullbody.png"
+        src="/images/fullbody.webp"
         alt="logo"
         width={500}
         height={0}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 04d3b39..7f57d3d 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -26,7 +26,7 @@ export default function RootLayout({
             <a href="/">
               <h1 className="text-2xl font-bold">
                 <Image
-                  src="/images/title.png"
+                  src="/images/title.webp"
                   alt="荒音の夜(サイトロゴ)"
                   width={100}
                   height={100}
diff --git a/src/app/license/page.tsx b/src/app/license/page.tsx
index 5e568b3..834053e 100644
--- a/src/app/license/page.tsx
+++ b/src/app/license/page.tsx
@@ -11,7 +11,7 @@ export const metadata: Metadata = {
     siteName: '荒音の夜 - 現音令彼(あらねしむか)公式サイト',
     images: [
       {
-        url: 'https://arane.uniproject-tech.net/images/title.png',
+        url: 'https://arane.uniproject-tech.net/images/title.webp',
         width: 800,
         height: 600,
       }
@@ -48,69 +48,69 @@ export default function Home() {
         ３．利用者は、自己の責任において本サービスを利用しなければなりません。<br />
       </div>
       <h2 className="text-3xl py-2">第３条（禁止事項）</h2><div className="leading-6">
-      本サービスのご利用にあたって、以下の行為を行ってはいけません。
-      １．公序良俗に反する作品の制作または投稿<br />
-      ２．他人の知的財産権、プライバシー権、名誉権、その他の権利を侵害する行為<br />
-      ３．虚偽の情報を提供する行為<br />
-      ４．政治的または宗教的な意味合いを含む作品の製作（一般的な民俗行事においてはこの
-      限りではない）<br />
-      ５．本サービスを AI 等の機械学習に本サービスを用いる行為<br />
-      ６．本サービスを商用的な活動や法人の活動に利用すること<br />
-      ７．本サービスを使用して、違法な行為や犯罪行為に関与すること<br />
-      ８．本サービスの一部または全部を複製、天才、改変、リバースエンジニアリング、逆コ
-      ンパイル、逆アセンブルする行為<br />
-      ９．本サービスを不正に利用する目的で AI やその他の技術を使用する行為<br />
-      10. 法令または本規約に違反する行為、らむらが不適切と判断する行為</div>
+        本サービスのご利用にあたって、以下の行為を行ってはいけません。
+        １．公序良俗に反する作品の制作または投稿<br />
+        ２．他人の知的財産権、プライバシー権、名誉権、その他の権利を侵害する行為<br />
+        ３．虚偽の情報を提供する行為<br />
+        ４．政治的または宗教的な意味合いを含む作品の製作（一般的な民俗行事においてはこの
+        限りではない）<br />
+        ５．本サービスを AI 等の機械学習に本サービスを用いる行為<br />
+        ６．本サービスを商用的な活動や法人の活動に利用すること<br />
+        ７．本サービスを使用して、違法な行為や犯罪行為に関与すること<br />
+        ８．本サービスの一部または全部を複製、天才、改変、リバースエンジニアリング、逆コ
+        ンパイル、逆アセンブルする行為<br />
+        ９．本サービスを不正に利用する目的で AI やその他の技術を使用する行為<br />
+        10. 法令または本規約に違反する行為、らむらが不適切と判断する行為</div>
       <h2 className="text-3xl py-2">第４条（同人活動に関する特例）</h2><div className="leading-6">
-      １．利用者は、本サービスを利用して制作した作品を同人活動の一環として公開・頒布す
-      ることができます。<br />
-      ２．同人活動において、作品の制作や配布に必要な最低限の費用を補うため、作品の有料
-      頒布を行うことが出来ます。ただし、以下の条件を遵守するものとします。<br />
-      １．利用者は、商業的利用が最低限の運営費用を補う目的であることを確保すること。<br />
-      ２．現音の名称やロゴ、その他の識別情報を正しく明記すること。<br />
-      ３．他の利用者や第三者の権利を侵害しないこと。<br />
-      ４．公序良俗に反しないこと。<br />
-      ５．利用者は、法令および本規約を遵守し、同人活動を行うこと。<br />
-      ２．らむらは、同人活動に関連して生じた紛争について、いかなる責任も負いません。利用
-      者は、自己の責任でこれを処理し、らむらに損害を与えないものとします。</div>
+        １．利用者は、本サービスを利用して制作した作品を同人活動の一環として公開・頒布す
+        ることができます。<br />
+        ２．同人活動において、作品の制作や配布に必要な最低限の費用を補うため、作品の有料
+        頒布を行うことが出来ます。ただし、以下の条件を遵守するものとします。<br />
+        １．利用者は、商業的利用が最低限の運営費用を補う目的であることを確保すること。<br />
+        ２．現音の名称やロゴ、その他の識別情報を正しく明記すること。<br />
+        ３．他の利用者や第三者の権利を侵害しないこと。<br />
+        ４．公序良俗に反しないこと。<br />
+        ５．利用者は、法令および本規約を遵守し、同人活動を行うこと。<br />
+        ２．らむらは、同人活動に関連して生じた紛争について、いかなる責任も負いません。利用
+        者は、自己の責任でこれを処理し、らむらに損害を与えないものとします。</div>
       <h2 className="text-3xl py-2">第５条（権利関係）</h2><div className="leading-6">
-      １．本サービスおよび本コンテンツに関連する著作権、商標権その他の知的財産権は、全
-      てらむらまたは正当な権利者に帰属します。<br />
-      ２．利用者が本サービスを利用して作成した作品の著作権は、原則として利用者または既
-      存の権利者に帰属します。ただし、利用者は、らむらに対し、当該作品を本サービスの運
-      営・改善、宣伝・広報活動のために無償で利用する権利（複製、頒布、公衆送信、翻案等
-      を含む）を許諾するものとします。<br />
-      ３．利用者は、前項に基づくらむらの著作権の利用に関して、著作者人格権を行使しないも
-      のとします。</div>
+        １．本サービスおよび本コンテンツに関連する著作権、商標権その他の知的財産権は、全
+        てらむらまたは正当な権利者に帰属します。<br />
+        ２．利用者が本サービスを利用して作成した作品の著作権は、原則として利用者または既
+        存の権利者に帰属します。ただし、利用者は、らむらに対し、当該作品を本サービスの運
+        営・改善、宣伝・広報活動のために無償で利用する権利（複製、頒布、公衆送信、翻案等
+        を含む）を許諾するものとします。<br />
+        ３．利用者は、前項に基づくらむらの著作権の利用に関して、著作者人格権を行使しないも
+        のとします。</div>
       <h2 className="text-3xl py-2">第６条（投稿にあたって）</h2><div className="leading-6">
-      １．利用者は、作成した作品を投稿する際に、らむらおよび現音令彼を概要欄や適切な箇所に明
-      記しなければなりません。<br />
-      ２．投稿作品に関する第三者からのクレームや紛争については、利用者が自己の責任と費
-      用で対応するものとし、らむらに一切の迷惑や損害を与えてはなりません。</div>
+        １．利用者は、作成した作品を投稿する際に、らむらおよび現音令彼を概要欄や適切な箇所に明
+        記しなければなりません。<br />
+        ２．投稿作品に関する第三者からのクレームや紛争については、利用者が自己の責任と費
+        用で対応するものとし、らむらに一切の迷惑や損害を与えてはなりません。</div>
       <h2 className="text-3xl py-2">第７条（利用制限）</h2><div className="leading-6">
-      １．らむらは、利用者が本規約に違反した場合、事前の通知なく、当該利用者の利用を一時
-      的または無期限に停止し、ならびに将来の利用を拒否する権利を有します。<br />
-      ２．利用者の違反行為によりらむらまたは第三者に損害が発生した場合、利用者はその一切
-      の損害を賠償する責任を負います。</div>
+        １．らむらは、利用者が本規約に違反した場合、事前の通知なく、当該利用者の利用を一時
+        的または無期限に停止し、ならびに将来の利用を拒否する権利を有します。<br />
+        ２．利用者の違反行為によりらむらまたは第三者に損害が発生した場合、利用者はその一切
+        の損害を賠償する責任を負います。</div>
       <h2 className="text-3xl py-2">第８条（免責事項）</h2><div className="leading-6">
-      １．らむらは、本サービスが常に正常に稼働することを保証するものではなく、提供される
-      コンテンツやサービスの完全性、正確性、信頼性、適法性等について、一切保証しませ
-      ん。<br />
-      ２．らむらは、本サービスの利用により利用者に生じた損害（データの消失、システム障
-      害、その他の不利益を含む）について、一切責任を負いません。<br />
-      ３．らむらは、不可抗力（天災地変、戦争、テロ等）により本サービスの提供が困難になっ
-      た場合、責任を負いません。</div>
+        １．らむらは、本サービスが常に正常に稼働することを保証するものではなく、提供される
+        コンテンツやサービスの完全性、正確性、信頼性、適法性等について、一切保証しませ
+        ん。<br />
+        ２．らむらは、本サービスの利用により利用者に生じた損害（データの消失、システム障
+        害、その他の不利益を含む）について、一切責任を負いません。<br />
+        ３．らむらは、不可抗力（天災地変、戦争、テロ等）により本サービスの提供が困難になっ
+        た場合、責任を負いません。</div>
       <h2 className="text-3xl py-2">第 9 条（規約の変更）</h2><div className="leading-6">
-      らむらは、本規約を随時変更できるものとし、変更後の規約は、らむらが本サービス上に掲示
-      した時点から効力を生じるものとします。利用者は、変更後の規約に同意した上で本サー
-      ビスを継続利用するものとみなされます。</div>
+        らむらは、本規約を随時変更できるものとし、変更後の規約は、らむらが本サービス上に掲示
+        した時点から効力を生じるものとします。利用者は、変更後の規約に同意した上で本サー
+        ビスを継続利用するものとみなされます。</div>
       <h2 className="text-3xl py-2">第 10 条（準拠法および管轄）</h2><div className="leading-6">
-      １．本規約の成立、効力、解釈および履行に関しては、日本法を準拠法とします。<br />
-      ２．本サービスに関連して生じた一切の紛争については、東京地方裁判所を第一審の専属
-      的合意管轄裁判所とします。</div>
+        １．本規約の成立、効力、解釈および履行に関しては、日本法を準拠法とします。<br />
+        ２．本サービスに関連して生じた一切の紛争については、東京地方裁判所を第一審の専属
+        的合意管轄裁判所とします。</div>
       <h2 className="text-3xl py-2">第 11 条（分離可能性）</h2 ><div className="leading-6">
-      本規約のいずれかの条項が違法、無効または執行不能と判断された場合でも、残りの条項
-      は引き続き有効に存続します。</div>
+        本規約のいずれかの条項が違法、無効または執行不能と判断された場合でも、残りの条項
+        は引き続き有効に存続します。</div>
     </main>
   );
 }
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 3838088..ebfb474 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -18,7 +18,7 @@ const jsonLd: WithContext<JsonLDArticle | JsonLDWebPage> = {
   inLanguage: 'ja',
   image: {
     '@type': 'ImageObject',
-    url: 'https://arane.uniproject-tech.net/images/title.png',
+    url: 'https://arane.uniproject-tech.net/images/title.webp',
     license: "https://arane.uniproject-tech.net/license",
     creditText: "ramura 2024",
     acquireLicensePage: "https://arane.uniproject-tech.net/license",
@@ -41,7 +41,7 @@ export const metadata: Metadata = {
     siteName: '荒音の夜 - 現音令彼(あらねしむか)公式サイト',
     images: [
       {
-        url: 'https://arane.uniproject-tech.net/images/title.png',
+        url: 'https://arane.uniproject-tech.net/images/title.webp',
         width: 800,
         height: 600,
       }
@@ -60,7 +60,7 @@ export default function Home() {
         dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
       />
       <main className="flex flex-col min-h-screen p-0 m-0 space-y-4 justify-center items-center w-full bg-[#1f1f1f]">
-        <section className="m-0 p-0 flex justify-center items-center bg-[#1f1f1f] bg-[url('../images/wipe.png')] w-full flex-grow">
+        <section className="m-0 p-0 flex justify-center items-center w-full flex-grow bg-custom-gradient">
           <div id="description" className="flex flex-col m-0 p-9 leading-none">
             <h1 className="text-7xl font-bold text-white m-0 font-BIZMincho leading-none">
               <ruby>
@@ -74,7 +74,7 @@ export default function Home() {
           </div>
           <Image
             className="leading-none m-0 p-0"
-            src="/images/fullbody.png"
+            src="/images/fullbody.webp"
             alt="logo"
             width={500}
             height={0}
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 222e480..a4ca277 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -8,11 +8,9 @@ const config: Config = {
   ],
   theme: {
     extend: {
-      backgroundImage: {
-        "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
-        "gradient-conic":
-          "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
-      },
+        backgroundImage: {
+            'custom-gradient': 'linear-gradient(110deg, #1f1f1f 50%, #ffffff 50%)',
+          },
     },
     fontFamily: {
       BIZMincho: ["BIZ UDPMincho", "serif"],