<{* 見出し変更 *}>
<{assign var="heading_category" value="CATEGORY"}>
<{assign var="heading_group" value="GROUP"}>
<{assign var="heading_contents" value="CONTENTS"}>
<{assign var="heading_recommend" value="RECOMMEND"}>
<{assign var="heading_seller" value="BEST SELLER"}>

<{* 検索キーワード *}>
<{assign var="search_placeholder" value="SEARCH..."}>
<{assign var="search_heading" value="KEYWORD"}>
<{assign var="search_keywords" value="テーブル,lamp,インテリア"}><{* ←使用しない場合はvalue="" *}>

<{* お気に入りページURL *}>
<{assign var="favorite_url" value="?mode=f1"}>

<{* パンくずのTOP *}>
<{assign var="breadcrumbs_top" value="TOP"}>

<{* メインビジュアルのボタン *}>
<{assign var="mv_link_label" value="VIEW"}>

<{* 店長エリアのボタン *}>
<{assign var="manager_link_label" value="Shop the sale"}>

<{* ボトム（ヘッダー上）のテキスト *}>
<{assign var="bottom_left_text" value="お買い物ごとに1％分の<br />ポイントが貯まります！"}>
<{assign var="bottom_right_text" value="10,000円以上のご注文で<br />送料無料！ "}>

<{* ヘッダー、フッターのコンテンツ（フリーページ）の最大表示数、value=""の場合は制限なし *}>
<{assign var="header_contents_max" value=""}>
<{assign var="footer_contents_max" value=""}>

<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@500&family=Noto+Sans+JP:wght@100..900&family=Roboto:wght@100..900&display=swap" onload="this.onload=null;this.rel='stylesheet'" />
<noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@500&family=Noto+Sans+JP:wght@100..900&family=Roboto:wght@100..900&display=swap" /></noscript>

<!-- ヘッダー -->
<div class="l-header">
  <div class="l-header-in u-container">
    <h1 class="l-header-logo">
      <a href="<{$home_url}>"><{if $logo != ""}><{$logo}><{else}><{$shop_name}><{/if}></a>
    </h1>
    <div class="l-header-nav">
      <{if $category|@count != 0}>
      <div class="l-header-nav__dropdown js-dropdown" ontouchstart="">
        <div class="l-header-nav__ttl"><{$heading_category}></div><{* カテゴリー *}>
        <div class="l-header-nav__dropdown-in">
          <div class="l-header-nav__lists">
            <{foreach from=$category item=cate name=cate}>
            <div class="l-header-nav__list">
              <a href="<{$cate.link_url}>">
                <div class="l-header-nav__blist"><{$cate.name}></div>
              </a>
              <{foreach from=$subcategory[$cate.bid] item=scate name=scate}>
              <{if $smarty.foreach.scate.first}>
              <ul class="l-header-nav__slist">
              <{/if}>
                <li>
                  <a href="<{$scate.link_url}>">
                    <span class="megamenu-subc"><{$scate.name}></span>
                  </a>
                </li>
              <{if $smarty.foreach.scate.last}>
              </ul>
              <{/if}>
              <{/foreach}>
            </div>
            <{/foreach}>
          </div>
        </div>
      </div>
      <{/if}>
      <{if $group|@count != 0}>
      <div class="l-header-nav__dropdown js-dropdown" ontouchstart="">
        <div class="l-header-nav__ttl"><{$heading_group}></div><{* グループ *}>
        <div class="l-header-nav__dropdown-in">
          <div class="l-header-nav__lists">
            <{foreach from=$group item=cate name=cate}>
            <div class="l-header-nav__list">
              <a href="<{$cate.link_url}>">
                <div class="l-header-nav__blist"><{$cate.name}></div>
              </a>
            </div>
            <{/foreach}>
          </div>
        </div>
      </div>
      <{/if}>
      <{if $freepage|@count != 0}>
      <div class="l-header-nav__dropdown js-dropdown" ontouchstart="">
        <div class="l-header-nav__ttl"><{$heading_contents}></div><{* コンテンツ *}>
        <div class="l-header-nav__dropdown-in">
          <div class="l-header-nav__lists">
            <{section name=num loop=$freepage}>            
            <div class="l-header-nav__list-contents<{if $smarty.section.num.iteration > $header_contents_max && $header_contents_max != ""}> is-hidden<{/if}>">
              <a href="<{$freepage[num].link_url}>">
                <div class="l-header-nav__blist"><{$freepage[num].page_title}></div>
              </a>
            </div>           
            <{if $smarty.section.num.iteration == $header_contents_max && $header_contents_max != ""}>
            <div class="l-header-nav__list-contents js-view-more"><div class="l-header-nav__blist">view more</div></div>
            <{/if}>		
            <{/section}>
          </div>
        </div>
      </div>
      <{/if}>
    </div>
    <div class="l-header-icon">
      <div id="search-icon" class="l-header-search">
        <svg role="img" aria-hidden="true"><use href="#icon-search"></use></svg>
      </div>
      <div class="l-header-favorite">
        <a href="<{$favorite_url}>">
          <svg role="img" aria-label="favorite button"><use href="#icon-heart"></use></svg>
        </a>
      </div>
      <div class="l-header-account js-dropdown" ontouchstart="">
        <svg role="img" aria-hidden="true"><use href="#icon-user"></use></svg>
        <div class="l-header-account-in">
          <ul class="l-header-account__list">
          <{if $members_use_flg == true}><{*会員機能を使っているか*}>
          <{if $members_login_flg == false}> 
          <{if $members_register_flg == true}><{*新規会員登録できるか*}>
            <li><a href="<{$members_regi_url}>">会員登録</a></li>
          <{/if}>
            <li><a href="<{$members_login_url}>">ログイン</a></li>
          <{else}>
            <li><a href="<{$members_login_url}>">ログアウト</a></li>
          <{/if}>
          <{/if}>
            <li><a href="<{$view_myaccount_url}>">マイアカウント</a></li>
          </ul>
        </div>
      </div>
      <div class="l-header-cart">
        <a href="<{$view_cart_url}>">
          <svg role="img" aria-label="cart button"><use href="#icon-cart"></use></svg>
          <{if $incart_total_count != "0"}>
          <span class="l-header-cart-in">
            <span class="l-header-cart__num"><{$incart_total_count}></span>
          </span>
          <{/if}>
        </a>
      </div>
      <button class="l-header-hamburger js-hamburger" aria-label="メニュー">
        <span></span>
        <span></span>
        <span></span>
      </button>
    </div>
    <div class="c-hamburger">
      <div class="c-hamburger-in">
        <{if $category|@count != 0}>
        <div class="c-accordion-item">
          <div class="c-accordion-item__ttl js-accordion-title">
            <{$heading_category}>
          </div>
          <div class="c-accordion-item__txt">
            <ul>
              <{section name=num loop=$category}>
              <li class="c-accordion-item__cate">
                <a href="<{$category[num].link_url}>">
                  <div><{$category[num].name}></div>
                </a>
              </li>
              <{/section}>
            </ul>
          </div>
        </div>
        <{/if}>
        <{if $group|@count != 0}>
        <div class="c-accordion-item">
          <div class="c-accordion-item__ttl js-accordion-title">
            <{$heading_group}>
          </div>
          <div class="c-accordion-item__txt">
            <ul>
              <{section name=num loop=$group}>
              <li class="c-accordion-item__cate">
                <a href="<{$group[num].link_url}>">
                  <div><{$group[num].name}></div>
                </a>
              </li>
              <{/section}>
            </ul>
          </div>
        </div>
        <{/if}>
        <{if $freepage|@count != 0}>
        <div class="c-accordion-item">
          <div class="c-accordion-item__ttl js-accordion-title">
            <{$heading_contents}>
          </div>
          <div class="c-accordion-item__txt">
            <ul>
              <{section name=num loop=$freepage}>
              <li class="c-accordion-item__cate<{if $smarty.section.num.iteration > $header_contents_max && $header_contents_max != ""}> is-hidden<{/if}>">
                <a href="<{$freepage[num].link_url}>">
                  <div><{$freepage[num].page_title}></div>
                </a>
              </li>
              <{if $smarty.section.num.iteration == $header_contents_max && $header_contents_max != ""}>
              <li class="c-accordion-item__cate js-view-more"><div>view more</div></li>
              <{/if}>
              <{/section}>
            </ul>
          </div>
        </div>
        <{/if}>
        <{if $favorite_url != ""}>
        <div class="c-hamburger-item">
          <div class="c-hamburger-item__ttl">
            <a href="<{$favorite_url}>">お気に入り商品</a>
          </div>
        </div>
        <{/if}>
        <{if $members_use_flg == true}><{*会員機能を使っているか*}>
        <{if $members_login_flg == false}> 
        <{if $members_register_flg == true}><{*新規会員登録できるか*}>
        <div class="c-hamburger-item">
          <div class="c-hamburger-item__ttl"><a href="<{$members_regi_url}>">会員登録</a></div>
        </div>
        <{/if}>
        <div class="c-hamburger-item">
          <div class="c-hamburger-item__ttl"><a href="<{$members_login_url}>">ログイン</a></div>
        </div>
        <{else}>
        <div class="c-hamburger-item">
          <div class="c-hamburger-item__ttl"><a href="<{$members_login_url}>">ログアウト</a></div>
        </div>
        <{/if}>
        <{/if}>
        <div class="c-hamburger-item">
          <div class="c-hamburger-item__ttl"><a href="<{$view_myaccount_url}>">マイアカウント</a></div>
        </div>
        <div class="c-hamburger-item">
          <div class="c-hamburger-item__ttl"><a href="<{$view_inq_url}>">お問い合わせ</a></div>
        </div>
      </div><!-- /.c-hamburger-in -->
    </div><!-- /.c-hamburger -->
  </div><!-- /.l-header-in -->

  <!-- 商品検索フォーム -->
  <div id="search-form">
    <form action="<{$product_search_url}>" method="get" id="srch">
      <{$product_search_mode}>
      <input type="text" name="keyword" value="" placeholder="<{$search_placeholder}>" />
      <button class="c-btn-search"><svg role="img" aria-hidden="true"><use href="#icon-search"></use></svg></button>
    </form>
    <{if $search_keywords != ""}>
    <h2 class="u-font-weight500"><{$search_heading}></h2>
    <div class="c-search__keyword" id="srh_keyword"></div>
    <{/if}>
  </div>
  <!-- // 商品検索フォーム -->
</div><!-- /.l-header -->
<!-- //ヘッダー -->
<div class="l-header-overlay js-overlay"></div>

<!-- メイン -->
<{if $tpl_name|truncate:4:"" == "free"}>
<div class="l-main u-container free <{$tpl_name}>">
  <div class="c-breadcrumbs">
    <ul class="c-breadcrumbs-list">
      <li class="c-breadcrumbs-list__item">
        <a class="c-breadcrumbs-list__link" href="<{$home_url}>"><{$breadcrumbs_top}></a>
      </li>
      <li class="c-breadcrumbs-list__item">
        <{$current_freepage_title}>
      </li>
    </ul>
  </div>
  <div>
    <{include file = $file_name}>
  </div>
</div>
<{else}>
<div class="l-main <{$tpl_name}>">
  <{include file = $file_name}>
</div>
<{/if}>
<!-- //メイン -->

<!-- ボトム -->
<div class="l-bottom">
  <div class="l-bottom-in u-container">
    <div class="l-bottom-block">
      <div class="l-bottom-block__icon">
        <svg role="img" aria-hidden="true"><use href="#shopping-bag"></use></svg>
      </div>
      <{$bottom_left_text}>
    </div>
    <div class="l-bottom-block">
      <div class="l-bottom-block__icon">
        <svg role="img" aria-hidden="true"><use href="#truck-delivery"></use></svg>
      </div>
      <{$bottom_right_text}>
    </div>
  </div>
</div>
<!-- //ボトム -->

<!-- フッター -->
<div class="l-footer">
  <div class="l-footer-in u-container">
    <div class="l-footer-block">
      <h2><{$heading_category}></h2>
      <ul>
        <{foreach from=$category item=cate name=cate}>
        <li>
          <a href="<{$cate.link_url}>"><{$cate.name}></a>
        </li>
        <{/foreach}>
      </ul>
    </div>
    <{if $group|@count != 0}>
    <div class="l-footer-block">
      <h2><{$heading_group}></h2>
      <ul>
        <{foreach from=$group item=cate name=cate}>
        <li>
          <a href="<{$cate.link_url}>"><{$cate.name}></a>
        </li>
        <{/foreach}>
      </ul>
    </div>
    <{/if}>
    <{if $freepage|@count != 0}>
    <div class="l-footer-block">
      <h2><{$heading_contents}></h2>
      <ul>
        <{foreach from=$freepage item=cate name=cate}>
        <li<{if $smarty.foreach.cate.iteration > $footer_contents_max && $footer_contents_max != ""}> class="is-hidden"<{/if}>>
          <a href="<{$cate.link_url}>"><{$cate.page_title}></a>
        </li>
        <{if $smarty.foreach.cate.iteration == $footer_contents_max && $footer_contents_max != ""}>
        <li class="js-view-more">view more</li>
        <{/if}>
        <{/foreach}>
      </ul>
    </div>
    <{/if}>
    <div class="l-footer-block">
      <h2>INFORMATION</h2>
      <ul>
        <li><a href="<{$sk_url}>#delivery">配送・送料について</a></li>
        <li><a href="<{$sk_url}>#payment">お支払い方法について</a></li>
        <li><a href="<{$sk_url}>#return">返品について</a></li>
        <li><a href="<{$sk_url}>#info">特定商取引法に基づく表記</a></li>
        <li><a href="<{$privacy_url}>">プライバシーポリシー</a></li>
      </ul>
    </div>
    <div class="l-footer-block">
      <h2>CUSTOMER</h2>
      <ul>
      <{if $members_use_flg == true}><{*会員機能を使っているか*}>
      <{if $members_login_flg == false}>
      <{if $members_register_flg == true}><{*新規会員登録できるか*}>
        <li class="linklist-item"><a href="<{$members_regi_url}>">会員登録</a></li>
      <{/if}>
        <li class="linklist-item"><a href="<{$members_login_url}>">ログイン</a></li>
      <{else}>
        <li class="linklist-item"><a href="<{$members_login_url}>">ログアウト</a></li>
      <{/if}>
      <{/if}>
        <li><a href="<{$view_myaccount_url}>">マイアカウント</a></li>
        <li><a href="<{$view_cart_url}>">カートを見る</a></li>
        <{if $mailmaga_url != ""}><li><a href="<{$mailmaga_url}>">メルマガ登録</a></li><{/if}>
        <li><a href="<{$view_inq_url}>">お問い合わせ</a></li>
      </ul>
    </div>
    <{if $facebook_url != "" ||  $twitter != "" ||  $instagram_url != "" ||  $youtube_url != ""}>
    <div class="l-footer-block l-footer-sns">
      <h2>FOLLOW US</h2>
      <ul>
      <{if $facebook_url != ""}>
        <li><a href="<{$facebook_url}>"><svg role="img" aria-label="facebook button"><use href="#icon-fb"></use></svg></a></li>
      <{/if}>
      <{if $twitter_url != ""}>
        <li><a href="<{$twitter_url}>"><svg role="img" aria-label="x button"><use href="#icon-x"></use></svg></a></li>
      <{/if}>
      <{if $instagram_url != ""}>
        <li><a href="<{$instagram_url}>"><svg role="img" aria-label="instagram button"><use href="#icon-insta"></use></svg></a></li>
      <{/if}>
      <{if $youtube_url != ""}>
        <li><a href="<{$youtube_url}>"><svg role="img" aria-label="youtube button"><use href="#icon-youtube"></use></svg></a></li>
      <{/if}>
      </ul>
    </div>
    <{/if}>
  </div><!-- /.l-footer-in -->
  <div class="l-footer-copyright u-container"><{$e_copyright}></div>
</div><!-- /.l-footer -->
<!-- //フッター -->

<!-- SVGアイコン -->
<svg xmlns="http://www.w3.org/2000/svg" style="display: none">
  <{* search *}>
  <symbol id="icon-search" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <circle cx="11" cy="11" r="8"></circle>
    <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
  </symbol>
  <{* account *}>
  <symbol id="icon-user" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
    <circle cx="12" cy="7" r="4"></circle>
  </symbol>
  <{* favorite *}>
  <symbol id="icon-heart" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z">
    </path>
  </symbol>
  <{* cart *}>
  <symbol id="icon-cart" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <circle cx="10" cy="20.5" r="1" />
    <circle cx="18" cy="20.5" r="1" />
    <path d="M2.5 2.5h3l2.7 12.4a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6l1.6-8.4H7.1" />
  </symbol>
  <{* arrow *}>
  <symbol id="arrow-move-right" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path d="M11 12h10" />
    <path d="M18 9l3 3l-3 3" />
    <path d="M7 12a2 2 0 1 1 -4 0a2 2 0 0 1 4 0z" />
  </symbol>
  <{* → *}>
  <symbol id="arrow-narrow-right" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path d="M5 12l14 0" />
    <path d="M15 16l4 -4" />
    <path d="M15 8l4 4" />
  </symbol>
  <{* + *}>
  <symbol id="stock-plus" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <line x1="12" y1="5" x2="12" y2="19"></line>
    <line x1="5" y1="12" x2="19" y2="12"></line>
  </symbol>
  <{* - *}>
  <symbol id="stock-minus" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <line x1="5" y1="12" x2="19" y2="12"></line>
  </symbol>
  <{* ★ *}>
  <symbol id="star" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path
      d="M8.243 7.34l-6.38 .925l-.113 .023a1 1 0 0 0 -.44 1.684l4.622 4.499l-1.09 6.355l-.013 .11a1 1 0 0 0 1.464 .944l5.706 -3l5.693 3l.1 .046a1 1 0 0 0 1.352 -1.1l-1.091 -6.355l4.624 -4.5l.078 -.085a1 1 0 0 0 -.633 -1.62l-6.38 -.926l-2.852 -5.78a1 1 0 0 0 -1.794 0l-2.853 5.78z"
      stroke-width="0" fill="currentColor" />
  </symbol>
  <{* バッグ *}>
  <symbol id="shopping-bag" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
    <path d="M6.331 8h11.339a2 2 0 0 1 1.977 2.304l-1.255 8.152a3 3 0 0 1 -2.966 2.544h-6.852a3 3 0 0 1 -2.965 -2.544l-1.255 -8.152a2 2 0 0 1 1.977 -2.304z" />
    <path d="M9 11v-5a3 3 0 0 1 6 0v5" />
  </symbol>
  <{* トラック *}>
  <symbol id="truck-delivery" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
    <path d="M7 17m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />
    <path d="M17 17m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />
    <path d="M5 17h-2v-4m-1 -8h11v12m-4 0h6m4 0h2v-6h-8m0 -5h5l3 5" />
    <path d="M3 9l4 0" />
  </symbol>
  <{* 電球 *}>
  <symbol id="bulb" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
    <path d="M3 12h1m8 -9v1m8 8h1m-15.4 -6.4l.7 .7m12.1 -.7l-.7 .7" />
    <path d="M9 16a5 5 0 1 1 6 0a3.5 3.5 0 0 0 -1 3a2 2 0 0 1 -4 0a3.5 3.5 0 0 0 -1 -3" />
    <path d="M9.7 17l4.6 0" />
  </symbol>
  
  <!-- SNSアイコン -->
  <{* Facebook *}>
  <symbol id="icon-fb" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path d="M7 10v4h3v7h4v-7h3l1 -4h-4v-2a1 1 0 0 1 1 -1h3v-4h-3a5 5 0 0 0 -5 5v2h-3" />
  </symbol>
  <{* X *}>
  <symbol id="icon-x" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path d="M4 4l11.733 16h4.267l-11.733 -16z" />
    <path d="M4 20l6.768 -6.768m2.46 -2.46l6.772 -6.772" />
  </symbol>
  <{* Instagram *}>
  <symbol id="icon-insta" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path d="M4 4m0 4a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z" />
    <path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" />
    <path d="M16.5 7.5l0 .01" />
    </symbol>
  <{* YouTube *}>
  <symbol id="icon-youtube" viewBox="0 0 24 24" fill="none">
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path d="M2 8a4 4 0 0 1 4 -4h12a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-12a4 4 0 0 1 -4 -4v-8z" />
    <path d="M10 9l5 3l-5 3z" />
  </symbol>
  <!-- //SNSアイコン -->
</svg>
<!-- //SVGアイコン -->

<script type="text/javascript" defer>
$(function () {
  $(".js-accordion-title").on("click", function () {
    $(this).next().slideToggle(100);
    $(this).toggleClass("is-open", 100);
  });

  //ドロップダウンメニュー
  const mql = window.matchMedia("(any-hover:hover)");
  if (mql.matches) {
    // hoverが使えるデバイスの処理
    $(".js-dropdown")
      .on("mouseenter", function () {
        $(this).addClass("is-open");
      })
      .on("mouseleave", function () {
        $(this).removeClass("is-open");
      });
  } else {
    // hoverが使えないデバイス(SP・タブレット用)の処理
    $(".js-dropdown > .l-header-nav__ttl, .js-dropdown > svg").on("click", function (e) {
      e.preventDefault();
      const $parent = $(this).parent('.js-dropdown');
      if(!$parent.hasClass('is-open')) {
        $('.js-dropdown').removeClass("is-open");
      }
      $parent.toggleClass("is-open");
    });
  }
    
  //検索ボタン押下後の枠展開・収納
  $('#search-icon, .js-overlay').on('click', function() {
    $('.l-header-overlay').toggleClass('is-on');
    $('#search-form').toggleClass('is-on');
    //ハンバーガーメニューは閉じておく
    $(".c-hamburger").removeClass("is-on");
    $(".l-header-hamburger").removeClass("is-on");
  });

  //search_keyword
  var str = "<{$search_keywords}>";	
  var str2 = str.split(',');
  var res = "";
  for(var i = 0; i < str2.length; i++) {
    res = res + '<span class="c-srh-keyword"><a href="?mode=srh&keyword=' + str2[i] + '">' + str2[i] + '</a></span>';
  }
  $('#srh_keyword').html(res);
    
  //商品詳細のオプション、プルダウン形式←→表形式　コメントアウト
  /*
  function window_size_switch_func() {
    if($(window).width() >= 768) {
      // product option switch -> table
      $('#prd-opt-table').html($('.prd-opt-table').html());
      $('#prd-opt-table table').addClass('table table-bordered');
      $('#prd-opt-select').empty();
      } else {
      // product option switch -> select
      $('#prd-opt-table').empty();
      if($('#prd-opt-select > *').size() == 0) {
        $('#prd-opt-select').append($('.prd-opt-select').html());
      }
    }
  }
  window_size_switch_func();
  $(window).resize(function () {
    window_size_switch_func();
  });	
  */
  
  //お気に入りボタン　ページ遷移を止める
  let favButtons = document.querySelectorAll(".c-btn-favorite button");
  for(let i=0;i<favButtons.length;i++){
    favButtons[i].addEventListener("click",function(e){
      e.preventDefault();
    });
  }
});

//ハンバーガーメニュー
$(".js-hamburger").on("click", function () {
  $(".c-hamburger").toggleClass("is-on");
  $(".l-header-hamburger").toggleClass("is-on");
  //検索窓は閉じておく
  $('.l-header-overlay').removeClass('is-on');
  $('#search-form').removeClass('is-on');
  //bodyをoverflow:hiddenにして固定する（古いiOSは不具合がでる）
  $("body").toggleClass("is-ofh");
});
$(window).resize(function () {
  if (window.innerWidth > 767) {
    $(".c-hamburger").removeClass("is-on");
    $(".l-header-hamburger").removeClass("is-on");
    $("body").removeClass("is-ofh");
  }
});
// view moreをクリックしたら、そのリストすべてを表示する
(function () {
  $('.js-view-more').on('click', function () {
    var $clickLink = $(this);
    var $viewList = $clickLink.siblings('.is-hidden');
    $viewList.removeClass('is-hidden');
    $clickLink.remove();
  });
}());
</script>

<{* 必要に応じて
<script type="application/ld+json">
{
  "@context" : "https://schema.org",
  "@type" : "WebSite",
  "name" : "<{$shop_name}>",
  "url" : "<{$rss_url|replace:"?mode=rss":""}>"
}
</script>
 *}>
