<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <!-- BootStrap css -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous" />

    <!-- Boxicons -->
    <link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet" />
    <script src="https://code.iconify.design/iconify-icon/1.0.7/iconify-icon.min.js"></script>

    <title>株式会社 富士マテリア</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <!-- navbar sec  -->
    <nav class="navbar navbar-expand-lg navbar-light bg-dark sticky-top">
      <div class="container">
        <a class="navbar-brand" href="index.html"> <h2 class="text-white">株式会社 富士マテリア</h2></a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNav">
          <ul class="navbar-nav ms-auto">
            <li class="nav-item">
              <a class="nav-link" href="index.html">ホーム</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="index.html#services">事業内容</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="index.html#mission">ミッション</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="index.html#strongpoint">当社の強み</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="en.html">Oversea buyers</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="index.html#about">会社情報</a>
            </li>
            <li class="nav-item">
              <a class="nav-link text-primary" href="index.html#contact">お問い合わせ</a>
            </li>
          </ul>
        </div>
      </div>
    </nav>

    <!-- Hero secstion -->
    <div class="hero vh-100 d-flex align-items-center" id="header">
      <div class="container">
        <!-- JQ -->
        <video id="background_video" loop muted autoplay></video>
        <div id="video_cover"></div>
        <div id="overlay"></div>
        <!-- JQ -->

        <div class="row" id="main_content">
          <div class="col-lg-7 mx-auto text-center">
            <img src="img/FM_LOGO_WHITE.png" />
            <h1 class="display-4 text-white">日本の古着を世界に<br />古着で世界を繋ぐ</h1>
            <p class="text-white my-3">富士マテリアは、リサイクルとリユースを通じ持続可能な社会の実現を目指します</p>
            <a href="#services" class="btn btn-outline-light btn-x">事業内容</a>
            <a href="#contact" class="btn btn-outline-light btn-x">お問い合わせ</a>
          </div>
        </div>
      </div>
    </div>

    <!-- Service section -->
    <section id="services" class="py-6">
      <div class="container">
        <div class="row">
          <div class="col-md-8 mx-auto text-center">
            <!-- <h6 class="text-primary">SERVICES</h6>  -->
            <h1>事業内容</h1>
            <p>国内の不用品・廃棄物を再利用し、資源の有効活用と地球環境の保全につなげます</p>
          </div>
        </div>

        <div class="row g-4">
          <div class="col-lg-4 col-sm-6">
            <div class="service card-effect">
              <div class="iconbox">
                <iconify-icon icon="ri:recycle-line"></iconify-icon>
              </div>
              <h5 class="mt-4 mb-2 text-center">資源の回収・買取</h5>
              <p>古着と中古雑貨家具の回収と買取を行っています。お客様の不要なものを有効活用し、地球環境の保全に貢献しています。</p>
            </div>
          </div>

          <div class="col-lg-4 col-sm-6">
            <div class="service card-effect">
              <div class="iconbox text-center">
                <iconify-icon icon="icons8:buy"></iconify-icon>
              </div>
              <h5 class="mt-4 mb-2 text-center">国内販売</h5>
              <p>古着の卸売りと小売り、ウエスの販売、中古雑貨家具の販売と輸出、梱包資材の輸入販売を行っています。</p>
            </div>
          </div>

          <div class="col-lg-4 col-sm-6">
            <div class="service card-effect">
              <div class="iconbox text-center">
                <iconify-icon icon="ri:ship-fill"></iconify-icon>
              </div>
              <h5 class="mt-4 mb-2 text-center">貿易事業</h5>
              <p>古着と中古家具の輸出、貿易業務代行を行っています。お客様のニーズに合わせた貿易サービスを提供し、ビジネスの成功に貢献しています。</p>
            </div>
          </div>
        </div>
      </div>
    </section>

    <!-- mission section -->

    <section id="mission" class="py-5">
      <div class="container-fluid">
        <div class="row">
          <div class="col-md-8 mx-auto text-center">
            <h1>ミッション</h1>
            <p>
              日本では年間約150万トンの繊維製品がリサイクルされず廃棄されると言われています。<br />
              私たちは 「日本の古着を世界に、古着で世界を繋ぐを」をテーマに<br />
              まだまだ活用可能な繊維製品をリユース・リサイクルすることで<br />
              廃棄物削減、CO2削減、資源を有効活用し、<br />
              すべての人々のためのより良い未来に向けた取り組みをしています。
            </p>
          </div>
        </div>
      </div>
    </section>

    <!-- Team section
    <section id="team" class="bg-light">
      <div class="container">
        <div class="row">
          <div class="col-md-8 mx-auto text-center">
            <h6 class="text-primary">Team</h6>
            <h1>Our Fair & Simple Pricing</h1>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta, aut.</p>
          </div>
        </div>

        <div class="row g-3">
          <div class="col-lg-3 col-sm-6 text-center">
            <div class="team-member card-effect">
              <img src="./img/ブログ用ダミー画像.jpg" alt="" />
              <h5 class="mb-0 mt-4">sharbat Kharn</h5>
              <p>Webデベロッパー</p>
              <div class="social-icons">
                <a href="#"><i class="bx bxl-facebook"></i></a>
                <a href="#"><i class="bx bxl-twitter"></i></a>
                <a href="#"><i class="bx bxl-instagram-alt"></i></a>
              </div>
            </div>
          </div>

          <div class="col-lg-3 col-sm-6 text-center">
            <div class="team-member card-effect">
              <img src="./img/ブログ用ダミー画像.jpg" alt="" />
              <h5 class="mb-0 mt-4">sharbat Kharn</h5>
              <p>Webデベロッパー</p>
              <div class="social-icons">
                <a href="#"><i class="bx bxl-facebook"></i></a>
                <a href="#"><i class="bx bxl-twitter"></i></a>
                <a href="#"><i class="bx bxl-instagram-alt"></i></a>
              </div>
            </div>
          </div>

          <div class="col-lg-3 col-sm-6 text-center">
            <div class="team-member card-effect">
              <img src="./img/ブログ用ダミー画像.jpg" alt="" />
              <h5 class="mb-0 mt-4">sharbat Kharn</h5>
              <p>Webデベロッパー</p>
              <div class="social-icons">
                <a href="#"><i class="bx bxl-facebook"></i></a>
                <a href="#"><i class="bx bxl-twitter"></i></a>
                <a href="#"><i class="bx bxl-instagram-alt"></i></a>
              </div>
            </div>
          </div>

          <div class="col-lg-3 col-sm-6 text-center">
            <div class="team-member card-effect">
              <img src="./img/ブログ用ダミー画像.jpg" alt="" />
              <h5 class="mb-0 mt-4">sharbat Kharn</h5>
              <p>Webデベロッパー</p>
              <div class="social-icons">
                <a href="#"><i class="bx bxl-facebook"></i></a>
                <a href="#"><i class="bx bxl-twitter"></i></a>
                <a href="#"><i class="bx bxl-instagram-alt"></i></a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

    <!-- strong point section -->
    <section id="strongpoint" class="bg-light">
      <div class="container">
        <div class="row">
          <div class="col-md-8 mx-auto text-center">
            <h1>当社の強み</h1>
            <p>当社は環境に配慮した事業運営をおこなっています。主な特徴は以下の通りです。</p>
          </div>
        </div>

        <div class="row g-4">
          <div class="col-md-4">
            <div class="blog-card card-effect">
              <img src="img/pr1.jpg" alt="" />
              <h5 class="mb-0 mt-4">繊維廃棄物を宝に変える</h5>
              <p>
                日本では年間150万トンの繊維廃棄物が捨てられていますが、当社はそれらをリサイクル、リユーズし新たな価値を生み出します。古着としてまだ着用できる古着は人の手で一枚一枚丁寧に選別され、海外で日本の高品質な古着としてリユーズされます。服として価値がなくなった古着はウエスとして加工され工場や家庭などでも使用されます。また、車の内装材や建築用断熱防音材、縫いぐるみや運動用具のクッション材など様々な品目にリサイクルされます。当社は繊維リサイクル、リユース率100%を目指しています。環境保護と資源有効活用のために、当社にお任せください。
              </p>
            </div>
          </div>

          <div class="col-md-4">
            <div class="blog-card card-effect">
              <img src="img/pr2.jpg" alt="" />
              <h5 class="mb-0 mt-4">古着だけじゃない！リサイクルの新常識</h5>
              <p>
                他社は古着のみ回収していますが、当社では、他社が回収できない様々な繊維品目を回収します。毛布、羽毛布団、ブランケット、シーツ、トイレ・バスマット、タオル、カーテン、カーペット靴、鞄、ベルト、ぬいぐるみなど、一般的にはリサイクルが困難な物も多品目に渡り回収し独自の販路や技術でリユーズ、リサイクルします。当社はリサイクルの新常識を提案します。
              </p>
            </div>
          </div>

          <div class="col-md-4">
            <div class="blog-card card-effect">
              <img src="img/pr3.jpg" alt="" />
              <h5 class="mb-0 mt-4">一貫した作業で安心・安全・高品質</h5>
              <p>当社は回収から選別まで一貫した作業を行っております。回収したアイテムは当時の選別工場にて様々なリサイクル用途に従って仕分けされます。一貫した作業で安心・安全・高品質なリサイクル品を提供します。</p>
            </div>
          </div>
        </div>
      </div>
    </section>

    <!-- Company section -->
    <section class="row bg-light py-0" id="about">
      <div class="col-lg-6 embed-responsive iframe embed-responsive">
        <iframe
          src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3260.262071830254!2d137.03912817641375!3d35.19994055626155!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60036fd1cdf1a92b%3A0xb3fb5f9af9d02a78!2z5qCq5byP5Lya56S-5a-M5aOr44Oe44OG44Oq44Ki!5e0!3m2!1sja!2sjp!4v1690868004233!5m2!1sja!2sjp"
          width="100%"
          height="600"
          style="border: 0"
          allowfullscreen=""
          loading="lazy"
          referrerpolicy="no-referrer-when-downgrade"
        ></iframe>
      </div>

      <div class="col-lg-6">
        <div class="container">
          <div class="row">
            <div class="col-md-10 offset-md-1">
              <h1>会社情報</h1>

              <div class="feature d-flex">
                <div class="iconbox me-3">
                  <i class="bx bx-check"></i>
                </div>
                <div>
                  <h5>会社名</h5>
                  <p>株式会社 富士マテリア</p>
                </div>
              </div>

              <div class="feature d-flex">
                <div class="iconbox me-3">
                  <i class="bx bxs-business"></i>
                </div>
                <div>
                  <h5>住所</h5>
                  <p>〒488-0043 愛知県尾張旭市北本地ケ原町４丁目４５</p>
                </div>
              </div>

              <div class="feature d-flex">
                <div class="iconbox me-3">
                  <i class="bx bx-phone-incoming"></i>
                </div>
                <div>
                  <h5>電話番号</h5>
                  <a href="tel:0561-56-3233"><p>0561-56-3233</p></a>
                </div>
              </div>

              <div class="feature d-flex">
                <div class="iconbox me-3">
                  <i class="bx bx-recycle"></i>
                </div>
                <div>
                  <h5>事業内容</h5>
                  <p>資源の回収・買取、国内販売、貿易事業など</p>
                </div>
              </div>

              <div class="feature d-flex">
                <div class="iconbox me-3">
                  <i class="bx bx-receipt"></i>
                </div>
                <div>
                  <h5>古物商許可番号</h5>
                  <p>愛知県公安委員会 第 541312303800 号</p>
                </div>
              </div>

              <div class="feature d-flex">
                <div class="iconbox me-3">
                  <i class="bx bx-money"></i>
                </div>
                <div>
                  <h5>資本金</h5>
                  <p>9,990,000円</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

    <!-- Contact section -->
    <section id="contact" class="py-6">
      <div class="container">
        <div class="row">
          <div class="col-md-8 col-md-8 mx-auto">
            <h1 class="text-center">お問い合わせ</h1>

            <iframe name="to_success" style="display: none" onload="if(submitted){window.location='success.html';}"></iframe>

            <form action="https://docs.google.com/forms/u/1/d/e/1FAIpQLSfGnKFVP3xULq2-LWfOEXOwpYmx_Hu9wzigh9M53mdn9S1bdA/formResponse" target="to_success" onsubmit="submitted=true;" method="POST" name="Form1">
              <div class="form-group">
                <label>会社名</label>
                <input type="text" class="form-control" placeholder="株式会社 富士商事" name="entry.2083055050" />
                <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                <div class="help-block with-errors"></div>
              </div>

              <div class="form-group">
                <label>お名前</label><span class="badge badge-danger text-danger">必須</span>
                <input type="text" class="form-control" placeholder="富士 太朗" name="entry.644293587" required />
                <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                <div class="help-block with-errors"></div>
              </div>

              <div class="form-group">
                <label>メールアドレス</label><span class="badge badge-danger text-danger">必須</span>
                <input type="email" class="form-control" placeholder="xxxxxx@yahoo.co.jp" name="entry.129651418" required />
                <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                <div class="help-block with-errors"></div>
              </div>

              <div class="form-group">
                <label>電話番号</label>
                <input type="text" class="form-control" placeholder="xxx-yyyy-zzzz" name="entry.180285571" />
              </div>

              <div class="form-group">
                <label>住所</label>
                <input type="text" class="form-control" placeholder="○○県△△市□□町xxxx-yy-z" name="entry.83933054" />
              </div>

              <div class="form-group">
                <label>ご用件</label><span class="badge badge-danger text-danger">必須</span>
                <br />
                <label class="radio-inline"> <input type="radio" name="entry.1796821509" value="古着に関して" onClick="changeDisabled()" required /> 古着に関して</label>
                <br />
                <label class="radio-inline"> <input type="radio" name="entry.1796821509" value="ウエスに関して" onClick="changeDisabled()" /> ウエスに関して</label>
                <br />
                <label class="radio-inline"> <input type="radio" name="entry.1796821509" value="中古雑貨・家具に関して" onClick="changeDisabled()" /> 中古雑貨・家具に関して</label>
                <br />
                <label class="radio-inline"> <input type="radio" name="entry.1796821509" value="貿易業務に関し" onClick="changeDisabled()" /> 貿易業務に関して</label>
                <br />
                <label class="radio-inline"> <input type="radio" name="entry.1796821509" value="リサイクルステーションに関して" onClick="changeDisabled()" /> リサイクルステーションに関して</label>
                <br />
                <label class="radio-inline"> <input type="radio" name="entry.1796821509" value="その他" onClick="changeDisabled()" /> その他</label>
              </div>

              <div class="form-group">
                <label>お問い合わせ内容</label><span class="badge badge-danger text-danger">必須</span>
                <textarea placeholder="お問い合わせ内容" rows="10" class="form-control" name="entry.777598698" required></textarea>
                <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                <div class="help-block with-errors"></div>
              </div>
              <button type="submit" class="btn btn-primary">送信</button>
            </form>
          </div>
        </div>
      </div>
    </section>

    <!-- Footer sectiom -->
    <footer>
      <div class="footer-top">
        <div class="container">
          <div class="row">
            <p class="text-center">© <span id="current-year"></span> 富士マテリア</p>
          </div>
        </div>
      </div>
    </footer>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

    <!--自作のJS-->
    <script src="script.js"></script>

    <script src="bideo.js"></script>
    <script src="main.js"></script>
  </body>
</html>
