headingとtitleの違いを徹底解説！ウェブ制作初心者でもすぐ分かる3つのポイント

この記事を書いた人

中嶋悟

名前：中嶋悟（なかじまさとる）ニックネーム：サトルン年齢：28歳性別：男性職業：会社員（IT系メーカー・マーケティング部門）通勤場所：東京都千代田区・本社オフィス通勤時間：片道約45分（電車＋徒歩）居住地：東京都杉並区・阿佐ヶ谷の1LDKマンション出身地：神奈川県横浜市身長：175cm 血液型：A型誕生日：1997年5月12日趣味：比較記事を書くこと、カメラ散歩、ガジェット収集、カフェ巡り、映画鑑賞（特に洋画）、料理（最近はスパイスカレー作りにハマり中）性格：分析好き・好奇心旺盛・マイペース・几帳面だけど時々おおざっぱ・物事をとことん調べたくなるタイプ 1日（平日）のタイムスケジュール 6:30　起床。まずはコーヒーを淹れながらニュースとSNSチェック 7:00　朝食（自作のオートミールorトースト）、ブログの下書きや記事ネタ整理 8:00　出勤準備 8:30　電車で通勤（この間にポッドキャストやオーディオブックでインプット） 9:15　出社。午前は資料作成やメール返信 12:00　ランチはオフィス近くの定食屋かカフェ 13:00　午後は会議やマーケティング企画立案、データ分析 18:00　退社 19:00　帰宅途中にスーパー寄って買い物 19:30　夕食＆YouTubeやNetflixでリラックスタイム 21:00　ブログ執筆や写真編集、次の記事の構成作成 23:00　読書（比較記事のネタ探しも兼ねる） 23:45　就寝準備 24:00　就寝

headingとtitleの基本的な意味の違いを知ろう

ウェブサイトを作るとき、たくさんの用語が出てきます。その中でも「heading（見出し）」と「title（タイトル）」は、似ているようで役割が違います。まず、headingはページの中の構造を作るための指標です。ページ内に複数のセクションがある場合、それぞれのセクションの名前を示すために使われます。たとえば、記事の導入段落の前にある大きな文字列や、セクションごとに並ぶ見出しがheadingです。これに対してタグは「そのページそのものの名前」を決めるものです。ブラウザのタブに表示され、検索結果にも表示される大切な文字列です。ここが機能の大きな分かれ目です。<br><br>理解するときのコツは、headingがページ内の道しるべ、titleが外部に向けた名札だと考えることです。HTMLの構造を考えるときには、<strong>h1〜h6の階層を適切に使い分けること</strong>が重要です。<a href="https://chigai2.fromation.co.jp/archives/2686">サイト</a>のアクセス性と読みやすさを両立させるためには、まず</strong>ページ内の一貫した見出しの階層</strong>を作り、その上で<title>を設定しておくと混乱が生まれにくくなります。<br>例えば、ブログ記事なら<h1>記事の主題</h1>の下に、<h2>節の見出し</h2>、<h3>小見出し</h3>の順で組み立てます。このとき<strong>titleは記事タイトルとしてひとつ</strong>だけ設定します。もし、同じページに複数のline upがあり、それぞれ別のタイトルっぽく見せたい場合でも、実際には<title>はひとつです。ここを間違えると、検索結果での表示が混乱したり、ユーザーがどの情報を見れば良いか迷ってしまいます。</p><h3>ウェブデザインとSEOの観点から見る使い分け</h3><p>この二つの用語を日常的に使い分けると、読者にも検索エンジンにもやさしいサイトになります。まず、<strong>見出し（heading）は読み手の読み進め方を誘導する道案内</strong>として機能します。適切な階層構造を作ることで、スクリーンリーダーを使う人にも優しく、長文でも要点が取りやすくなります。次に<title>はクリックを促す「旗印」です。検索結果に表示される文言は、訪問者がページを開く前に判断する材料になります。したがって、タイトルはページの主題を正確に、かつ魅力的に伝える工夫が必要です。キーワードを過剰に詰め込みすぎると不自然になりますが、自然な言い回しで要点を含めるとSEOにも有利です。実際の運用例として、記事のタイトルを短く端的に記し、h2やh3の見出しで内容の広がりを示すと、ユーザーは求める情報を素早く見つけられます。さらに、検索エンジンの仕様が変わっても骨格を崩さず対応できるよう、<strong>タイトルと見出しの役割を分けて覚える</strong>と良いでしょう。最後に、<a href="https://chigai2.fromation.co.jp/archives/1531">デザイン</a>面では heading の文字サイズやカラーを揃えることで統一感が生まれ、title はメタ情報として機能することを意識してください。</p><div class="box28"><span class="box-title">ピックアップ解説</span><p>今日は title について友達と雑談した話を思い出す。友達は『タイトルはページの顔だよね、見出しは中身の道案内だ』と言い、私は『確かにそうだけど、バランスが大事だ。タイトルは要点を伝えつつ読者の興味を引くこと、見出しは情報の流れを整理すること』と返した。雑談の結論はシンプルで、タイトルと見出しは別々の役割を持つが、両方が揃って初めて読みやすく、探している情報に辿り着きやすい、ということでした。結局、実務では検索意図を考えつつ、タイトルで興味を惹き、本文の見出しで内容を分かりやすく整理する、この二段構えが最強だと感じました。</p></div> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3427885585170710" crossorigin="anonymous"></script> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-3427885585170710" data-ad-slot="8022694476"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <hr> <div> <p>前の記事： « <a href="https://chigai2.fromation.co.jp/archives/18579" rel="prev">comment　comments　違いを完全解説｜意味・使い方・例文・コード・SNSでの使い分けまで徹底比較</a></p> </div> <div> <p>次の記事： <a href="https://chigai2.fromation.co.jp/archives/18581" rel="next">宋朝体と明朝体の違いを徹底解説！どんな場面でどう使い分けるべきか</a> »</p> </div> <style> .kanren_o_f{ display: flex; flex-wrap: wrap; justify-content: space-around; row-gap: 25px; } .kanren_c_f{ flex-basis: 150px; } .kanren_c_p{ text-align: right; font-size: 1.1rem; } </style> <h3>ITの人気記事</h3><div class="kanren_o_f"><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/7202"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp152b5ab7607c25d92e5c86bfa3b0160a_250.webp" alt="ズームとズームワークプレイスの違いとは？初心者でもわかる徹底解説！"></a><div class="kanren_c_p">742viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/6068"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp74d852d52906bdadd4f62f60319f86d6_250.webp" alt="青写真と青焼きの違いとは？簡単解説でわかりやすく理解しよう！"></a><div class="kanren_c_p">723viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/6646"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojpa95ec116bcba1659f90a66b5876426c6_250.webp" alt="「画素(ピクセル)とは何？解説と画像の違いをやさしく理解しよう」"></a><div class="kanren_c_p">592viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/6081"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojpf6b439655bbdf40a720020a828d08e63_250.webp" alt="CADデータとDXFデータの違いを徹底解説！初心者でもわかる使い分けのポイント"></a><div class="kanren_c_p">356viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/14070"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojpa12f8222f20d549629bd47e76ec0db67_250.webp" alt="HTTPとHTTPSの違いをわかりやすく解説！安全なネット利用のために知っておきたいポイント"></a><div class="kanren_c_p">341viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/778"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp98af9d420a9100aefc1307ad01dcf77a_250.webp" alt="モバイルデータ通信番号と電話番号の違いを徹底解説！初心者でもわかるスマホの基礎知識"></a><div class="kanren_c_p">324viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/9726"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojpc48bbfbdf38e091f16977c1c2b9b60a0_250.webp" alt="スター結線とデルタ結線の違いを徹底解説！初心者でも分かる電気の基本"></a><div class="kanren_c_p">311viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/14026"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp5fc19794f4659a8c07b36917acc7dabd_250.webp" alt="IPアドレスとデフォルトゲートウェイの違いをわかりやすく解説！ネットワークの基本を理解しよう"></a><div class="kanren_c_p">291viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/5401"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojpee65415c3228394b1fd9566cfd042df3_250.webp" alt="API仕様書とIF仕様書の違いを徹底解説！初心者でもわかるポイントとは？"></a><div class="kanren_c_p">286viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/5524"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojpeaa148a12d84187293ff7d7918932829_250.webp" alt="UPSと非常用電源の違いとは？初心者でもわかる電源設備の基礎知識"></a><div class="kanren_c_p">233viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/6584"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp9afaa95e30bb47668235bc456bf08e71_250.webp" alt="RGBとsRGBの違いって何？初心者でもわかる色の基本知識"></a><div class="kanren_c_p">230viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/7002"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp9ec9ba68573b6f95d2fb4fbd26c25562_250.webp" alt="DFDとER図の違いをわかりやすく解説！初心者でも理解できる基本ポイント"></a><div class="kanren_c_p">229viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/12792"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp0e27571df8ca35c30c37b46423063e48_250.webp" alt="USB充電器とアダプターの違いとは？初心者にもわかりやすく解説！"></a><div class="kanren_c_p">226viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/159"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp9eca7ad308bd6ab0e2b9acb10200b92f_250.webp" alt="通信線と電力線の違いとは？意外と知らない基本ポイントを徹底解説！"></a><div class="kanren_c_p">212viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/3397"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp09d93e7307a7a5f59b4c2e721115c6ad_250.webp" alt="【保存版】webサイト名とページタイトルの違いとは？初心者でも簡単にわかる解説"></a><div class="kanren_c_p">212viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/9258"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojpd06a94d8027b4e87630cd50c6fd8d60b_250.webp" alt="SSDとUSBメモリの違いを徹底解説！初心者でもわかる保存デバイスの選び方"></a><div class="kanren_c_p">210viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/90"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp4773096054590eddaf3e4095ad45388d_250.webp" alt="グロメットとコンジットの違いとは？わかりやすく解説！"></a><div class="kanren_c_p">210viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/6557"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp4018d7a9651edca83d34d12733bf93fa_250.webp" alt="RGBとVGAの違いを徹底解説！初心者にもわかりやすい映像信号の基礎知識"></a><div class="kanren_c_p">208viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/7047"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp78ba23dd9b9df04dca3d62e043e026bf_250.webp" alt="ONUとWi-Fiルーターの違いをわかりやすく解説！初心者でも理解できるポイントとは？"></a><div class="kanren_c_p">199viws</div></div><div class="kanren_c_f"><a href="https://chigai2.fromation.co.jp/archives/777"><img decoding="async" src="https://silverweasel37.sakura.ne.jp/pic/chigai2fromationcojp7429146fcdd64ede79d1b261e06b857a_250.webp" alt="FAX番号と電話番号の違いは？初心者でもわかる使い分け完全ガイド"></a><div class="kanren_c_p">195viws</div></div></div> <h3>新着記事</h3><div class="amain"><div class="acontentA"><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/18639" class="sinchakulink">apiとgatewayの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/18638" class="sinchakulink">homebrewとnpmの違いは？</a></div><div class="abox anim-box poyopoyo"><a href="https://chigai2.fromation.co.jp/archives/18637" class="sinchakulink">bootstrapとjqueryの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/18636" class="sinchakulink">eslintとstylelintの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/18634" class="sinchakulink">rangeとscopeの違いは？</a></div></div><div class="acontentB"><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/18632" class="sinchakulink">openapiとswaggerの違いは？</a></div><div class="abox anim-box poyopoyo"><a href="https://chigai2.fromation.co.jp/archives/18631" class="sinchakulink">jwtとoauthの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/18630" class="sinchakulink">scopeとtargetの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/18629" class="sinchakulink">domcontentloadedとloadの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/18625" class="sinchakulink">多次元配列と連想配列の違いは？</a></div></div></div><h3>ITの関連記事</h3><div class="amain"><div class="acontentA"><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/14079" class="sinchakulink">lanとイーサネットの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/17174" class="sinchakulink">サーバーレスとフルマネージドの違いは？</a></div><div class="abox anim-box poyopoyo"><a href="https://chigai2.fromation.co.jp/archives/9548" class="sinchakulink">erdとumlの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/7346" class="sinchakulink">リストアとレストアの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/15566" class="sinchakulink">登録局と認証局の違いは？</a></div></div><div class="acontentB"><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/9676" class="sinchakulink">ガンマと明るさの違いは？</a></div><div class="abox anim-box poyopoyo"><a href="https://chigai2.fromation.co.jp/archives/15561" class="sinchakulink">ecdsaとeddsaの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/4851" class="sinchakulink">パワーコンディショナーとパワーステーションの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/7553" class="sinchakulink">nosqlとsqlの違いは？</a></div><div class="abox"><a href="https://chigai2.fromation.co.jp/archives/6610" class="sinchakulink">マウントとレンダリングの違いは？</a></div></div></div> </section> </article> </div> </div> <div id="side" class="display-none" role="complementary" itemscope="itemscope" itemtype="http://schema.org/WPSideBar"> <div class="side-inner"> <div class="side-widget-area"> <div id="block-2" class="widget_block widget_search side-widget"><div class="side-widget-inner"><form role="search" method="get" action="https://chigai2.fromation.co.jp/" class="wp-block-search__button-outside wp-block-search__text-button wp-block-search" ><label class="wp-block-search__label" for="wp-block-search__input-1" >検索</label><div class="wp-block-search__inside-wrapper " ><input class="wp-block-search__input" id="wp-block-search__input-1" placeholder="" value="" type="search" name="s" required /><button aria-label="検索" class="wp-block-search__button wp-element-button" type="submit" >検索</button></div></form></div></div><div id="block-3" class="widget_block side-widget"><div class="side-widget-inner"><div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow"><h2 class="wp-block-heading">最近の投稿</h2><ul class="wp-block-latest-posts__list wp-block-latest-posts"><li><a class="wp-block-latest-posts__post-title" href="https://chigai2.fromation.co.jp/archives/18639">api gateway 違いを徹底解説！用途別の選び方と違いをわかりやすく解説</a></li> <li><a class="wp-block-latest-posts__post-title" href="https://chigai2.fromation.co.jp/archives/18638">homebrew npm 違いを徹底解説！初心者でもすぐ使い分けられる実践ガイド</a></li> <li><a class="wp-block-latest-posts__post-title" href="https://chigai2.fromation.co.jp/archives/18637">BootstrapとjQueryの違いを徹底解説！使い分けのコツと現場で役立つ実例</a></li> <li><a class="wp-block-latest-posts__post-title" href="https://chigai2.fromation.co.jp/archives/18636">eslintとstylelintの違いを徹底解説！どちらを使うべき？初心者にもわかる完全ガイド</a></li> <li><a class="wp-block-latest-posts__post-title" href="https://chigai2.fromation.co.jp/archives/18635">serverとwaiterの違いを徹底解説！意味・使い方を中学生にも分かる言葉で</a></li> </ul></div></div></div></div><div id="block-4" class="widget_block side-widget"><div class="side-widget-inner"><div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow"><h2 class="wp-block-heading">最近のコメント</h2><ol class="wp-block-latest-comments"><li class="wp-block-latest-comments__comment"><article><footer class="wp-block-latest-comments__comment-meta"><a class="wp-block-latest-comments__comment-link" href="https://chigai2.fromation.co.jp/archives/1#comment-1">Hello world!</a> に <a class="wp-block-latest-comments__comment-author" href="https://ja.wordpress.org/">WordPress コメントの投稿者</a> より</footer></article></li></ol></div></div></div></div><div id="block-5" class="widget_block side-widget"><div class="side-widget-inner"><div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow"><h2 class="wp-block-heading">アーカイブ</h2><ul class="wp-block-archives-list wp-block-archives"> <li><a href='https://chigai2.fromation.co.jp/archives/date/2025/09'>2025年9月</a></li> <li><a href='https://chigai2.fromation.co.jp/archives/date/2025/08'>2025年8月</a></li> </ul></div></div></div></div><div id="block-6" class="widget_block side-widget"><div class="side-widget-inner"><div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow"><h2 class="wp-block-heading">カテゴリー</h2><ul class="wp-block-categories-list wp-block-categories"> <li class="cat-item cat-item-2"><a href="https://chigai2.fromation.co.jp/archives/category/it">IT</a> </li> <li class="cat-item cat-item-3"><a href="https://chigai2.fromation.co.jp/archives/category/entame">エンタメ</a> </li> <li class="cat-item cat-item-4"><a href="https://chigai2.fromation.co.jp/archives/category/geemu">ゲーム</a> </li> <li class="cat-item cat-item-5"><a href="https://chigai2.fromation.co.jp/archives/category/supootsu">スポーツ</a> </li> <li class="cat-item cat-item-6"><a href="https://chigai2.fromation.co.jp/archives/category/bijinesu">ビジネス</a> </li> <li class="cat-item cat-item-7"><a href="https://chigai2.fromation.co.jp/archives/category/jinbutsu">人物</a> </li> <li class="cat-item cat-item-8"><a href="https://chigai2.fromation.co.jp/archives/category/chiri">地理</a> </li> <li class="cat-item cat-item-9"><a href="https://chigai2.fromation.co.jp/archives/category/seiji">政治</a> </li> <li class="cat-item cat-item-10"><a href="https://chigai2.fromation.co.jp/archives/category/ryouri">料理</a> </li> <li class="cat-item cat-item-1"><a href="https://chigai2.fromation.co.jp/archives/category/uncategorized">未分類</a> </li> <li class="cat-item cat-item-11"><a href="https://chigai2.fromation.co.jp/archives/category/rekishi">歴史</a> </li> <li class="cat-item cat-item-12"><a href="https://chigai2.fromation.co.jp/archives/category/kaigai">海外</a> </li> <li class="cat-item cat-item-13"><a href="https://chigai2.fromation.co.jp/archives/category/kagaku">科学</a> </li> <li class="cat-item cat-item-14"><a href="https://chigai2.fromation.co.jp/archives/category/shizen">自然</a> </li> <li class="cat-item cat-item-15"><a href="https://chigai2.fromation.co.jp/archives/category/gengo">言語</a> </li> <li class="cat-item cat-item-16"><a href="https://chigai2.fromation.co.jp/archives/category/shintai">身体</a> </li> <li class="cat-item cat-item-17"><a href="https://chigai2.fromation.co.jp/archives/category/kinyuu">金融</a> </li> <li class="cat-item cat-item-18"><a href="https://chigai2.fromation.co.jp/archives/category/shokuhin">食品</a> </li> </ul></div></div></div></div> </div> </div> </div> </div> </div> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "BlogPosting", "mainEntityOfPage":{ "@type":"WebPage", "@id":"https://chigai2.fromation.co.jp/archives/18580" }, "headline":"headingとtitleの違いを徹底解説！ウェブ制作初心者でもすぐ分かる3つのポイント", "image": [ "https://chigai2.fromation.co.jp/wp-content/themes/xeory_base/lib/images/noimage.jpg" ], "datePublished": "2025-09-02T17:37:40+09:00", "dateModified": "2025-09-02T17:37:40+09:00", "author": { "@type": "Person", "name": "中嶋悟" }, "publisher": { "@type": "Organization", "name": "違いラボ -世の中の”違い”を解説！-", "logo": { "@type": "ImageObject", "url": "https://chigai2.fromation.co.jp/wp-content/themes/xeory_base/lib/images/masman.png" } }, "description": "" } </script> <footer id="footer"> <div class="footer-02"> <div class="wrap"> <p class="footer-copy"> © Copyright 2025 違いラボ -世の中の”違い”を解説！-. All rights reserved. </p> </div> </div> </footer> <a href="#" class="pagetop"><span><i class="fa fa-angle-up"></i></span></a> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/*"},{"not":{"href_matches":["\/wp-*.php","\/wp-admin\/*","\/wp-content\/uploads\/*","\/wp-content\/*","\/wp-content\/plugins\/*","\/wp-content\/themes\/xeory_base\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <script src="https://apis.google.com/js/platform.js" async defer> {lang: 'ja'} </script><script type="text/javascript" src="https://chigai2.fromation.co.jp/wp-content/themes/xeory_base/lib/js/jquery.pagetop.js?ver=6.8.2" id="pagetop-js"></script> <script type="text/javascript" src="https://chigai2.fromation.co.jp/wp-content/themes/xeory_base/lib/js/jquery.table-scroll.js?ver=6.8.2" id="table-scroll-js"></script> <script> (function($){ $(function(){ $(".sub-menu").css('display', 'none'); $("#gnav-ul li").hover(function(){ $(this).children('ul').fadeIn('fast'); }, function(){ $(this).children('ul').fadeOut('fast'); }); // スマホトグルメニュー $('#gnav').removeClass('active'); $('#header-menu-tog a').click(function(){ $('#gnav').toggleClass('active'); }); }); })(jQuery); </script> </body> </html>