/*
Theme Name:		Welcart Basic Child
Description:	Welcart Basic Child is child theme for Welcart Basic.
Author:			Collne Inc.
Author URI:		https://www.collne.com/
Template:		welcart_basic
Version:		1.0.0
License:		GNU General Public License v2 or later
License URI:	http://www.gnu.org/licenses/gpl-2.0.html
Tags:			responsive-layout, basic-child, two-columns, right-sidebar. left-sidebar
*/


/* 投稿ページでの更新日時・編集者・日付を非表示　20231102*/
.entry-meta {
	display:none;
}
/* -- .site-description -- */
.site-description {
	min-height: 40px;
	padding: .8333em 6.6667em .8333em .8333em;
	overflow: hidden;
	background: #fff;
	color: #313131;
	font-size: .85714em;/*下で変更*/
	font-weight: bold;
	font-size: 1em;
}
/*デバイスのメニューボタン*/
#site-navigation label span::before {
    color: #0a0a0a;
}
/*ヘッダー全部固定ver*/
.header {
  position: sticky;
  top: 0px;
  background-color: #fff;
  }
  
/*配送区分追加*/
.deliveryclass {
margin-bottom: .357143em;
float: none;
}
/*別サイトへとぶボタン*/
.fixed_button {
 position: fixed;
 right: 0;
 top: 200px;
 z-index: 500;
 transition: .3s ease all;
    color: #aaa;
    font-size: 3.214289em;
 }
 /*totalgymサイトと字体合わせる*/
 body {
 font-family: 'Noto sans JP', sans-serif;
 }
 
.item-name {
 font-family: 'Plus Jakarta Sans', sans-serif;
font-style: italic;
font-weight: 600;
font-size: 200%;
}
.field_price {
 color: #090909;
 font-family: 'Plus Jakarta Sans', sans-serif;
 font-weight: normal !important;
 font-size: 150% !important;
 }
 .itemprice  {
 color:  #090909;
 font-family: 'Plus Jakarta Sans', sans-serif;
 font-weight: normal !important;
 }
 .entry-content h2, .item-description h3 {
	font-family: 'Plus Jakarta Sans', sans-serif;
font-style: italic;
font-weight: 600;
font-size: 150%;
 }
 .page-title, #content .entry-title {
    margin-bottom: 2.222224em;
    font-size: 2em;
    line-height: 1.285712em;
}
.entry-content h2, .item-description h2 {
    margin-bottom: 1.25em;
	font-style: italic;
    padding-bottom: 0.312502em;
    border-bottom: 0px solid #eee;
    font-size: 175%;
    line-height: 1.25em;
}
.element.style {
}
a {
    color:   #090909;
    text-decoration: none;
    
}
.item-info .skubutton {
    padding: 0.714286em 2.142856em;
    -webkit-transition: .3s ease all;
    -moz-transition: .3s ease all;
    -o-transition: .3s ease all;
    transition: .3s ease all;
    border: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 0px;
    background-color: #666666c9;
    color: #fff;
    font-family: FontAwesome;
    font-weight: bold;
    letter-spacing: 10px;
    text-align: center;
}
@media screen and (min-width: 62.5em){
#itempage #img-box {
    width: 450px;
}
}
#itempage .assistance_item li .detail p  {
    display: none;
    }

    .entry-content input[type="submit"], .item-description input[type="submit"] {
        background-color: #f29b06;
        color: #fff;
    }
    input[type="button"], input[type="submit"], input[type="reset"] {
        padding: 0.714288em 8em;
        border-radius: 0px;
    }  
    /*フッターウィジェットエリア*/
/* .footer-left{
    text-align:left;
        float: left;
        margin-right: 2%;
        width: 48%;
            }
.footer-right{
                text-align:left;
                    float: left;
                    margin-right: 2%;
                    width: 48%;
                        } */

                        
                        
                        /*アイコン表示にして横並び*/
                        .snav {
                            padding: 40px 0 0 20px;
                            width: 60%;
                            }
                            .snav .membership {
                            width: 20%;
                            float: right;
                            }
                            .snav .membership i {
                            display: block;
                            padding: .454545em;
                            font-size: 1.6em;
                            text-align: center;
                            }
                            .snav .membership ul {
                            display: none;
                            }
                            .search-box {
                            position: inherit;
                            float: right;
                            }
                            .search-box div.s-box {
                            padding: 10px;
                            }
                            .incart-btn {
                            width: 100px;
                            min-width: 0px;
                            float: right;
                            clear: none;
                            }
                            .incart-btn i::before {
                            margin-right: 8px;
                            color: #262626;
                            }
                            .incart-btn a {
                            display: block;
                            background-color: transparent;
                            }
                            .incart-btn a:hover {
                            background-color: transparent;
                            }
                            .incart-btn .total-quant {
                            display: inline-block;
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: auto;
                            min-width: 20px;
                            max-width: 30px;
                            height: 20px;
                            -webkit-border-radius: 50%;
                            -moz-border-radius: 50%;
                            border-radius: 50%;
                            background-color: #fba60d;
                            color: #fff;
                            font-weight: bold;
                            text-align: center;
                            vertical-align: text-bottom;
                             font-size: 1em;
                            }
                            
                            h1.site-title, div.site-title{
                            width: auto;}
/* ロゴ：小さく（PC/Tablet） */
#masthead .site-title{
  margin:0 !important;
  padding:0 !important;
  width:auto !important;
  flex: 0 0 auto !important;
}
#masthead .site-title img{
  max-height: 56px !important;         /* ←ロゴサイズ */
  width:auto !important;
  max-width: 100% !important;
}
.snav .membership {
    width: 10%;
    float: right;
}
i.fa-user {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.incart-btn {
    width: 30px;
    min-width: 0px;
    float: right;
    clear: none;
}

/* ================================
   TOTALGYM simple header (Alo風)
================================ */

/* まず既存の snav レイアウト崩れ要因を無効化 */
#masthead .inner,
#masthead .inner.cf,
#masthead .snav,
#masthead .membership,
#masthead .incart-btn,
#masthead .search-box{
  float:none !important;
  width:auto !important;
  padding:0 !important;
  margin:0 !important;
}

/* 上段の横並びバー */
#masthead.site-header{
  position: sticky;
  top: 0;
  z-index: 9999;
  background:#fff;
  border-bottom: 1px solid #eee;
}

#masthead .tg-headerbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 18px;
  padding: 12px 18px;  /* ←余白はここで管理 */
}

/* Left: logo + nav */
#masthead .tg-left{
  display:flex;
  align-items:center;
  gap: 22px;
  min-width: 0;
}

/* ロゴ小さめ（ここでサイズ決める） */
#masthead .tg-logo img{
  max-height: 42px;
  width:auto;
  display:block;
}

/* ロゴ横ナビ（Alo風にシンプル） */
#masthead .tg-gnav{
  min-width: 0;
}
#masthead .tg-gnav-list{
  display:flex;
  align-items:center;
  gap: 22px;
  list-style:none;
  margin:0;
  padding:0;
  white-space:nowrap;
}
#masthead .tg-gnav-list a{
  text-decoration:none;
  color:#111;
  font-weight:600;
  font-size: 14px;
  letter-spacing: .03em;
}

/* Right tools */
#masthead .tg-right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 14px;
  flex: 0 0 auto;
  white-space:nowrap;
}

/* 検索BOX（小さく・主張少なく） */
#masthead .tg-search form{
  margin:0;
}
#masthead .tg-search input[type="search"],
#masthead .tg-search input[type="text"]{
  width: 220px;
  max-width: 28vw;
  height: 34px;
  border:1px solid #ddd;
  padding: 0 10px;
  box-sizing:border-box;
}

/* アイコンリンク */
#masthead .tg-iconlink{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  text-decoration:none;
  color:#111;
}

/* バッジ */
#masthead .tg-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:#fba60d;
  color:#fff;
  line-height:18px;
  font-size:12px;
  font-weight:700;
  text-align:center;
}

/* ログイン周り（見た目整える） */
#masthead .tg-auth{
  display:flex;
  align-items:center;
  gap: 10px;
  font-size: 13px;
}
#masthead .tg-auth a{
  text-decoration:none;
  color:#111;
  font-weight:600;
}
#masthead .tg-membername{
  font-weight:700;
}
#masthead .tg-sep{
  color:#aaa;
}

/* ====== Tablet/Mobile ====== */
@media (max-width: 1024px){
  /* 横幅が厳しい時は検索を少し短く */
  #masthead .tg-search input[type="search"],
  #masthead .tg-search input[type="text"]{
    width: 180px;
    max-width: 32vw;
  }
}

@media (max-width: 767px){
  /* モバイルは2段：上にロゴ＋アイコン、下にナビ */
  #masthead .tg-headerbar{
    flex-wrap:wrap;
    gap: 10px 12px;
  }
  #masthead .tg-left{
    width:100%;
    justify-content:space-between;
  }
  #masthead .tg-gnav{
    width:100%;
    order: 3;
  }
  #masthead .tg-gnav-list{
    gap: 14px;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom: 6px;
  }
  #masthead .tg-right{
    order: 2;
  }
  /* モバイルは検索をさらに短く（縦落ち防止） */
  #masthead .tg-search input[type="search"],
  #masthead .tg-search input[type="text"]{
    width: 150px;
    max-width: 48vw;
  }
  /* ログイン文字は短くしても良い */
  #masthead .tg-auth{
    gap: 8px;
    font-size: 12px;
  }
}
/* ===== Search Icon + Popup Modal ===== */
#masthead .tg-searchbtn{
  border:none;
  background:transparent;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:999px;
  color:#111;
}
#masthead .tg-searchbtn:focus{
  outline:2px solid #ddd;
  outline-offset:2px;
}

/* Modal hidden by default */
.tg-searchmodal{
  position:fixed;
  inset:0;
  z-index:100000;
  display:none;
}
.tg-searchmodal.is-open{
  display:block;
}

.tg-searchmodal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.35);
}

.tg-searchmodal__panel{
  position:relative;
  width:min(720px, 92vw);
  margin: 10vh auto 0;
  background:#fff;
  border-radius:12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.2);
  padding: 18px 18px 16px;
}

.tg-searchmodal__close{
  position:absolute;
  top:10px;
  right:12px;
  border:none;
  background:transparent;
  font-size:26px;
  line-height:1;
  cursor:pointer;
}

.tg-searchmodal__body form{
  margin:0;
}

/* WP標準検索フォームを整える */
.tg-searchmodal__body input[type="search"],
.tg-searchmodal__body input[type="text"]{
  width:100%;
  height:44px;
  border:1px solid #ddd;
  padding:0 12px;
  box-sizing:border-box;
  font-size:16px;
}
.tg-searchmodal__body input[type="submit"]{
  margin-top:10px;
  height:40px;
  padding:0 18px;
  border:none;
  background:#111;
  color:#fff;
  cursor:pointer;
}
/* ===== Search Modal Fix ===== */

/* 送信ボタンを完全に消す */
.tg-searchmodal__body input[type="submit"]{
  display:none !important;
}

/* 入力欄をきれいに */
.tg-searchmodal__body input[type="search"],
.tg-searchmodal__body input[type="text"]{
  width:100%;
  height:48px;
  padding:0 16px;
  border:1px solid #ddd;
  border-radius:8px;
  font-size:16px;
  outline:none;
  box-sizing:border-box;
}

/* フォーカス時 */
.tg-searchmodal__body input[type="search"]:focus,
.tg-searchmodal__body input[type="text"]:focus{
  border-color:#111;
}
.tg-searchmodal__body form{
  position:relative;
}

.tg-searchmodal__body form::after{
  content:"\f002";
  font-family:"Font Awesome 5 Free";
  font-weight:900;
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  color:#aaa;
  pointer-events:none;
}
/* =========================================================
   検索モーダル内の「×」を消す（標準/テーマ疑似要素/実体要素）
   ※ 必ず style.css の一番下に追記
========================================================= */

/* 1) Safari/Chrome の標準クリアボタンを消す */
.tg-searchmodal__body input[type="search"]::-webkit-search-cancel-button,
.tg-searchmodal__body input[type="search"]::-webkit-search-decoration,
.tg-searchmodal__body input[type="search"]::-webkit-search-results-button,
.tg-searchmodal__body input[type="search"]::-webkit-search-results-decoration{
  -webkit-appearance: none !important;
  appearance: none !important;
  display: none !important;
}

/* 2) Edge/IE 系のクリアボタンを消す */
.tg-searchmodal__body input[type="search"]::-ms-clear,
.tg-searchmodal__body input[type="search"]::-ms-reveal{
  display:none !important;
  width:0 !important;
  height:0 !important;
}

/* 3) テーマが form::after で「×」を描いているケースを消す（←スクショの原因これ） */
.tg-searchmodal__body form::after,
.tg-searchmodal__body .s-box form::after{
  content: none !important;
  display: none !important;
}

/* 4) HTMLに実体として「✕」input が入っているケースも消す（スクショ右側のDOMにそれっぽいのが見えてます） */
.tg-searchmodal__body input[value="✕"],
.tg-searchmodal__body input[value="×"]{
  display:none !important;
}

/* 5) ついで：右端に何かが被ってクリック不能になるのを防ぐ（×を消した後の保険） */
.tg-searchmodal__body,
.tg-searchmodal__body *{
  pointer-events: auto;
}
/* =========================================
   ナビが重なりそうになったら「メニューだけ」ハンバーガーにする
   まず 1100px を基準。必要に応じて数値を調整
========================================= */

/* PC広め：通常メニュー（横並び） */
@media (min-width:1101px){
  #site-navigation label,
  #site-navigation input.on-off{
    display:none !important;
  }

  /* メニュー本体は表示 */
  #site-navigation .header-nav-container,
  #site-navigation .nav-menu-open{
    display:block !important;
  }
}

/* ===============================
   1024px以下：メニューはハンバーガーに退避
=============================== */
@media (max-width:1100px){

  /* 横ナビ（ロゴ横のメニュー）を隠す */
  #masthead .tg-gnav{
    display:none !important;
  }

  /* ハンバーガーボタンを表示（後でHTMLに追加する） */
  #masthead .tg-menu-btn{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border:0;
    background:transparent;
    cursor:pointer;
  }

  #masthead .tg-menu-btn svg{
    width:24px;
    height:24px;
    display:block;
  }
}

/* 1025px以上：通常どおり横ナビ */
@media (min-width:1100px){
  #masthead .tg-menu-btn{ display:none !important; }
  #masthead .tg-gnav{ display:block !important; }
}
/* スライド式の簡易メニュー */
.tg-spmenu{
  position:fixed;
  top:0;
  right:0;
  width:min(360px, 88vw);
  height:100vh;
  background:#fff;
  z-index:100000;
  box-shadow:0 0 20px rgba(0,0,0,.15);
  padding:18px 18px 24px;
  overflow:auto;
}

.tg-spmenu ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}

.tg-spmenu a{
  display:block;
  padding:12px 10px;
  border-bottom:1px solid #eee;
}
/* =========================
   親だけ横並び／子はプルダウン表示（Welcart Basic用）
   対象：#menu-header（あなたの画面に出ているID）
========================= */

/* 親（第1階層）だけ横並び */
#masthead ul#menu-header{
  display:flex;
  align-items:center;
  gap: 28px;
}

/* 子以降が横並びに巻き込まれないように “全ての li” を一旦リセット */
#masthead ul#menu-header li{
  position: relative;
}

/* 子（第2階層の ul.sub-menu）は、親の下に浮かせて隠す */
#masthead ul#menu-header > li > ul.sub-menu{
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  min-width: 220px;
  padding: 12px 14px;
  margin: 10px 0 0;
  list-style: none;
  background: #fff;
  border: 1px solid #e6e6e6;
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
  z-index: 99999;
}

/* 子の中は縦並びにする（ここが重要：横並び崩れの根本対策） */
#masthead ul#menu-header > li > ul.sub-menu,
#masthead ul#menu-header > li > ul.sub-menu li{
  display: block !important;
  float: none !important;
}

/* 子のリンクを縦に並べて押しやすく */
#masthead ul#menu-header > li > ul.sub-menu a{
  display:block;
  padding: 8px 8px;
  white-space: nowrap;
}

/* ホバー or キーボード操作で開く */
#masthead ul#menu-header > li:hover > ul.sub-menu,
#masthead ul#menu-header > li:focus-within > ul.sub-menu{
  display: block;
}

/* タブレット/スマホ：ホバーが効きにくいので “タップで開ける” ための保険
   （親リンクを押して遷移してしまう場合はJSが必要。まずはCSSで整える） */
@media (max-width: 1024px){
  #masthead ul#menu-header > li > ul.sub-menu{
    margin-top: 6px;
  }
}
/* ===== ドロップダウンが閉じない問題の強制修正 ===== */

/* いったん「常に隠す」を強制 */
#masthead ul#menu-header > li > ul.sub-menu{
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 親 li に hover / focus-within の時だけ開く */
#masthead ul#menu-header > li:hover > ul.sub-menu,
#masthead ul#menu-header > li:focus-within > ul.sub-menu{
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* ===== ドロップダウンが「消える」対策：親の直下に密着させる ===== */

/* 親を基準にする */
#masthead ul#menu-header > li{
  position: relative;
}

/* サブメニューを親の真下に密着 */
#masthead ul#menu-header > li > ul.sub-menu{
  top: calc(100% + 8px) !important; /* 0pxにすると完全密着 / 8pxは少し余白 */
  left: 0 !important;
  z-index: 99999 !important;
  min-width: 240px;
}

/* hover が途切れにくいよう、親の下側に「見えない当たり」を作る */
#masthead ul#menu-header > li::after{
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 12px;           /* ←この高さ分、hoverが途切れにくくなる */
}
/* ===== ドロップダウン安定版（hover切れ対策） ===== */

/* 親を基準に */
#masthead ul#menu-header > li{
  position: relative;
}

/* サブメニューの基本状態 */
#masthead ul#menu-header > li > ul.sub-menu{
  display: none;
  position: absolute;
  left: 0;
  top: 100% !important;            /* まずは完全密着が一番安定 */
  z-index: 99999 !important;
  min-width: 240px;
}

/* 「親にhover」or「親の中でfocus」or「サブメニューにhover」なら表示 */
#masthead ul#menu-header > li:hover > ul.sub-menu,
#masthead ul#menu-header > li:focus-within > ul.sub-menu,
#masthead ul#menu-header > li > ul.sub-menu:hover{
  display: block;
}

/* hoverが途切れにくい“のりしろ”を作る（ただしクリックを邪魔しない！） */
#masthead ul#menu-header > li::after{
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 14px;
  pointer-events: none;            /* ★これが超重要：邪魔しない */
}
#img-box .item-video{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
}

#img-box .item-video iframe{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
/* 商品詳細全体を2カラムに整える */
#itempage,
.itemdetail,
.item-info,
#item-detail {
  overflow: hidden;
}

/* 左：画像 */
.itemimg,
#itempage .itemimg,
.item-photo {
  width: 42%;
  float: left;
  margin-right: 4%;
  box-sizing: border-box;
}

/* 左画像を枠内に収める */
.itemimg img,
.item-photo img {
  width: 100%;
  height: auto;
  display: block;
}

/* 右：タイトル・説明・動画 */
.itemdescription,
#itempage .itemdescription,
.description,
.item-info {
  width: 54%;
  float: left;
  box-sizing: border-box;
}

/* 動画を横幅いっぱいに */
.itemdescription video,
.itemdescription iframe,
.itemdescription .wp-video,
.itemdescription .mejs-container {
  width: 100% !important;
  max-width: 100%;
  height: auto !important;
}

/* 説明文の文字間と行間を少し整える */
.itemdescription p {
  line-height: 1.8;
  margin: 0 0 1em;
}

/* タイトル下の余白調整 */
.itemdescription h1,
.itemdescription h2,
#itempage h1 {
  margin-top: 0;
  margin-bottom: 10px;
}

/* 下に回り込み解除 */
#itempage::after,
.itemdetail::after {
  content: "";
  display: block;
  clear: both;
}
/* =========================================
   TOTALGYM 統合版 style.css 追記用
   - ヘッダー整理
   - PCドロップダウン安定化
   - スマホでハンバーガーを左寄せ
   - 横はみ出し防止
   - フッター修正
========================================= */

/* -------------------------
   1) 全体：横はみ出し防止
------------------------- */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

img,
iframe,
video,
canvas,
svg {
  max-width: 100%;
  height: auto;
}

#container,
#wrapper,
.site,
.site-content,
#page,
#content {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  box-sizing: border-box;
}

/* -------------------------
   2) ヘッダー共通整理
------------------------- */

/* 既存の崩れやすい float を整理 */
#masthead .inner,
#masthead .inner.cf,
#masthead .snav,
#masthead .membership,
#masthead .incart-btn,
#masthead .search-box {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box;
}

/* ヘッダー本体 */
#masthead.site-header {
  position: sticky;
  top: 0;
  z-index: 9999;
  background: #fff;
  border-bottom: 1px solid #eee;
}

/* 上段バー */
#masthead .tg-headerbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 12px 18px;
  width: 100%;
  box-sizing: border-box;
}

/* 左：ロゴ＋グロナビ */
#masthead .tg-left {
  display: flex;
  align-items: center;
  gap: 22px;
  min-width: 0;
  flex: 1 1 auto;
}

/* 右：検索・会員・カート */
#masthead .tg-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  flex: 0 0 auto;
  white-space: nowrap;
  min-width: 0;
}

/* ロゴ */
#masthead .site-title,
#masthead .tg-logo,
#masthead .site-branding,
#masthead .custom-logo-link {
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  flex: 0 0 auto !important;
}

#masthead .site-title img,
#masthead .tg-logo img,
#masthead .custom-logo {
  max-height: 56px !important;
  width: auto !important;
  max-width: 100% !important;
  display: block;
}

/* PCナビ */
#masthead .tg-gnav,
#masthead nav.tg-gnav {
  min-width: 0;
}

#masthead .tg-gnav-list,
#masthead ul#menu-header {
  display: flex;
  align-items: center;
  gap: 22px;
  list-style: none;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

#masthead .tg-gnav-list a,
#masthead ul#menu-header a {
  text-decoration: none;
  color: #111;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .03em;
}

/* 右アイコン */
#masthead .tg-iconlink,
#masthead .search-box a,
#masthead .membership a,
#masthead .incart-btn a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #111;
}

/* カートバッジ */
#masthead .tg-badge,
.incart-btn .total-quant {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #fba60d;
  color: #fff;
  line-height: 18px;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}

/* ログイン周り */
#masthead .tg-auth {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  white-space: nowrap;
}

#masthead .tg-auth a {
  text-decoration: none;
  color: #111;
  font-weight: 600;
}

#masthead .tg-membername {
  font-weight: 700;
}

#masthead .tg-sep {
  color: #aaa;
}

/* -------------------------
   3) PCドロップダウン安定版
------------------------- */

/* 親メニュー */
#masthead ul#menu-header > li,
#menu-header.tg-gnav-list > li {
  position: relative;
}

/* 子メニュー */
#masthead ul#menu-header > li > ul.sub-menu,
#menu-header.tg-gnav-list > li > ul.sub-menu {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  min-width: 240px;
  margin: 0;
  padding: 12px 14px;
  list-style: none;
  background: #fff;
  border: 1px solid #e6e6e6;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .10);
  z-index: 99999;
}

/* 子メニュー内は縦並び */
#masthead ul#menu-header > li > ul.sub-menu,
#masthead ul#menu-header > li > ul.sub-menu li,
#menu-header.tg-gnav-list > li > ul.sub-menu,
#menu-header.tg-gnav-list > li > ul.sub-menu li {
  display: block !important;
  float: none !important;
}

/* 子リンク */
#masthead ul#menu-header > li > ul.sub-menu a,
#menu-header.tg-gnav-list > li > ul.sub-menu a {
  display: block;
  padding: 8px 8px;
  white-space: nowrap;
  font-weight: 500;
}

/* hover / focus 中だけ表示 */
#masthead ul#menu-header > li:hover > ul.sub-menu,
#masthead ul#menu-header > li:focus-within > ul.sub-menu,
#masthead ul#menu-header > li > ul.sub-menu:hover,
#menu-header.tg-gnav-list > li:hover > ul.sub-menu,
#menu-header.tg-gnav-list > li:focus-within > ul.sub-menu,
#menu-header.tg-gnav-list > li > ul.sub-menu:hover {
  display: block;
}

/* hover 切れ防止のりしろ */
#masthead ul#menu-header > li::after,
#menu-header.tg-gnav-list > li::after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 14px;
  pointer-events: none;
}

/* -------------------------
   4) 1100px以下：横ナビを隠し、既存ハンバーガーを使う
------------------------- */
@media (max-width: 1100px) {

  /* 横並びナビを隠す */
  #masthead .tg-gnav,
  #masthead ul#menu-header {
    display: none !important;
  }

  /* 既存の site-navigation を見せる */
  #site-navigation,
  #site-navigation .header-nav-container,
  #site-navigation .nav-menu-open {
    display: block !important;
  }

  /* ハンバーガーボタンを左に寄せる */
  #site-navigation label,
  #site-navigation .menu-trigger,
  #site-navigation .drawer-toggle,
  #site-navigation .hamburger {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    padding: 0 !important;
    left: 0 !important;
  }

  /* 左ブロックを左寄せ */
  #masthead .tg-left {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
  }

  /* ロゴとハンバーガーの位置整理 */
  #masthead .site-title,
  #masthead .site-branding,
  #site-navigation {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 右側は詰めて表示 */
  #masthead .tg-right {
    gap: 12px;
  }
}

/* -------------------------
   5) スマホ（768px以下）
------------------------- */
@media (max-width: 768px) {

  #masthead.site-header {
    overflow: hidden;
  }

  #masthead .tg-headerbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px;
    padding: 10px 12px !important;
  }

  /* 左：ロゴ＋ハンバーガーを左寄せ */
  #masthead .tg-left {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    flex: 1 1 auto;
    min-width: 0;
  }

  /* 右：検索・会員・カート */
  #masthead .tg-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    flex: 0 0 auto;
    min-width: 0;
  }

  /* 横ナビは非表示 */
  #masthead .tg-gnav,
  #masthead ul#menu-header {
    display: none !important;
  }

  /* ハンバーガー左寄せ */
  #site-navigation,
  #site-navigation label,
  #site-navigation .menu-trigger,
  #site-navigation .drawer-toggle,
  #site-navigation .hamburger {
    margin-left: 0 !important;
    padding-left: 0 !important;
    left: 0 !important;
  }

  /* 右はみ出し防止 */
  .drawer,
  .drawer-menu,
  .offcanvas,
  .sp-menu,
  .global-nav,
  .header-nav,
  .search-box,
  .cart-box,
  .member-menu {
    max-width: 100%;
    width: 100% !important;
    box-sizing: border-box;
    left: 0;
    right: auto;
  }

  /* ログイン文字の縦崩れ防止 */
  #masthead .tg-right a,
  #masthead .tg-right span,
  #masthead .tg-right div,
  #masthead .tg-auth,
  #masthead .tg-auth a {
    white-space: nowrap !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    word-break: keep-all !important;
  }

  /* ロゴ少し小さめ */
  #masthead .site-title img,
  #masthead .tg-logo img,
  #masthead .custom-logo {
    max-height: 42px !important;
  }
}

/* -------------------------
   6) フッター
------------------------- */
#footer,
footer,
.site-footer {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: #000 !important;
  color: #fff !important;
  padding: 20px 16px;
  overflow: hidden;
}

#footer .inner,
#footer .inner.cf,
footer .inner,
footer .inner.cf,
.site-footer .inner,
.site-footer .inner.cf {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

#footer .inner > *,
#footer .inner.cf > *,
footer .inner > *,
footer .inner.cf > *,
.site-footer .inner > *,
.site-footer .inner.cf > * {
  box-sizing: border-box;
}

#footer,
#footer a,
#footer p,
#footer li,
#footer dt,
#footer dd,
footer,
footer a,
footer p,
footer li,
footer dt,
footer dd,
.site-footer,
.site-footer a,
.site-footer p,
.site-footer li,
.site-footer dt,
.site-footer dd {
  color: #fff !important;
}

#footer img,
footer img,
.site-footer img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 768px) {
  #footer,
  footer,
  .site-footer {
    padding: 20px 16px;
  }

  #footer .inner,
  #footer .inner.cf,
  footer .inner,
  footer .inner.cf,
  .site-footer .inner,
  .site-footer .inner.cf {
    display: block;
    width: 100%;
  }

  #footer .inner > *,
  #footer .inner.cf > *,
  footer .inner > *,
  footer .inner.cf > *,
  .site-footer .inner > *,
  .site-footer .inner.cf > * {
    display: block;
    width: 100%;
    margin: 0 0 20px 0;
    text-align: left;
    float: none;
    clear: both;
  }

  #footer ul,
  footer ul,
  .site-footer ul {
    margin: 0;
    padding-left: 0;
    list-style-position: inside;
    text-align: left;
  }

  #footer li,
  footer li,
  .site-footer li {
    text-align: left;
  }
}
/* 横スクロール防止 */
html, body {
  overflow-x: hidden;
}

/* フッター全体 */
#footer,
footer,
.site-footer {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: #000; /* 黒背景を明示 */
  color: #fff;
  padding: 20px 16px;
  overflow: hidden;
}

/* フッター内側 */
#footer .inner,
#footer .inner.cf,
footer .inner,
footer .inner.cf {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* フッター内の各ブロック */
#footer .inner > *,
#footer .inner.cf > *,
footer .inner > *,
footer .inner.cf > * {
  box-sizing: border-box;
}

/* 文字色を見えるように */
#footer,
#footer a,
#footer p,
#footer li,
#footer dt,
#footer dd,
footer,
footer a,
footer p,
footer li,
footer dt,
footer dd {
  color: #fff;
}

/* 画像ははみ出さない */
#footer img,
footer img {
  max-width: 100%;
  height: auto;
}

/* スマホ用 */
@media (max-width: 768px) {
  #footer,
  footer,
  .site-footer {
    padding: 20px 16px;
  }

  #footer .inner,
  #footer .inner.cf,
  footer .inner,
  footer .inner.cf {
    display: block;   /* flexをやめる */
    width: 100%;
  }

  #footer .inner > *,
  #footer .inner.cf > *,
  footer .inner > *,
  footer .inner.cf > * {
    display: block;
    width: 100%;
    margin: 0 0 20px 0;
    text-align: left;   /* 左揃え */
    float: none;        /* テーマのfloat解除 */
    clear: both;
  }

  #footer ul,
  footer ul {
    margin: 0;
    padding-left: 0;
    list-style-position: inside;
    text-align: left;
  }

  #footer li,
  footer li {
    text-align: left;
  }
}

/* 2026 */
#masthead.site-header {
  height: 80px;

}
.sp-only {
  display: none;
}

@media (max-width: 768px) {
#masthead.site-header {
  height: 60px;

}
.pc-only {
  display: none;
}
.sp-only {
  display: block;
}
}
.encompass-btn {
  max-width: 800px;
  margin-inline: auto;
}
#metaslider_2662_2 .flex-control-nav {
  top: auto !important;
  bottom: 0 !important;
  left: 50%;
  transform: translateX(-50%);
}

#metaslider_2662_2 .flex-direction-nav {
  top: auto !important;
  bottom: 20px !important;
  left: 50%;
  transform: translateX(-50%);
  max-width: 300px;
}

#masthead .tg-headerbar {
  flex-wrap: nowrap;
}
#metaslider_2662_2 .flex-control-nav {
  gap: 10px;
}
.metaslider .flex-control-nav li a {
  font-size: 18px !important;
}
@media (max-width: 560px) {
    #masthead .site-title img {
      width: 100px !important;
    }
        #masthead .tg-right {
          gap: 0 !important;
        }
        #masthead .tg-right .tg-account {
          display: none !important;
        }
        #masthead .tg-right .tg-auth {
          font-size: 11px;
          gap: 6px !important;
        }
}

.footer-nav-list {
  max-width: 750px;
}
.footer-nav-list h2 {
 margin-bottom: 10px;
}
.footer-content {
  display: flex;
  gap: 50px;
  justify-content: space-between;
}
.footer-right {
  flex:1.5;
}
.footer-left {
  flex:2;
  margin-top: 20px;
}
.footer_inner {
  max-width: 1300px;
  margin-inline: auto;
}
@media (max-width: 1100px) {
 .footer-content {
  flex-direction: column;
  gap: 30px;
 }
 .footer-left {
  width: 100%;
 }
}
@media (max-width: 620px) {
.footer-nav-list {
  flex-direction: column !important;
}
}
.site-content--shop{
    article {
        display: grid;
        grid-template-columns: 50% 46.429%;
        gap: 7.1rem 3.571%;
        row-gap: 0;
    }
        .detail-box {
        width:100%;
        float: none;
    }
    .itemimg, #itempage .itemimg {
      width: 100%;
    }
    .item-name {
      margin-bottom: 20px;
    }
    .item-info {
      width: 100%;
      float: none;
    }
        .item-info .field {
        text-align: left;
    }
    .storycontent {
      max-width: 600px;
    margin-inline: auto;
    }
    .item-info .zaikostatus,
    .item-info .field_price {
      text-align: right;
    }
    .item-info a {
      text-decoration: underline;
    }
    .deliveryclass {
      text-align: right;
    }
    .item-info .zaikostatus {
    float: none;
}

    @media (max-width: 900px) {
        article {
            grid-template-columns: 1fr;
            gap: 50px;
        }
    }

  }

      .cat-il.type-grid  {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
      }
          .cat-il.type-grid article {
            width: 100%;
          }

          @media (max-width: 900px) {
            .cat-il.type-grid {
              grid-template-columns: repeat(2, 1fr);
            }
          }
          @media (max-width: 500px) {
            .cat-il.type-grid {
              grid-template-columns: 1fr;
            }
          }

          .one-column #secondary{
            border: none;
          }
          .comments-area {
            border: none;
          }

          @media (max-width: 600px) {
    .wp-block-media-text.has-background>.wp-block-media-text__content {
        padding-top: 2rem;
    }
}

.shipping-table th,
.shipping-table td {
  padding: 1rem;
  line-height: 1.4em;
}
img[src*="Atag.png"] {
    display: none !important;
}
.circuit-text {
  font-size: 16px;
}
.shipping-table table,
.shipping-table tbody,
.shipping-table tr,
.shipping-table th,
.shipping-table td {
    display: block;
    width: 100%;
}