<header_common>
    <!--ヘッダー-->
    <div class="header">
        <div class="header-logo">
            <a href="{base}/"><img src="{base}/assets/img/common/logo.png" alt="総合人材サービスSHINSEI 人材をお探しの企業様／仕事をお探しの方"></a>
        </div>

        <div class="header-nav">
            <nav>
                <ul class="header-nav-list">
                    <li>
                        <a href="{base}/">TOP</a>
                    </li>
                    <li class="header-dropdown">
                        <a href="{base}/company/">会社案内</a>
                        <ul class="header-dropdown-content">
                            <li>
                                <a href="{base}/company/philosophy.html">経営理念・経営方針</a>
                            </li>
                            <li>
                                <a href="{base}/company/overview.html">会社概要</a>
                            </li>
                            <li>
                                <a href="{base}/company/social.html">社会貢献活動</a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="{base}/about/">私たちについて</a>
                    </li>
                    <li class="header-dropdown">
                        <a href="{base}/business/">事業内容</a>
                        <ul class="header-dropdown-content">
                            <li>
                                <a href="{base}/business/staff.html">人材サービス</a>
                            </li>
                            <li>
                                <a href="{base}/business/career.html">キャリア支援</a>
                            </li>
                            <li>
                                <a href="{base}/business/matching.html">ビジネスマッチング</a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="{base}/works/">導入実績</a>
                    </li>
                    <li>
                        <a href="{base}/for_company/">企業の方</a>
                    </li>
                    <li>
                        <a href="{base}/recruit/">採用情報</a>
                    </li>
                </ul>
            </nav>
            <div class="header-contact">
                <a href="{base}/inquiry/">お問い合わせ</a>
            </div>
        </div>

        <div id="nav-toggle">
            <div>
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>

        <div id="gloval-nav">
            <div class="gloval-nav-contents">
                <div class="gloval-nav-contents__logo">
                    <a href="{base}/"><img src="{base}/assets/img/common/logo.png" alt="総合人材サービスSHINSEI 人材をお探しの企業様／仕事をお探しの方"></a>
                </div>
                <ul class="gloval-nav-link01">
                    <li class="company">
                        <a href="{base}/for_company/"><span>人材をお探しの</span>企業の方</a>
                    </li>
                    <li class="seeker">
                        <a href="{base}/job_seeker/"><span>お仕事をお探しの</span>求職者の方</a>
                    </li>
                </ul>
                <ul class="gloval-nav-link02">
                    <li>
                        <a href="{base}/">TOPページ</a>
                    </li>
                    <li>
                        <a href="{base}/company/">会社案内</a>
                        <ul>
                            <li>
                                <a href="{base}/company/">ご挨拶</a>
                            </li>
                            <li>
                                <a href="{base}/company/philosophy.html">経営理念・経営方針</a>
                            </li>
                            <li>
                                <a href="{base}/company/overview.html">会社概要</a>
                            </li>
                            <li>
                                <a href="{base}/company/social.html">社会貢献活動</a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="{base}/about/">私たちについて</a>
                    </li>
                    <li>
                        <a href="{base}/business/">事業内容</a>
                        <ul>
                            <li>
                                <a href="{base}/business/staff.html">人材サービス</a>
                            </li>
                            <li>
                                <a href="{base}/business/career.html">キャリア支援</a>
                            </li>
                            <li>
                                <a href="{base}/business/matching.html">ビジネスマッチング</a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="{base}/works/">導入実績</a>
                    </li>
                    <li>
                        <a href="{base}/recruit/">採用情報</a>
                    </li>
                </ul>
                <ul class="gloval-nav-link03">
                    <li>
                        <a href="{base}/privacy/">個人情報保護方針</a>
                    </li>
                    <li>
                        <a href="{base}/inquiry/">お問い合わせフォーム</a>
                    </li>
                    <li>
                        <a href="{base}/sitemap/">サイトマップ</a>
                    </li>
                </ul>
            </div>
        </div>
        <div id="gloval-nav-overlay"></div>

        <ul class="header-sp-fix">
            <li>
                <a href="{base}/inquiry/"><span>WEBでお問い合わせ</span></a>
            </li>
            <li>
                <a href="https://jp.indeed.com/jobs?q=%E6%A3%AE%E6%99%B4%E7%94%A3%E6%A5%AD&l=&from=searchOnHP&vjk=11e683829556da47" target="_blank" class="jobinfo"><span>お仕事情報</span></a>
            </li>
        </ul>
    </div>
    <!--/ヘッダー-->

    <script>
        // カレント設定
        this.on('mount', function () {
            var current = location.pathname.replace(this.base, '').split('/')[1];
            if (current.length === 0 || current === 'index.html') {
                $('.header-nav-list li > a[href="' + this.base + '/"]').closest('a').addClass('active').attr('aria-current', 'page');
            } else {
                $('.header-nav-list li > a[href^="' + this.base + '/' + current + '/"]').closest('a').addClass('active').attr('aria-current', 'page');
            }
        });

        this.on('mount', function() {
            var state = false;
                $('#nav-toggle, .gloval-nav-list li a, #gloval-nav-overlay').on('click', function(){
                $('body').toggleClass('open');
            });
        });
    </script>
</header_common>
