/*
Theme Name:   Kadence Child
Theme URI:    https://example.com
Description:  Kadence の子テーマ
Author:       あなたの名前
Author URI:   https://example.com
Template:     kadence
Version:      1.0.0
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;700;900&display=swap');
@font-face{
font-family: "gidoleregular";
src: url("fonts/gidole-regular.woff2") format("woff2"),
	url("fonts/gidole-regular.woff") format("woff"),
	url("fonts/Gidole-Regular.ttf") format("truetype");
font-weight: normal; font-style: normal; font-display: swap;
}

/* 全体に適用 */
:root {
--global-body-font-family: "gidoleregular", "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
--global-heading-font-family: "gidoleregular", "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
h1.cpt-title{font-family: "Gidole", "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;}

.font-tsukushi_l { font-family: "fot-tsukuardgothic-std", sans-serif; font-style: normal; font-weight: 200; }
.font-tsukushi { font-family: "fot-tsukuardgothic-std", sans-serif; font-style: normal; font-weight: 400; }

.font-shuei {font-family: dnp-shuei-mgothic-std, sans-serif; font-weight: 400;}
.font-shuei_b {font-family: dnp-shuei-mgothic-std, sans-serif; font-weight: 600;}

/* 文字装飾 */
.headline-underline{ position: relative; display: inline-block; }
.headline-underline::after{ content: ""; position: absolute; left: 0; right: 0; bottom: 0.12em; height: 0.42em; background: #cfd5d6; z-index: -1; border-radius: .06em; }
.palt {font-feature-settings: "palt";}

/* GLOBAL */
.fleft {float:left;}
.yokolist {flex-wrap: nowrap;}


/* 特定の画像ブロックにクラスを追加した場合 */
.hover-color img { filter: grayscale(100%); transition: filter 0.3s ease; }
.hover-color img:hover { filter: grayscale(0%); }

/* 子テーマ専用のカスタマイズCSS */
/* =========================================
* Pure CSS Sticky Header（JS不使用版）
* ========================================= */

.site-header { position: fixed !important; top: 0 !important; left: 0 !important; width: 100% !important; z-index: 9999 !important; transition: all 0.3s ease !important; background: transparent !important; border-bottom: .5px solid #ddd; }

body.home .site-header,
body.front-page .site-header,
body.archive .site-header { border-bottom: none !important; }

.scrolled.transparent-header .site-header { 
  background: rgba(255, 255, 255, 0.9) !important; box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1) !important; }

/* カスタムポストタイプ用を追加 */
.scrolled.non-transparent-header .site-header,
.scrolled.single-products .site-header {
background: rgba(255, 255, 255, 0.9) !important; box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1) !important; }

/* さらに安全策として */
.scrolled.single .site-header {
background: rgba(255, 255, 255, 0.9) !important; box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1) !important; }

.transparent-header .site-header { background: transparent !important; }

/* ヘッダーをホバーしたときは常に白背景 */
.transparent-header .site-header:hover,
.non-transparent-header .site-header:hover {
background: rgba(255, 255, 255, 0.691) !important; box-shadow: 0 2px 15px rgba(0,0,0,0.1) !important; }

/* スマホとタブレットでhero画像がヘッダーに隠れないようにする */
@media (max-width: 1024px) {
  /* 固定ヘッダーがある場合にコンテンツの上に余白を追加 */
  body.home main#inner-wrap,
  body.page-id-xx main#inner-wrap { padding-top: 52px; }
}

/* =========================================
slidk slider
========================================= */

/* ドットを横バーに変更（角丸なし・中央寄せ） */
.slick-hero .slick-dots { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex !important; gap: 8px; z-index: 20; justify-content: center; width: 100%; padding-left:0;}

.slick-hero .slick-dots li { margin: 0; width: auto; height: auto; }
.slick-hero .slick-dots li button { padding: 0; width: 25px; height: 3px; }
.slick-hero .slick-dots li button:before { content: ''; display: block; width: 100%; height: 100%; background: rgba(255,255,255,0.5); border-radius: 0; opacity: 1; }
.slick-hero .slick-dots li.slick-active button:before { background: #fff; }
.slick-dotted.slick-slider { margin-bottom: 0px !important; }

/* product archiveヘッダ画像設定： */
.yw-archive-hero{width:100%; background-size:cover; background-position:50% 75%; display:flex; align-items:center; height:240px !important; justify-content:center}
x.yw-archive-hero__inner{background:rgba(255,255,255,.7); padding:1rem 2rem; border-radius:.25rem; color:#fff;}
.yw-archive-hero__title{margin:0; font-size:clamp(1.4rem,3vw,2rem); color:#fff; }

/* 高さを固定してトリミングしたいなら： */
.archive-hero { height: 280px !important; } 
.archive-hero img { height:100%; object-fit:cover; } 


/* ========================================
INDEX カスタマイズ
======================================== */
/* トップページの投稿リストのレイアウト変更 */
.index_news .entry-header { display: flex !important; align-items: center !important; gap: 12px !important; flex-wrap: wrap !important; margin-bottom: 0 !important; }

/* 要素の並び順とマージン調整 */
.index_news .entry-meta,
.index_news .entry-taxonomies,
.index_news .entry-title { margin: 0 !important; line-height:1.2; }
.index_news ul.grid-cols {row-gap: .5rem;}
.index_news .entry-meta { order: 1 !important; font-size: 14px; }
.index_news .entry-taxonomies { order: 2 !important; font-size:60%;}
.index_news .entry-title { order: 3 !important; flex: 1 1 auto !important; }
.index_news .category-style-pill a { margin: 0 !important; }

/* 投稿間の余白を詰める */
.index_news .loop-entry { margin-bottom: 0px !important; }
.index_news .entry-content-wrap { padding: 0 0 .5rem 0 !important; }

/* タブレット以上でも1列に固定する（＝2カラム禁止） */
.index_news ul.grid-cols { display: grid !important; grid-template-columns: 1fr !important; }

/* PC表示：1行にする */
@media (min-width: 768px) {
    .index_news .entry-header { flex-wrap: nowrap !important; }
}

/* スマホ表示：タイトルだけ改行 */
@media (max-width: 767px) {
    .index_news .entry-title { flex-basis: 100% !important; width: 100% !important; }
    .index_news .entry-header { row-gap: 4px !important; column-gap: 12px !important; }
}


/* =========================================
CARD表示
========================================= */
/* カードを横並びに */
.wp-block-link-preview-cards-card .link-preview-card { display: flex; flex-direction: row; align-items: stretch; }

/* 画像を左側に固定幅 */
.wp-block-link-preview-cards-card .link-preview-card .link-preview-card-image {
	width: 250px; min-width: 250px; height: auto; border-radius: 8px 0 0 8px; border-top-right-radius: 0; }

/* テキストコンテンツを右側に */
.wp-block-link-preview-cards-card .link-preview-card .link-preview-card-content {
	flex: 1; display: flex; flex-direction: column; justify-content: center; }

/* スマホでは縦並びに戻す */
@media (max-width: 768px) {
	.wp-block-link-preview-cards-card .link-preview-card { flex-direction: column; }
	.wp-block-link-preview-cards-card .link-preview-card .link-preview-card-image { width: 100%; border-radius: 8px 8px 0 0; }
}



/* =========================================
PRODUCT
========================================= */
.product-category-section {margin-bottom: 3rem; text-align:center;}
.product-category-section h2.category-title {font-family: "gidoleregular"; color:#555; font-size: 1.5rem; margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 1px dashed #ccc;}
.product-category-section .product-grid {display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; margin-bottom: 2rem;}
.product-category-section .product-card {border: 1px solid #eee; padding: 0.5rem; background: #fff; transition: box-shadow 0.3s ease;}
.product-category-section .product-card__inner {display: block; text-decoration: none; color: inherit;}
.product-category-section .product-card__inner .thumb {aspect-ratio: 1/1; overflow: hidden; background: #fafafa; margin-bottom: 0.5rem;}
.product-category-section .product-card__inner .thumb img {width: 100%; height: 100%; object-fit: cover; display: block;}
.product-category-section h3.title {font-family: "gidoleregular"; font-size: 1rem; margin: 0; line-height: 1.4; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.product-category-section .product-namejp {font-size: 0.75rem; margin: 0.3rem 0 0; color: #999; line-height: 1.3;}

.product-category-section .product-card:hover {
	box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

/* タブレット表示 */
@media (max-width: 1024px) {
	.product-category-section .product-grid {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

/* スマートフォン表示 */
@media (max-width: 768px) {
	.product-category-section .product-grid {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 0.75rem !important;
	}
	.product-category-section .category-title {
		font-size: 1.3rem !important;
	}
}

@media (max-width: 480px) {
	.product-category-section .product-grid {
		grid-template-columns: 1fr !important;
	}
}

/* ===========================
   Kadence Table 左カラムだけ左寄せ
   =========================== */
.kb-table td:first-child,
.kb-table th:first-child {
  text-align: left !important;
}

/* ========== LABO: MixItUp フィルタUI ========== */
.labo-filter{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; align-items:center; margin: 1.25rem 0 1.5rem; padding:0; }

.labo-filter .labo-btn{ -webkit-appearance: none; -moz-appearance: none; appearance: none; display:inline-flex; align-items:center; justify-content:center; padding: .48rem .85rem; border: 1px solid #dedede; border-radius: 8px; background: #eaadad; background-color: #ffffff; color:#333; font-family: inherit; font-size:14px; line-height:1.2; cursor:pointer; box-sizing: border-box; transition: all .2s ease; white-space: nowrap; text-decoration: none; pointer-events: auto; position: relative; z-index: 10; }

.labo-filter .labo-btn:hover{ background:#f7f7f7; background-color:#f7f7f7; }

.labo-filter .labo-btn.is-active{ background:#cc6400; background-color:#cc6400; border-color:#cc6400; color:#fff; font-weight:600; }

@media (max-width: 640px){
.labo-filter{ gap:.4rem; }
.labo-filter .labo-btn{ font-size:13px; padding:.42rem .7rem; }
}

/* ========== LABO: MixItUp レイアウト調整 ========== */

/* 非表示要素を完全に削除（空白を残さない） */
.post-type-archive-labo .mixitup-hide,
.tax-labo_cat .mixitup-hide {
display: none !important;
visibility: hidden !important;
position: absolute !important;
left: -9999px !important;
width: 0 !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
opacity: 0 !important;
}

/* ========== LABO: 親要素も非表示にして空白削除 ========== */

/* 非表示になった.mixの親<li>も非表示に */
.post-type-archive-labo .entry-list-item:has(.mix[style*="display: none"]),
.post-type-archive-labo .entry-list-item:has(.mixitup-hide),
.tax-labo_cat .entry-list-item:has(.mix[style*="display: none"]),
.tax-labo_cat .entry-list-item:has(.mixitup-hide) {
display: none !important;
width: 0 !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
opacity: 0 !important;
visibility: hidden !important;
}

/* Safari対応：:has()が使えない場合の代替 */
.post-type-archive-labo li.entry-list-item,
.tax-labo_cat li.entry-list-item {
display: flex !important;
}

.post-type-archive-labo li.entry-list-item > article[style*="display: none"],
.tax-labo_cat li.entry-list-item > article[style*="display: none"] {
display: none !important;
}

/* 非表示の子を持つliを非表示 */
.post-type-archive-labo li.entry-list-item:not(:has(article:not([style*="display: none"]))),
.tax-labo_cat li.entry-list-item:not(:has(article:not([style*="display: none"]))) {
display: none !important;
}



/* =========================================
アーカイブ横スクロール
========================================= */
/* 横スクロールコンテナ */
.horizontal-scroll-posts { position: relative; overflow: hidden; padding: 0 50px; /* ボタン用のスペース */ }

/* グリッドの親要素を無効化 */
.horizontal-scroll-posts .content-wrap[class*="grid-"] { display: block !important; grid-template-columns: none !important; }

/* リストをフレックスに - 詳細度を最大限に */
body .horizontal-scroll-posts ul.kadence-posts-list.kb-posts-list.kb-posts-id-546_6b3843-c9,
body .horizontal-scroll-posts ul.kadence-posts-list.kb-posts-list,
body .horizontal-scroll-posts ul.kadence-posts-list,
.horizontal-scroll-posts ul.kadence-posts-list {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-behavior: smooth !important;
  gap: 20px !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  -webkit-overflow-scrolling: touch !important;
}

/* スクロールバー非表示 */
.horizontal-scroll-posts ul.kadence-posts-list::-webkit-scrollbar { display: none !important; }

/* 各投稿アイテム */
.horizontal-scroll-posts .kb-post-list-item {
  flex: 0 0 calc(25% - 15px) !important;
  min-width: calc(25% - 15px) !important;
  max-width: calc(25% - 15px) !important;
  width: calc(25% - 15px) !important;
}

/* スクロールボタン */
.scroll-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.95);
  border: 2px solid #ddd;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 100;
  transition: all 0.3s ease;
  box-shadow: 0 2px 12px rgba(0,0,0,0.15);
  font-size: 24px;
  font-weight: bold;
  color: #333;
  user-select: none;
}

.scroll-button:hover { background: #fff; box-shadow: 0 4px 16px rgba(0,0,0,0.25); transform: translateY(-50%) scale(1.1); border-color: #999; }
.scroll-button:active { transform: translateY(-50%) scale(0.95); }
.scroll-button.hidden { opacity: 0; pointer-events: none; }
.scroll-button-right { right: 10px; }
.scroll-button-left { left: 10px; }

/* タブレット */
@media (max-width: 1024px) {
  .horizontal-scroll-posts { padding: 0 45px; }
  .horizontal-scroll-posts .kb-post-list-item { flex: 0 0 calc(50% - 10px) !important; min-width: calc(50% - 10px) !important;
    max-width: calc(50% - 10px) !important; width: calc(50% - 10px) !important; }
  .scroll-button { width: 40px; height: 40px; font-size: 20px; }
}

/* モバイル */
@media (max-width: 767px) {
  .horizontal-scroll-posts { padding: 0 40px; /* ボタン用スペース */ }
  .horizontal-scroll-posts ul.kadence-posts-list { gap: 20px !important; }
  .horizontal-scroll-posts .kb-post-list-item {
    flex: 0 0 calc(100vw - 100px) !important; /* ビューポート幅ベース */
    min-width: calc(100vw - 100px) !important;
    max-width: calc(100vw - 100px) !important;
    width: calc(100vw - 100px) !important;
  }
  .scroll-button { width: 36px; height: 36px; font-size: 18px; background: rgba(255, 255, 255, 0.9); }
}

/* ========================================
 WP Store Locator カスタマイズ
======================================== */
/* 店舗タイプバッジ */
.store-type-badges { margin: 8px 0; display: flex; gap: 6px; flex-wrap: wrap; }
.store-type-badge { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 9.5px; font-weight: 600; letter-spacing: 0.5px; }

/* 店舗タイプ別の色 */
.badge-type_studio { background: #b8cb40; color: #fff; }
.badge-type_shop { background: #ef72aa; color: #fff; }
.badge-type_other { background: #5773ac; color: #fff; }
.badge-type_teacher { background: #7be3da; color: #fff; }
.badge-type_ywsm { background: #e9912e; color: #fff; }
.badge-type_fitnessclub {background: #f5de0e; color: #fff;}

/* 日本式住所 */
.wpsl-japanese-zip { display: block; margin-top: 4px; }

/* DirectionsとMore infoを横並びに */
.wpsl-store-location { position: relative; }
.wpsl-store-details.wpsl-store-listing { display: inline-block !important; margin-right: 15px; vertical-align: middle; }
.wpsl-store-details {font-weight:600;}
.wpsl-direction-wrap { display: inline-block !important; vertical-align: middle; }
.wpsl-direction-wrap a { vertical-align: middle; }

/* 距離を初期状態で非表示（ラグ防止） */
.wpsl-direction-wrap::before { content: ''; display: block; }

/* 店舗リスト全体 */
#wpsl-stores li { padding: 15px 0; }
.wpsl-store-location { line-height: 1.6; }
#wpsl-search-btn { padding: 5px 10px; }


/* -------- ulのデフォルトスタイルをリセット -------- */
#wpsl-stores > ul { padding: 0 !important; margin: 0 !important; list-style: none !important; }
#wpsl-result-list li p { padding-left: 0; margin: 0 0 10px 0; }
.wpsl-more-info-listings ul { padding: 5px 0 5px 0 !important; }
.wpsl-more-info-listings li { padding: 0 0 2px 0 !important; }


/* -------- PCで2列または3列表示 -------- */
@media (min-width: 900px) {
  #wpsl-stores > ul { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 18px; }

  #wpsl-stores > ul > li {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 10px 15px 5px 15px !important;
    list-style: none !important;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    transition: box-shadow 0.2s ease;
  }

  #wpsl-stores > ul > li:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.12); }
}

/* -------- タブレットサイズ（オプション） -------- */
@media (min-width: 600px) and (max-width: 899px) {
  #wpsl-stores > ul { display: grid !important; grid-template-columns: repeat(2, 1fr); gap: 16px; }
  #wpsl-stores > ul > li { width: 100% !important; float: none !important; margin: 0 !important; padding: 16px !important;
    list-style: none !important; box-sizing: border-box; background: #fff; border: 1px solid #e0e0e0; border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
  }
}

/* -------- モバイルは1列 -------- */
@media (max-width: 599px) {
  #wpsl-stores > ul { display: block !important; }
  #wpsl-stores > ul > li { width: 100% !important; margin-bottom: 16px !important; padding: 16px !important;
    background: #fff; border: 1px solid #e0e0e0; border-radius: 8px; box-shadow: 0 2px 6px rgba(0,0,0,0.06); }
}