Harigami
ログイン
anonymous タイトルなし
No License HTML
コピー
<!DOCTYPE html>
<html lang="ja">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta content="IE=edge" http-equiv="X-UA-Compatible">
  <meta name="format-detection" content="telephone=no,address=no,email=no">

  <title>FAT DOG STAND</title>
  <meta name="description" content="こだわりのホットドッグとコーヒーを提供するお店。FAT DOG STANDを紹介するサイト">

  <!--  FONT Noto Sans JP-->
  <link href="https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&display=swap" rel="stylesheet">

  <link rel="stylesheet" href="css/reset.css">
  <link rel="stylesheet" href="css/access.css">
  <link rel="stylesheet" href="css/head_foot.css">

  <script src="https://kit.fontawesome.com/54fc518417.js"></script>

  <script src="js/jquery-3.4.1.min.js"></script>
  <script src="js/common.js"></script>
</head>

<body>
  <!-- ヘッダー -->
  <header class="header">
    <div class="header_box inner_max flex flex_center">
      <h1 class="header_logo"><a href="index.html"><img src="image/common/fds_logo.png" width="196" alt="FAT DOG STAND ロゴ"></a></h1>
      <div class="header_right">
        <div class="header_navbtn"><span></span><span></span><span></span></div>
        <nav class="header_nav">
          <ul class="nav_box flex">
            <li><a href="/index.html">HOME</a></li>
            <li><a href="fds_style.html">STYLE</a></li>
            <li><a href="menu.html">MENU</a></li>
            <li><a href="access.html">ACCESS</a></li>
            <li><a href="contact.html">CONTACT</a></li>
          </ul>
        </nav>
        <div class="main_copy">
          <p><img src="image/common/main_copy.png" width="730" alt="taste just one time"></p>
          <p>集い味わう。ただひとつの今を。</p>
        </div>
      </div>
    </div>
  </header>
  <!-- ヘッダー end -->
  <!--   ACCESS-->
  <main>
    <section>
      <h2 class="ttl">ACCESS</h2>
      <div class="ttl_line fadein3"><img src="image/common/ttl_line.png" alt="タイトルライン画像" width="300"></div>
      <ul class="access_link access_box inner fadein">
        <li class="access_list flex flex_between">
          <div class="access_text1">ADDRESS</div>
          <div class="access_text2">542-0012&nbsp;大阪市中央区谷町7-6-33<br><span class="min_cont">地下鉄谷町線 谷町六丁目駅3番出口から出て徒歩約3分
              <br>地下鉄長堀鶴見緑地線 松屋町駅3番出口から出て徒歩約3分</span></div>
        </li>
        <li class="access_list">
          <div class="access_text1">OPEN &nbsp; HOURS</div>
          <div class="access_text2">Week day &nbsp; 8:00-17:00
            <br>Sat.-Sun.Holiday &nbsp; 10:30-17:00</div>
        </li>
        <li class="access_list">
          <div class="access_text1">CL0SE</div>
          <div class="access_text2">Tueseday</div>
        </li>
        <li class="access_list">
          <div class="access_text1">TEL</div>
          <div class="access_text2"><a href="tel:06-6776-2236">06-6776-2236</a></div>
        </li>
        <li class="access_list">
          <div class="access_text1">E-MAIL</div>
          <div class="access_text2"><a href="mailto:fatdogstand@gmail.com">fatdogstand@gmail.com</a></div>
        </li>
        <li class="access_list">
          <div class="access_text1">PARKING</div>
          <div class="access_text2">None</div>
        </li>
      </ul>
    </section>
    <section>
      <div class="karahori_mv">
        <h2 class="ttl_white fadein">空堀商店街</h2>
        <p class="inner karahori_text white access_box fadein">商店街の中は昔ながらの個人商店が残る、人懐っこいローカルな雰囲気。もちろん商店街の中のお店も素敵ですが、一歩商店街から外に足を向けると、レトロな町屋がずらっと並んでいて、大正時代にタイムスリップしたような感覚に陥ります。</p>
      </div>
    </section>
    <!------------------------------------------------------    LOCATIONスタート-->
    <section class="loc">
      <h2 class="ttl">LOCATION</h2>
      <div class="ttl_line fadein3"><img src="image/common/ttl_line.png" alt="タイトルライン画像" width="300"></div>
      <div class="access_box loc_box inner fadein">
        <!--ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーmap違う場所-->
        <div class="map" id="map_top">
          <!--←このdivの中に地図画像とボタン画像を入れるそしてリラティブをかけて。その中のボタンにポジションアブソリュートをかける!-->
          <div class="map_img">
            <img src="image/access/karahorimap.jpg" alt="" width="">
            <div class="btn01" id="aa">
              <a href="#a"><img src="image/access/marka.png" alt=""></a>
            </div>
            <div class="btn02" id="bb">
              <a href="#b"><img src="image/access/markb.png" alt=""></a>
            </div>
            <div class="btn03" id="cc">
              <a href="#c"><img src="image/access/markc.png" alt=""></a>
            </div>
          </div>
        </div>
        <div class="shop">
          <ul class="shop_list" id="a">
            <li>
              <img src="image/access/shopex.jpg" alt="">
            </li>
            <li class="flex">
              <div class="shop_no"><img src="image/access/marka.png" alt=""></div>
              <div>
                <h3 class="shop_text1">店の名前</h3>
                <p class="shop_text2">店の特徴や説明店の特徴や説明店の特徴や説明店の特徴や説明</p>
                <div class="flex flex_around">
                  <p class="shop_link1"><a href="##">SHOP PAGE &gt;</a></p>
                  <p class="shop_link2"><a href="#map_top">BACK TO MAP &gt;</a></p>
                </div>
              </div>
            </li>
          </ul>
          <ul class="shop_list" id="b">
            <li>
              <img src="image/access/shopex.jpg" alt="">
            </li>
            <li class="flex">
              <div class="shop_no"><img src="image/access/markb.png" alt=""></div>
              <div>
                <h3 class="shop_text1">店の名前</h3>
                <p class="shop_text2">店の特徴や説明店の特徴や説明店の特徴や説明店の特徴や説明</p>
                <div class="flex flex_around">
                  <p class="shop_link1"><a href="##">SHOP PAGE &gt;</a></p>
                  <p class="shop_link2"><a href="#map_top">BACK TO MAP &gt;</a></p>
                </div>
              </div>
            </li>
          </ul>
          <ul class="shop_list" id="c">
            <li>
              <img src="image/access/shopex.jpg" alt="">
            </li>
            <li class="flex">
              <div class="shop_no"><img src="image/access/markc.png" alt=""></div>
              <div>
                <h3 class="shop_text1">店の名前</h3>
                <p class="shop_text2">店の特徴や説明店の特徴や説明店の特徴や説明店の特徴や説明</p>
                <div class="flex flex_around">
                  <p class="shop_link1"><a href="##">SHOP PAGE &gt;</a></p>
                  <p class="shop_link2"><a href="#map_top">BACK TO MAP &gt;</a></p>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </section>
  </main>
  <!-----------------------------------------------Location END-->
  <!----------------------------------ACCESS END-->
  <!-- フッター -->
  <footer class="footer">
    <div class="footer_box inner flex flex_around">
      <div class="fot_left">
        <div class="fot_logo">
          <img src="image/common/fds_logo_w.png" width="170" alt="fat dog stand ロゴ">
        </div>
        <ul class="fot_sns flex">
          <li><a href="#"><i class="fab fa-instagram"></i></a></li>
          <li><a href="#"><i class="fab fa-facebook-square"></i></a></li>
          <li><a href="#"><i class="fab fa-twitter-square"></i></a></li>
        </ul>
      </div>
      <nav class="fot_nav">
        <ul class="fot_nav_list">
          <li><a href="/index.html">HOME</a></li>
          <li><a href="fds_style.html">STYLE</a></li>
          <li><a href="menu.html">MENU</a></li>
          <li><a href="access.html">ACCESS</a></li>
          <li><a href="contact.html">CONTACT</a></li>
        </ul>
      </nav>
      <address class="address_box">
        <ul>
          <li><span>OPEN</span> : 8:00 - 17:00 ( weekday ) 10:30 - 17:00 ( holiday )</li>
          <li><span>CLOSE</span> : Tuesday</li>
          <li><span>ADDRESS</span> : 〒542-0012 大阪府大阪市中央区谷町7-6-33</li>
          <li><span>PHONE</span> : <a href="tel:06-6776-2236">06-6776-2236</a></li>
          <li><span>E-MAIL</span> : <a href="mailto:fatdogstand@gmail.com">fatdogstand@gmail.com</a></li>
        </ul>
      </address>
    </div>
    <p class="copy">Copyright &copy; 2019 FAT DOG STAND All Rights Reserved.</p>
  </footer>
  <!-- フッターend -->
</body>
</html>
<!DOCTYPE html>
<html lang="ja">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta content="IE=edge" http-equiv="X-UA-Compatible">
  <meta name="format-detection" content="telephone=no,address=no,email=no">

  <title>FAT DOG STAND</title>
  <meta name="description" content="こだわりのホットドッグとコーヒーを提供するお店。FAT DOG STANDを紹介するサイト">

  <!--  FONT Noto Sans JP-->
  <link href="https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&display=swap" rel="stylesheet">

  <link rel="stylesheet" href="css/reset.css">
  <link rel="stylesheet" href="css/access.css">
  <link rel="stylesheet" href="css/head_foot.css">

  <script src="https://kit.fontawesome.com/54fc518417.js"></script>

  <script src="js/jquery-3.4.1.min.js"></script>
  <script src="js/common.js"></script>
</head>

<body>
  <!-- ヘッダー -->
  <header class="header">
    <div class="header_box inner_max flex flex_center">
      <h1 class="header_logo"><a href="index.html"><img src="image/common/fds_logo.png" width="196" alt="FAT DOG STAND ロゴ"></a></h1>
      <div class="header_right">
        <div class="header_navbtn"><span></span><span></span><span></span></div>
        <nav class="header_nav">
          <ul class="nav_box flex">
            <li><a href="/index.html">HOME</a></li>
            <li><a href="fds_style.html">STYLE</a></li>
            <li><a href="menu.html">MENU</a></li>
            <li><a href="access.html">ACCESS</a></li>
            <li><a href="contact.html">CONTACT</a></li>
          </ul>
        </nav>
        <div class="main_copy">
          <p><img src="image/common/main_copy.png" width="730" alt="taste just one time"></p>
          <p>集い味わう。ただひとつの今を。</p>
        </div>
      </div>
    </div>
  </header>
  <!-- ヘッダー end -->
  <!--   ACCESS-->
  <main>
    <section>
      <h2 class="ttl">ACCESS</h2>
      <div class="ttl_line fadein3"><img src="image/common/ttl_line.png" alt="タイトルライン画像" width="300"></div>
      <ul class="access_link access_box inner fadein">
        <li class="access_list flex flex_between">
          <div class="access_text1">ADDRESS</div>
          <div class="access_text2">542-0012&nbsp;大阪市中央区谷町7-6-33<br><span class="min_cont">地下鉄谷町線 谷町六丁目駅3番出口から出て徒歩約3分
              <br>地下鉄長堀鶴見緑地線 松屋町駅3番出口から出て徒歩約3分</span></div>
        </li>
        <li class="access_list">
          <div class="access_text1">OPEN &nbsp; HOURS</div>
          <div class="access_text2">Week day &nbsp; 8:00-17:00
            <br>Sat.-Sun.Holiday &nbsp; 10:30-17:00</div>
        </li>
        <li class="access_list">
          <div class="access_text1">CL0SE</div>
          <div class="access_text2">Tueseday</div>
        </li>
        <li class="access_list">
          <div class="access_text1">TEL</div>
          <div class="access_text2"><a href="tel:06-6776-2236">06-6776-2236</a></div>
        </li>
        <li class="access_list">
          <div class="access_text1">E-MAIL</div>
          <div class="access_text2"><a href="mailto:fatdogstand@gmail.com">fatdogstand@gmail.com</a></div>
        </li>
        <li class="access_list">
          <div class="access_text1">PARKING</div>
          <div class="access_text2">None</div>
        </li>
      </ul>
    </section>
    <section>
      <div class="karahori_mv">
        <h2 class="ttl_white fadein">空堀商店街</h2>
        <p class="inner karahori_text white access_box fadein">商店街の中は昔ながらの個人商店が残る、人懐っこいローカルな雰囲気。もちろん商店街の中のお店も素敵ですが、一歩商店街から外に足を向けると、レトロな町屋がずらっと並んでいて、大正時代にタイムスリップしたような感覚に陥ります。</p>
      </div>
    </section>
    <!------------------------------------------------------    LOCATIONスタート-->
    <section class="loc">
      <h2 class="ttl">LOCATION</h2>
      <div class="ttl_line fadein3"><img src="image/common/ttl_line.png" alt="タイトルライン画像" width="300"></div>
      <div class="access_box loc_box inner fadein">
        <!--ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーmap違う場所-->
        <div class="map" id="map_top">
          <!--←このdivの中に地図画像とボタン画像を入れるそしてリラティブをかけて。その中のボタンにポジションアブソリュートをかける!-->
          <div class="map_img">
            <img src="image/access/karahorimap.jpg" alt="" width="">
            <div class="btn01" id="aa">
              <a href="#a"><img src="image/access/marka.png" alt=""></a>
            </div>
            <div class="btn02" id="bb">
              <a href="#b"><img src="image/access/markb.png" alt=""></a>
            </div>
            <div class="btn03" id="cc">
              <a href="#c"><img src="image/access/markc.png" alt=""></a>
            </div>
          </div>
        </div>
        <div class="shop">
          <ul class="shop_list" id="a">
            <li>
              <img src="image/access/shopex.jpg" alt="">
            </li>
            <li class="flex">
              <div class="shop_no"><img src="image/access/marka.png" alt=""></div>
              <div>
                <h3 class="shop_text1">店の名前</h3>
                <p class="shop_text2">店の特徴や説明店の特徴や説明店の特徴や説明店の特徴や説明</p>
                <div class="flex flex_around">
                  <p class="shop_link1"><a href="##">SHOP PAGE &gt;</a></p>
                  <p class="shop_link2"><a href="#map_top">BACK TO MAP &gt;</a></p>
                </div>
              </div>
            </li>
          </ul>
          <ul class="shop_list" id="b">
            <li>
              <img src="image/access/shopex.jpg" alt="">
            </li>
            <li class="flex">
              <div class="shop_no"><img src="image/access/markb.png" alt=""></div>
              <div>
                <h3 class="shop_text1">店の名前</h3>
                <p class="shop_text2">店の特徴や説明店の特徴や説明店の特徴や説明店の特徴や説明</p>
                <div class="flex flex_around">
                  <p class="shop_link1"><a href="##">SHOP PAGE &gt;</a></p>
                  <p class="shop_link2"><a href="#map_top">BACK TO MAP &gt;</a></p>
                </div>
              </div>
            </li>
          </ul>
          <ul class="shop_list" id="c">
            <li>
              <img src="image/access/shopex.jpg" alt="">
            </li>
            <li class="flex">
              <div class="shop_no"><img src="image/access/markc.png" alt=""></div>
              <div>
                <h3 class="shop_text1">店の名前</h3>
                <p class="shop_text2">店の特徴や説明店の特徴や説明店の特徴や説明店の特徴や説明</p>
                <div class="flex flex_around">
                  <p class="shop_link1"><a href="##">SHOP PAGE &gt;</a></p>
                  <p class="shop_link2"><a href="#map_top">BACK TO MAP &gt;</a></p>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </section>
  </main>
  <!-----------------------------------------------Location END-->
  <!----------------------------------ACCESS END-->
  <!-- フッター -->
  <footer class="footer">
    <div class="footer_box inner flex flex_around">
      <div class="fot_left">
        <div class="fot_logo">
          <img src="image/common/fds_logo_w.png" width="170" alt="fat dog stand ロゴ">
        </div>
        <ul class="fot_sns flex">
          <li><a href="#"><i class="fab fa-instagram"></i></a></li>
          <li><a href="#"><i class="fab fa-facebook-square"></i></a></li>
          <li><a href="#"><i class="fab fa-twitter-square"></i></a></li>
        </ul>
      </div>
      <nav class="fot_nav">
        <ul class="fot_nav_list">
          <li><a href="/index.html">HOME</a></li>
          <li><a href="fds_style.html">STYLE</a></li>
          <li><a href="menu.html">MENU</a></li>
          <li><a href="access.html">ACCESS</a></li>
          <li><a href="contact.html">CONTACT</a></li>
        </ul>
      </nav>
      <address class="address_box">
        <ul>
          <li><span>OPEN</span> : 8:00 - 17:00 ( weekday ) 10:30 - 17:00 ( holiday )</li>
          <li><span>CLOSE</span> : Tuesday</li>
          <li><span>ADDRESS</span> : 〒542-0012 大阪府大阪市中央区谷町7-6-33</li>
          <li><span>PHONE</span> : <a href="tel:06-6776-2236">06-6776-2236</a></li>
          <li><span>E-MAIL</span> : <a href="mailto:fatdogstand@gmail.com">fatdogstand@gmail.com</a></li>
        </ul>
      </address>
    </div>
    <p class="copy">Copyright &copy; 2019 FAT DOG STAND All Rights Reserved.</p>
  </footer>
  <!-- フッターend -->
</body>
</html>
現在、コメントはありません。
最初のコメンターになりませんか?