M`s　company | HWYS AI Studio #16

事業の核となる信念

未設定

選ばれる真の理由

絶対にやらないこと

AIはこれらの思想データをコンテキストとして読み込み、完全オリジナルの構造とコピーを生成します。

テーマカラー

Main Color

#0f172a

Sub Color

#ffffff

Accent Color

#db2777

AIはこれらのカラーコードを変数としてCSSに適用し、2〜3年毎のUI/UXアップデート時にも一貫性を保ちます。

HOME /home/

事業内容 /service/

実績 /works/

料金 /price/

会社概要 /company/

お問い合わせ /contact/

代表挨拶 /greeting/

データがありません

<div class="hwys-home-demo" data-demo="1">
<section class="hwys-hero">
    <div class="hwys-hero-bg" style="background-image: url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?q=80&w=2070&auto=format&fit=crop');"></div>
    <div class="hwys-hero-overlay"></div>
    <div class="hwys-hero-content hwys-hero-content--tight">
        <p class="hwys-hero-kicker fade-in-up">事業紹介 · 価値 · ニュース · 定休日まで一画面で体験</p>
        <h1 class="fade-in-up">未設定</h1>
        <p class="hwys-hero-lead fade-in-up" style="animation-delay:0.1s">選ばれる真の理由</p>
        <p class="hwys-hero-biz fade-in-up" style="animation-delay:0.2s">事業内容はヒアリングシートの「事業内容」欄に沿って、ここに要約文が入ります。</p>
        <div class="hwys-hero-cta fade-in-up" style="animation-delay:0.28s">
            <a href="/service/" class="hwys-btn">事業内容を見る</a>
            <a href="/contact/" class="hwys-btn hwys-btn--ghost">相談する</a>
        </div>
    </div>
</section>

<section class="hwys-section hwys-fade-section hwys-section--tight" aria-labelledby="hwys-values-title">
    <div class="hwys-container-sm">
        <h2 id="hwys-values-title" class="hwys-title">価値の3本柱 <span class="hwys-kicker">（思想 × 市場のズレの言語化）</span></h2>
        <div class="hwys-trio">
            <article class="hwys-card"><div class="hwys-card-img" style="background-image:url('https://images.unsplash.com/photo-1504384308090-c894fdcc538d?q=80&w=800&auto=format&fit=crop')"></div><div class="hwys-card-body"><span class="hwys-card-eyebrow">STRUCTURE</span><h3>最後の比較のあと、選ばれる一つの、譲れない理由を明確にします。</h3></div></article>
            <article class="hwys-card"><div class="hwys-card-img" style="background-image:url('https://images.unsplash.com/photo-1521791136064-7986c2920216?q=80&w=800&auto=format&fit=crop')"></div><div class="hwys-card-body"><span class="hwys-card-eyebrow">TARGET</span><h3>誰のどんな本音に応えるのか。当事者性を言語化し、一貫した体験に落とし込みます。</h3></div></article>
            <article class="hwys-card"><div class="hwys-card-img" style="background-image:url('https://images.unsplash.com/photo-1552664730-d307ca884978?q=80&w=800&auto=format&fit=crop')"></div><div class="hwys-card-body"><span class="hwys-card-eyebrow">FUTURE</span><h3>導入後の理想的な風景を具体化。KPI の先にある「在り方」まで掲げます。</h3></div></article>
        </div>
    </div>
</section>

<section class="hwys-section hwys-fade-section hwys-section--split" aria-labelledby="hwys-biz-snapshot-title">
    <div class="hwys-container-md hwys-split">
        <div class="hwys-split__media" style="background-image:url('https://images.unsplash.com/photo-1497366216548-37526070297c?q=80&w=800&auto=format&fit=crop')"></div>
        <div class="hwys-split__text">
            <h2 id="hwys-biz-snapshot-title" class="hwys-sub-title" style="border-bottom:none">事業のスナップショット</h2>
            <p class="hwys-body-text">事業内容はヒアリングシートの「事業内容」欄に沿って、ここに要約文が入ります。</p>
            <ul class="hwys-inline-services">
                <li><a href="/service/"><i class="fas fa-arrow-right" aria-hidden="true"></i> 中核事業・提案設計</a></li>
                <li><a href="/service/"><i class="fas fa-arrow-right" aria-hidden="true"></i> 導入・運用サポート</a></li>
                <li><a href="/service/"><i class="fas fa-arrow-right" aria-hidden="true"></i> 継続改善・伴走</a></li>
            </ul>
            <a class="hwys-link-arrow" href="/service/">事業内容ページへ <i class="fas fa-chevron-right" aria-hidden="true"></i></a>
        </div>
    </div>
</section>

<section class="hwys-section hwys-fade-section hwys-section--tight" aria-labelledby="hwys-news-title">
    <div class="hwys-container-md">
        <div class="hwys-section-head">
            <h2 id="hwys-news-title" class="hwys-title">NEWS <span class="hwys-kicker">お知らせ（デモ掲載）</span></h2>
            <a class="hwys-to-news" href="/greeting/" aria-label="掲載例：トピックス">一覧</a>
        </div>
        <div class="hwys-news-grid">
            <article class="hwys-news-card">
                <a href="/works/"><div class="hwys-news-thumb" style="background-image:url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?q=80&w=600&auto=format&fit=crop')"></div><div class="hwys-news-body"><time datetime="2026-01-20">2026.01.20</time><h3>代表メッセージを更新（デモ）</h3><p>公開時は WordPress 投稿と連携する想定です。</p></div></a>
            </article>
            <article class="hwys-news-card">
                <a href="/service/"><div class="hwys-news-thumb" style="background-image:url('https://images.unsplash.com/photo-1600880292203-757bb62b4baf?q=80&w=600&auto=format&fit=crop')"></div><div class="hwys-news-body"><time datetime="2025-12-10">2025.12.10</time><h3>「中核事業・提案設計」の事例紹介を掲載（デモ）</h3><p>実績ページと連携し、ストーリーで見せる運用に。</p></div></a>
            </article>
        </div>
    </div>
</section>

<section class="hwys-section hwys-fade-section hwys-section--info" id="info">
    <div class="hwys-container-sm">
        <h2 class="hwys-title">拠点 · 営業時間 <span class="hwys-kicker">（掲載例）</span></h2>
        <div class="hwys-info-grid">
            <div class="hwys-info-block"><span class="hwys-info-ico"><i class="fas fa-map-marker-alt" aria-hidden="true"></i></span><div><h3>所在地</h3><p>〒000-0000 都道府県…（本番ではヒアリングの所在地が表示）</p></div></div>
            <div class="hwys-info-block"><span class="hwys-info-ico"><i class="fas fa-phone" aria-hidden="true"></i></span><div><h3>電話</h3><p>03-0000-0000（掲載例）</p></div></div>
            <div class="hwys-info-block hwys-info-block--wide"><span class="hwys-info-ico"><i class="fas fa-calendar-alt" aria-hidden="true"></i></span><div><h3>営業日・定休日</h3><p>月曜〜金曜 9:00—18:00 ／ 土日祝 休業（ヒアリング前の仮表記）</p></div></div>
        </div>
    </div>
</section>

<section class="hwys-section hwys-fade-section" aria-labelledby="hwys-philosophy-title">
    <div class="hwys-container-sm" style="text-align:center;">
        <h2 id="hwys-philosophy-title" class="hwys-title">PHILOSOPHY</h2>
        <p class="hwys-lead-text">未来への展望</p>
        <p class="hwys-body-text">構造の軸</p>
    </div>
</section>
</div>

<section class="hwys-hero hwys-hero-sub">
    <div class="hwys-hero-content">
        <h1>CONTACT</h1>
        <p>お問い合わせ</p>
    </div>
</section>
<section class="hwys-section hwys-fade-section">
    <div class="hwys-container-sm">
        <p style="text-align:center; margin-bottom:60px; font-size:1.1rem; color:#666; line-height:1.8;">
            事業に関するご相談、お見積りのご依頼など、お気軽にお問い合わせください。<br>
            <span style="font-size:0.85rem; color:#999;">※営業やセールスを目的としたお問い合わせは固くお断りいたします。</span>
        </p>
        
        <form class="hwys-contact-form" action="https://tyuoukanri.hwysgroup.com/send_mail.php" method="POST">
            
            <div class="hwys-input-group">
                <select name="inquiry_type" required class="hwys-input-field">
                    <option value="" disabled selected></option>
                    <option value="総合的なご相談・その他">総合的なご相談・その他</option>
                </select>
                <label class="hwys-floating-label">INQUIRY TYPE (お問い合わせ種別) <span class="req">*</span></label>
                <div class="hwys-select-arrow"></div>
            </div>
            
            <div class="hwys-input-group">
                <input type="text" name="name" required class="hwys-input-field" placeholder=" ">
                <label class="hwys-floating-label">NAME (貴社名 / お名前) <span class="req">*</span></label>
            </div>
            
            <div class="hwys-input-group">
                <input type="email" name="email" required class="hwys-input-field" placeholder=" ">
                <label class="hwys-floating-label">EMAIL (メールアドレス) <span class="req">*</span></label>
            </div>
            
            <div class="hwys-input-group">
                <textarea name="message" rows="1" required class="hwys-input-field auto-expand" placeholder=" "></textarea>
                <label class="hwys-floating-label">MESSAGE (ご相談内容) <span class="req">*</span></label>
            </div>
            
            <input type="hidden" name="client_id" value="16">
            <input type="hidden" name="_to" value="">
            
            <div class="hwys-submit-wrapper">
                <button type="submit" class="hwys-submit-btn">
                    <span>SEND MESSAGE</span>
                    <i class="fas fa-arrow-right"></i>
                </button>
            </div>
        </form>
    </div>
</section>