@charset "UTF-8";
/* 銀座田屋 星座ネクタイ特集ページ 専用スタイル（seiza.css）
   ・ベースは nabe2.css（.taya-lp）。nabe2.css は変更しない
   ・このファイルの指定はすべて .taya-constellation の中だけに効かせる（共通ヘッダー・フッターへ波及させない） */

.taya-constellation{
  --cz-night:#0C1729;
  --cz-night-2:#13223A;
  --cz-on-night:#F2F0E8;
  --cz-on-night-sub:#B9C1CF;
  --cz-paper:#F6F3EC;
  --cz-white:#FFFFFF;
  --cz-ink:#232B37;
  --cz-sub:#5A626E;
  --cz-gold:#CFBA87;
  --cz-gold-ink:#86703C;
  --cz-line-night:#7387A8;
  --cz-line-paper:#6A7890;
  --cz-rule:#DCD6C8;
  --cz-spring:#7F9C7A;
  --cz-summer:#2F6B6A;
  --cz-autumn:#A8823F;
  --cz-winter:#73859C;
  --cz-serif-en:"Times New Roman",Times,"Yu Mincho","YuMincho","Hiragino Mincho ProN",serif;
  --cz-mincho:"Yu Mincho","YuMincho","Hiragino Mincho ProN","Hiragino Mincho Pro","HG明朝E","MS P明朝",serif;
  --cz-gothic:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic","YuGothic","Meiryo",sans-serif;
  --cz-gutter:clamp(20px, 4.4vw, 64px);
  --cz-section:clamp(56px, 6vw, 88px);
  /* 固定ヘッダーの高さ（PC）。本番のヘッダー高さが違う場合はここだけ直す */
  --cz-header:97px;
  font-family:var(--cz-gothic);
  font-size:16px;
  color:var(--cz-ink);
  background:var(--cz-paper);
  letter-spacing:.02em;
  line-height:1.9;
  overflow-x:clip;
}
@media (max-width:768px){
  /* スマホは上部ヘッダーが固定されないため、余白だけ取る */
  .taya-constellation{--cz-header:0px}
}
.taya-constellation *,.taya-constellation *::before,.taya-constellation *::after{box-sizing:border-box}
.taya-constellation img{max-width:100%}
.taya-constellation a{color:inherit}
.taya-constellation :focus-visible{outline:2px solid var(--cz-gold-ink);outline-offset:3px}
.taya-constellation .cz-night :focus-visible{outline-color:var(--cz-gold)}
.taya-constellation [id]{scroll-margin-top:calc(var(--cz-header) + 24px)}
/* セクションへ飛んだときは、上の余白をとばして見出しが画面上部（ヘッダーの下 32px）に来るようにする */
.taya-constellation #zodiac-collection,
.taya-constellation #seasonal-collection,
.taya-constellation #astronomy-collection{scroll-margin-top:calc(var(--cz-header) + 32px - var(--cz-pt, var(--cz-section)))}
/* 白い背景のセクションが続くところは、上の余白を詰める（前のセクションの下余白と二重にしない） */
.taya-constellation #zodiac-collection{--cz-pt:clamp(40px, 4vw, 56px)}
.taya-constellation #seasonal-collection{--cz-pt:clamp(16px, 2vw, 24px)}
.taya-constellation #astronomy-collection{--cz-pt:clamp(16px, 2vw, 24px)}
.taya-constellation #zodiac-map{scroll-margin-top:calc(var(--cz-header) + 32px - clamp(48px, 6vw, 80px))}
.taya-constellation [tabindex="-1"]:focus{outline:none}

/* ローカル確認用ヘッダー（mercart-header.js）は自分で場所を取るため、nabe2 のヘッダー分の余白と二重にしない */
#mercart-shared-header + .taya-constellation{margin-top:0}

/* 本番スマホでサイト共通CSSが h1〜h3 に付ける背景・余白を打ち消す */
.taya-constellation h1,.taya-constellation h2,.taya-constellation h3{background:none;padding:0;margin:0;border:0;letter-spacing:inherit;text-align:left;font-weight:500;color:inherit}
.taya-constellation h1::before,.taya-constellation h1::after,
.taya-constellation h2::before,.taya-constellation h2::after,
.taya-constellation h3::before,.taya-constellation h3::after{content:none}
.taya-constellation h1 span,.taya-constellation h2 span,.taya-constellation h3 span{margin-top:0;font-weight:400}
.taya-constellation p{margin:0}
.taya-constellation ul,.taya-constellation ol{margin:0;padding:0;list-style:none}

.taya-constellation .cz-visually-hidden{
  position:absolute !important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.taya-constellation .cz-wrap{max-width:calc(1200px + var(--cz-gutter) * 2);margin:0 auto;padding:0 var(--cz-gutter)}
.taya-constellation .cz-br-sp{display:none}
@media (max-width:768px){.taya-constellation .cz-br-sp{display:inline}}

/* 暗い背景の帯 */
.taya-constellation .cz-night{background:var(--cz-night);color:var(--cz-on-night)}

/* 星座の線画をまとめて置く場所（画面には出さない） */
.taya-constellation .cz-sprite{position:absolute;width:0;height:0;overflow:hidden}
/* 星座の線画（<symbol> を <use> で再利用）。線は currentColor、星は --cz-star */
/* 星の色：星（circle）は色を指定せず、表示する側（.cz-fig）の fill を受け継ぐ */
.taya-constellation .cz-fig{fill:var(--cz-star)}
.taya-constellation .cz-fig{display:block;width:100%;height:auto;overflow:visible;color:var(--cz-line-night);--cz-star:#E9E4D4;transition:color .3s ease}

/* セクション見出し（欧文＋和文） */
.taya-constellation .cz-head{margin-bottom:clamp(32px, 4.4vw, 56px)}
.taya-constellation .cz-head__en{
  display:block;font-family:var(--cz-serif-en);font-size:clamp(13px, 1.1vw, 14px);letter-spacing:.28em;color:var(--cz-gold-ink);
}
.taya-constellation .cz-night .cz-head__en{color:var(--cz-gold)}
.taya-constellation .cz-head__ja{
  display:block;margin-top:10px;font-family:var(--cz-mincho);font-weight:500;
  font-size:clamp(24px, 2.6vw, 34px);line-height:1.5;letter-spacing:.1em;
}
.taya-constellation .cz-head__lead{margin-top:18px;max-width:640px;font-size:16px;line-height:2;color:var(--cz-sub)}
.taya-constellation .cz-night .cz-head__lead{color:var(--cz-on-night-sub)}
.taya-constellation .cz-new{
  display:inline-block;margin:0 0 0 .8em;padding:0 .7em;border:1px solid currentColor;
  font-family:var(--cz-serif-en);font-size:11px;line-height:1.9;letter-spacing:.18em;vertical-align:.45em;color:var(--cz-gold-ink);
}

/* 細い線の補助リンク（矢印つき） */
.taya-constellation .cz-textlink{
  display:inline-flex;align-items:center;gap:.6em;min-height:44px;
  font-size:14px;letter-spacing:.08em;text-decoration:none;
  border-bottom:1px solid transparent;transition:color .2s ease;
}
.taya-constellation .cz-textlink > span{border-bottom:1px solid currentColor;padding-bottom:2px}
.taya-constellation .cz-textlink:hover{color:var(--cz-gold-ink)}
.taya-constellation .cz-night .cz-textlink:hover{color:var(--cz-gold)}
.taya-constellation .cz-textlink--up::before{content:"↑";font-family:var(--cz-serif-en)}
.taya-constellation .cz-textlink--down::after{content:"↓";font-family:var(--cz-serif-en)}

/* =========================================
   A. ヒーロー（ブルーエレットと同じ：画面いっぱいの写真＋中央に文字）
   ========================================= */
.taya-constellation .cz-hero{position:relative;overflow:hidden;background:var(--cz-night)}
.taya-constellation .cz-hero__media,.taya-constellation .cz-hero__media img{display:block;width:100%}
.taya-constellation .cz-hero__media img{
  height:max(520px, calc(100vh - var(--cz-header)));object-fit:cover;object-position:center 45%;
}
/* 文字が載る中央だけをほんのり暗くし、下端は星図のネイビーへなじませる（写真の色は変えない） */
.taya-constellation .cz-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(to top, #0C1729 0, #0C1729 3px, rgba(12,23,41,.7) 26px, rgba(12,23,41,.3) 66px, rgba(12,23,41,0) 122px),
    radial-gradient(ellipse 46% 44% at 50% 50%, rgba(8,14,32,.66), rgba(8,14,32,.34) 45%, rgba(8,14,32,0) 74%);
}
.taya-constellation .cz-hero__body{
  position:absolute;inset:0;z-index:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;color:#fff;
  text-shadow:0 0 2px rgba(8,14,32,.8), 0 2px 10px rgba(8,14,32,.7);
}
.taya-constellation .cz-hero__eyebrow{font-family:var(--cz-serif-en);font-size:13px;letter-spacing:.3em;color:#fff}
.taya-constellation .cz-hero__h1{margin:0;font-size:inherit;font-weight:inherit;text-align:center;color:#fff}
/* nabe2.css の「.taya-lp h1 span」（金色・小さい欧文書体）を打ち消して、今までの見出し・説明文の見た目を保つ */
.taya-constellation .cz-hero__h1 .cz-hero__title,
.taya-constellation .cz-hero__h1 .cz-hero__lead{display:block;color:#fff}
.taya-constellation .cz-hero__h1 .cz-hero__lead{letter-spacing:.32px} /* 本文と同じ字間（h1 の字間を引き継がない） */
.taya-constellation .cz-hero__h1 .cz-hero__lead span{display:inline;margin:0;font:inherit;letter-spacing:inherit;color:inherit}
.taya-constellation .cz-hero__title{
  margin-top:clamp(14px, 1.8vw, 22px);font-family:var(--cz-mincho);font-weight:600;
  font-size:clamp(24px, 3.2vw, 44px);line-height:1.6;letter-spacing:.14em;text-align:center;color:#fff;
}
.taya-constellation .cz-hero__lead{margin:clamp(14px, 1.8vw, 22px) auto 0;max-width:640px;font-family:var(--cz-mincho);font-size:clamp(15px, 1.4vw, 17px);font-weight:600;line-height:2;color:#fff}
/* 主要リンク（ヒーローは白の細枠、締めの帯は金の細枠） */
.taya-constellation .cz-hero__cta{
  display:inline-flex;align-items:center;justify-content:center;gap:.8em;
  min-width:260px;height:54px;margin-top:clamp(24px, 3vw, 36px);padding:0 32px;
  border:1px solid var(--cz-gold-ink);border-radius:999px;color:var(--cz-ink);text-decoration:none;
  font-size:15px;letter-spacing:.12em;transition:background-color .3s ease, color .3s ease;
}
.taya-constellation .cz-hero__cta::after{content:"↓";font-family:var(--cz-serif-en)}
.taya-constellation .cz-hero__cta:hover{background:var(--cz-gold-ink);color:#fff}
.taya-constellation .cz-hero .cz-hero__cta{border-color:#fff;color:#fff;background:rgba(8,14,32,.25)}
.taya-constellation .cz-hero .cz-hero__cta:hover{background:#fff;color:var(--cz-ink);text-shadow:none}
.taya-constellation .cz-hero :focus-visible{outline-color:#fff}
.taya-constellation .cz-hero__sub{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 28px;margin-top:12px}
.taya-constellation .cz-hero__sub .cz-textlink{font-size:13px;color:#fff}
.taya-constellation .cz-hero__sub .cz-textlink:hover{color:var(--cz-gold)}

/* ヒーローのリンクは、ブルーエレットの「コレクションを見る」と同じ：白の下線＋下向きの山形の矢印 */
.taya-constellation .cz-hero .cz-hero__cta,
.taya-constellation .cz-hero__sub .cz-textlink{
  display:inline-flex;align-items:center;gap:14px;min-width:0;width:auto;max-width:none;height:auto;min-height:44px;padding:0 2px;
  border:0;border-bottom:1px solid #fff;border-radius:0;background:none;
  font-family:var(--cz-gothic);font-size:15px;font-weight:600;letter-spacing:.14em;color:#fff;text-decoration:none;
  text-shadow:0 0 2px rgba(8,14,40,.8), 0 1px 8px rgba(8,14,40,.7);
  transition:gap .3s ease, color .3s ease;
}
.taya-constellation .cz-hero .cz-hero__cta{margin-top:clamp(24px, 3vw, 40px);font-size:13px;min-height:40px}
.taya-constellation .cz-hero__sub .cz-textlink{font-size:13px;min-height:40px}
.taya-constellation .cz-hero__sub .cz-textlink > span{border-bottom:0;padding-bottom:0}
.taya-constellation .cz-hero .cz-hero__cta::after,
.taya-constellation .cz-hero__sub .cz-textlink::after{
  content:"";width:7px;height:7px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:translateY(-2px) rotate(45deg);font-family:inherit;
}
.taya-constellation .cz-hero .cz-hero__cta:hover,
.taya-constellation .cz-hero__sub .cz-textlink:hover{background:none;color:#fff;gap:18px;text-shadow:0 0 2px rgba(8,14,40,.8), 0 1px 8px rgba(8,14,40,.7)}
.taya-constellation .cz-hero__sub{gap:4px 36px;margin-top:18px}

/* =========================================
   B. 星図（12星座を選ぶ）
   ========================================= */
.taya-constellation .cz-map{position:relative;padding:clamp(48px, 6vw, 80px) 0}
.taya-constellation .cz-map .cz-head{text-align:center}
.taya-constellation .cz-map .cz-head__ja{text-align:center}
.taya-constellation .cz-map .cz-head__ja{font-size:clamp(20px, 2vw, 26px)}
/* 円形の星座ダイヤル */
.taya-constellation .cz-dial{position:relative;width:min(660px, 100%);aspect-ratio:1 / 1;margin:clamp(8px, 2vw, 24px) auto 0}
.taya-constellation .cz-dial__bg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.taya-constellation .cz-dial__face{fill:#0F1D33}
.taya-constellation .cz-dial__rings circle{fill:none;stroke:var(--cz-gold);stroke-opacity:.55;stroke-width:1;vector-effect:non-scaling-stroke}
.taya-constellation .cz-dial__ticks line{stroke:var(--cz-gold);stroke-opacity:.45;stroke-width:1;vector-effect:non-scaling-stroke}
.taya-constellation .cz-dial__wedge{fill:var(--cz-gold);fill-opacity:0;transition:fill-opacity .3s ease}
.taya-constellation .cz-dial__wedge.is-active{fill-opacity:.12}
.taya-constellation .cz-dial__list{position:absolute;inset:0;margin:0;padding:0;list-style:none}
/* リングの各星座：位置は left/top（中心）。扇形のマスの面積の中心（半径404/1000）に置く。真上の右隣がおひつじ座（data-i="0"）で時計回り */
.taya-constellation .cz-dial__item[data-i="0"]{left:60.46%;top:10.98%}
.taya-constellation .cz-dial__item[data-i="1"]{left:78.57%;top:21.43%}
.taya-constellation .cz-dial__item[data-i="2"]{left:89.02%;top:39.54%}
.taya-constellation .cz-dial__item[data-i="3"]{left:89.02%;top:60.46%}
.taya-constellation .cz-dial__item[data-i="4"]{left:78.57%;top:78.57%}
.taya-constellation .cz-dial__item[data-i="5"]{left:60.46%;top:89.02%}
.taya-constellation .cz-dial__item[data-i="6"]{left:39.54%;top:89.02%}
.taya-constellation .cz-dial__item[data-i="7"]{left:21.43%;top:78.57%}
.taya-constellation .cz-dial__item[data-i="8"]{left:10.98%;top:60.46%}
.taya-constellation .cz-dial__item[data-i="9"]{left:10.98%;top:39.54%}
.taya-constellation .cz-dial__item[data-i="10"]{left:21.43%;top:21.43%}
.taya-constellation .cz-dial__item[data-i="11"]{left:39.54%;top:10.98%}
.taya-constellation .cz-dial__item{
  position:absolute;width:16%;height:16%;transform:translate(-50%, -50%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  border-radius:50%;text-decoration:none;color:var(--cz-on-night);
}
.taya-constellation .cz-dial__glyph{
  font-family:"Segoe UI Symbol","Apple Symbols","Noto Sans Symbols","Hiragino Sans",sans-serif;font-variant-emoji:text;
  font-size:clamp(22px, 3.4vw, 34px);line-height:1;color:var(--cz-on-night);transition:color .3s ease;
}
.taya-constellation .cz-dial__item .cz-map__name{font-family:var(--cz-mincho);font-size:13px;line-height:1.3;letter-spacing:.06em;white-space:nowrap}
.taya-constellation .cz-dial__item:hover .cz-dial__glyph,
.taya-constellation .cz-dial__item.is-active .cz-dial__glyph{color:var(--cz-gold)}
.taya-constellation .cz-dial__item:hover .cz-map__name,
.taya-constellation .cz-dial__item.is-active .cz-map__name{color:var(--cz-gold)}
.taya-constellation .cz-dial__item:focus-visible{outline:2px solid var(--cz-gold);outline-offset:2px}
/* 中央：ふれた星座を大きく映す */
.taya-constellation .cz-dial__center{
  position:absolute;left:50%;top:50%;width:52%;transform:translate(-50%, -50%);
  display:flex;flex-direction:column;align-items:center;text-align:center;
}
.taya-constellation .cz-dial__center.is-swap{animation:cz-dial-in .5s ease}
@keyframes cz-dial-in{from{opacity:0;transform:translate(-50%, -46%)}to{opacity:1;transform:translate(-50%, -50%)}}
.taya-constellation .cz-dial__num{font-family:var(--cz-serif-en);font-size:12px;letter-spacing:.24em;color:var(--cz-gold)}
.taya-constellation .cz-dial__fig{width:78%;margin:10px 0 6px;color:#8FA2C2;--cz-star:#FFF8E6}
.taya-constellation .cz-dial__name{font-family:var(--cz-mincho);font-size:clamp(16px, 1.7vw, 21px);letter-spacing:.14em;line-height:1.4;color:var(--cz-on-night)}
.taya-constellation .cz-dial__date{margin-top:2px;font-size:13px;letter-spacing:.08em;color:var(--cz-on-night-sub)}
.taya-constellation .cz-dial__go{
  display:inline-flex;align-items:center;gap:.4em;min-height:40px;margin-top:6px;
  font-size:13px;letter-spacing:.06em;color:var(--cz-on-night);text-decoration:none;
}
.taya-constellation .cz-dial__go > span{border-bottom:1px solid currentColor;padding-bottom:2px}
.taya-constellation .cz-dial__go:hover{color:var(--cz-gold)}

.taya-constellation .cz-map__howto{margin-top:clamp(20px, 2.4vw, 28px);text-align:center;font-size:15px;color:var(--cz-on-night)}
.taya-constellation .cz-map__note{margin-top:6px;text-align:center;font-size:13px;color:var(--cz-on-night-sub)}


/* 季節・天文学への入口 */
.taya-constellation .cz-paths{
  display:grid;grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);gap:clamp(24px, 4vw, 64px);
}
.taya-constellation .cz-paths-sec{padding:clamp(40px, 5vw, 64px) 0 0;background:var(--cz-white)}
.taya-constellation .cz-paths__title{font-family:var(--cz-mincho);font-size:clamp(18px, 1.7vw, 21px);letter-spacing:.12em;line-height:1.6}
.taya-constellation .cz-paths__en{display:block;margin:0 0 4px;line-height:1.6;font-family:var(--cz-serif-en);font-size:12px;letter-spacing:.28em;color:var(--cz-gold-ink)}
.taya-constellation .cz-paths__seasons{display:grid;grid-template-columns:repeat(4, 1fr);gap:8px;margin-top:16px}
.taya-constellation .cz-paths__season{
  display:flex;flex-direction:column;justify-content:center;min-height:64px;padding:8px 14px;
  border-left:2px solid var(--cz-season, var(--cz-gold-ink));text-decoration:none;color:var(--cz-ink);
  transition:background-color .2s ease;
}
.taya-constellation .cz-paths__season:hover{background:#F3EDDF}
.taya-constellation .cz-paths__season .ja{font-family:var(--cz-mincho);font-size:16px;letter-spacing:.1em;line-height:1.5}
.taya-constellation .cz-paths__season .en{font-family:var(--cz-serif-en);font-size:12px;letter-spacing:.2em;color:var(--cz-sub);line-height:1.4}
.taya-constellation .cz-paths__astro p{margin-top:12px;font-size:14px;line-height:1.9;color:var(--cz-sub)}
.taya-constellation .cz-paths__astro p.cz-paths__en{margin-top:0;font-size:12px;line-height:1.6;color:var(--cz-gold-ink)}
.taya-constellation .cz-paths__astro .cz-textlink{margin-top:4px}
/* 「天文学のモチーフを見る」：ヒーローのリンクと同じ形（下線＋山形の矢印）。白地なので文字は濃紺 */
.taya-constellation .cz-paths__astro .cz-textlink{
  gap:14px;min-height:44px;padding:0 2px;border-bottom:1px solid currentColor;
  font-size:14px;font-weight:600;letter-spacing:.14em;color:var(--cz-ink);transition:gap .3s ease, color .3s ease;
}
.taya-constellation .cz-paths__astro .cz-textlink > span{border-bottom:0;padding-bottom:0}
.taya-constellation .cz-paths__astro .cz-textlink::after{
  content:"";width:7px;height:7px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:translateY(-2px) rotate(45deg);font-family:inherit;
}
.taya-constellation .cz-paths__astro .cz-textlink:hover{gap:18px;color:var(--cz-ink)}

/* 季節ごとの補助色（商品そのものの色は変えない） */
.taya-constellation [data-season="spring"]{--cz-season:var(--cz-spring)}
.taya-constellation [data-season="summer"]{--cz-season:var(--cz-summer)}
.taya-constellation [data-season="autumn"]{--cz-season:var(--cz-autumn)}
.taya-constellation [data-season="winter"]{--cz-season:var(--cz-winter)}

/* =========================================
   C. 商品（共通）
   ========================================= */
.taya-constellation .cz-collection{padding:var(--cz-pt, var(--cz-section)) 0 var(--cz-section)}
.taya-constellation .cz-prod__frame{position:relative}
.taya-constellation .cz-prod__media{
  position:relative;display:block;aspect-ratio:1 / 1;overflow:hidden;background:var(--cz-white);
}
.taya-constellation .cz-prod__media img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;transition:opacity .5s ease}
.taya-constellation .is-loading .cz-prod__media img{opacity:0}
/* 画像準備中（未設定・読み込み失敗） */
.taya-constellation .cz-prod__noimg{
  position:absolute;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;gap:6px;
  background:repeating-linear-gradient(135deg, #F1EDE3 0 10px, #EDE8DC 10px 20px);
  color:var(--cz-sub);font-size:14px;letter-spacing:.12em;text-align:center;
}
.taya-constellation .cz-prod__noimg small{font-size:12px;letter-spacing:.06em}
.taya-constellation .is-img-error .cz-prod__noimg{display:flex}
.taya-constellation .is-img-error .cz-prod__media img{visibility:hidden}

/* 画像の切り替え（1〜3枚目） */
.taya-constellation .cz-prod__views{display:flex;gap:6px;margin-top:8px}
.taya-constellation .cz-prod__views[hidden]{display:none}
.taya-constellation .cz-view{
  width:40px;height:40px;padding:0;border:1px solid var(--cz-rule);background:var(--cz-white);cursor:pointer;overflow:hidden;
}
.taya-constellation .cz-view img{display:block;width:100%;height:100%;object-fit:cover}
.taya-constellation .cz-view:hover{border-color:var(--cz-line-paper)}
.taya-constellation .cz-view[aria-pressed="true"]{border-color:var(--cz-ink);box-shadow:inset 0 0 0 1px var(--cz-ink)}

/* 商品名・色名・価格：ブルーエレットと同じ組み方（明朝の商品名、右に小さく色名、下に価格） */
.taya-constellation .cz-prod__name{display:inline;margin:0;font-family:var(--cz-mincho);font-size:clamp(16px, 1.5vw, 19px);font-weight:500;line-height:1.5;letter-spacing:.06em;color:var(--cz-ink)}
.taya-constellation .cz-prod__color{display:inline-block;margin-left:10px;font-size:13px;letter-spacing:.1em;color:var(--cz-sub);white-space:nowrap}
.taya-constellation .cz-prod__color:empty{display:none}
.taya-constellation .cz-prod__price{margin-top:2px;font-size:15px;letter-spacing:.04em;color:var(--cz-ink);font-variant-numeric:tabular-nums}
.taya-constellation .cz-prod__price.is-muted{font-size:13px;color:var(--cz-sub)}
.taya-constellation .cz-prod__desc{margin-top:10px;font-size:14px;line-height:1.85;color:var(--cz-ink)}
.taya-constellation .is-phrased{word-break:keep-all;overflow-wrap:anywhere;line-break:strict}
.taya-constellation .cz-prod__desc[hidden]{display:none}
.taya-constellation .cz-prod__spec{margin-top:6px;font-size:12px;line-height:1.7;color:var(--cz-sub)}
.taya-constellation .cz-prod__spec span + span::before{content:"／";margin:0 .4em}
.taya-constellation .cz-prod__spec span{display:inline-block;white-space:nowrap}

/* 色見本（複数色のときだけ） */
.taya-constellation .cz-prod__colors{display:flex;flex-wrap:wrap;gap:2px;margin:8px 0 0 -6px}
.taya-constellation .cz-prod__colors[hidden]{display:none}
.taya-constellation .cz-chip{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;padding:0;margin:0;border:0;background:none;cursor:pointer;border-radius:50%;
}
.taya-constellation .cz-chip__swatch{
  display:block;width:32px;height:32px;border-radius:50%;overflow:hidden;background:var(--cz-rule);
  box-shadow:0 0 0 1px rgba(0,0,0,.12);transition:box-shadow .2s ease;
}
.taya-constellation .cz-chip__swatch img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.6)}
.taya-constellation .cz-chip[aria-pressed="true"] .cz-chip__swatch{box-shadow:0 0 0 2px var(--cz-paper), 0 0 0 3px var(--cz-ink)}
.taya-constellation .cz-chip:focus-visible{outline-offset:0}

/* 商品を見る（金の細枠の丸いボタン：ブルーエレットと同じ形） */
.taya-constellation .cz-prod__cta{
  display:flex;align-items:center;justify-content:center;
  width:100%;max-width:160px;height:42px;margin:14px 0 0;padding:0 16px;
  border:1px solid var(--cz-gold-ink);border-radius:999px;
  font-size:13px;letter-spacing:.1em;color:var(--cz-ink);text-decoration:none;
  transition:background-color .3s ease, color .3s ease;
}
.taya-constellation a.cz-prod__cta:hover{background:var(--cz-gold-ink);color:#fff}
/* SOLD OUT：灰色で押せない（在庫切れ・商品データに無い商品） */
.taya-constellation .cz-prod__cta.is-soldout{background:#B3B3B3;border-color:#B3B3B3;color:#fff;font-family:var(--cz-serif-en);letter-spacing:.16em;cursor:not-allowed;pointer-events:none}
.taya-constellation .is-soldout .cz-prod__media{cursor:default}
.taya-constellation .cz-prod__price[hidden]{display:none}

.taya-constellation .cz-status{padding:24px 0;text-align:center;font-size:15px;color:var(--cz-sub)}
.taya-constellation .cz-status a{text-decoration:underline}

/* =========================================
   D. 12星座の個別セクション
   ========================================= */
.taya-constellation .cz-sign__list,
.taya-constellation .cz-season__list,
.taya-constellation .cz-astro__row{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:clamp(40px, 4.4vw, 56px) clamp(20px, 2.4vw, 32px)}
.taya-constellation .cz-sign__list{padding-top:clamp(32px, 4vw, 48px);border-top:1px solid var(--cz-rule)}
.taya-constellation .cz-sign{display:flex;flex-direction:column;min-width:0}
/* 星図・ダイヤルから選んだ商品を金の枠で囲む（JavaScriptが無いときは :target で同じ表示） */
.taya-constellation .cz-prod{--cz-sel-pad:12px;outline:2px solid transparent;outline-offset:var(--cz-sel-pad);transition:outline-color .4s ease, background-color .4s ease, box-shadow .4s ease}
/* 枠の内側（余白も含めて）をごく薄いベージュに */
.taya-constellation .cz-prod.is-selected,
.taya-constellation:not(.cz-js) .cz-prod:target{outline-color:var(--cz-gold);background-color:#FBF8F1;box-shadow:0 0 0 var(--cz-sel-pad) #FBF8F1}
.taya-constellation .cz-sign__info{margin-top:12px}

.taya-constellation .cz-sign__head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:8px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--cz-rule)}
.taya-constellation .cz-sign__num{display:block;font-family:var(--cz-serif-en);font-size:11px;letter-spacing:.2em;color:var(--cz-gold-ink)}
.taya-constellation .cz-sign__title{margin-top:2px;font-family:var(--cz-mincho);font-size:20px;line-height:1.4;letter-spacing:.1em}
.taya-constellation .cz-sign__icon{width:64px}
.taya-constellation #zodiac-collection{background:var(--cz-white)}
.taya-constellation .cz-sign__titlerow{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 10px;margin-top:2px}
.taya-constellation .cz-sign__titlerow .cz-sign__title{margin-top:0}
.taya-constellation .cz-sign__date{font-size:12px;letter-spacing:.04em;color:var(--cz-sub);white-space:nowrap}
.taya-constellation .cz-sign__icon .cz-fig{color:var(--cz-line-paper);--cz-star:var(--cz-ink)}
/* 到着の合図：星座アイコンを一度だけ明るくする */
.taya-constellation .is-arrived .cz-sign__icon .cz-fig,
.taya-constellation .is-arrived .cz-season__deco{animation:cz-arrive 1.6s ease 1}
@keyframes cz-arrive{
  0%{color:var(--cz-line-paper);--cz-star:var(--cz-ink);filter:none}
  35%{color:var(--cz-gold-ink);--cz-star:var(--cz-gold-ink);filter:drop-shadow(0 0 6px rgba(207,186,135,.9))}
  100%{color:var(--cz-line-paper);--cz-star:var(--cz-ink);filter:none}
}

.taya-constellation .cz-sign__nav{display:flex;flex-direction:column;align-items:flex-start;margin-top:auto;padding-top:8px}
.taya-constellation .cz-sign__nav .cz-textlink,.taya-constellation .cz-season__nav .cz-textlink,.taya-constellation .cz-astro__nav .cz-textlink{min-height:36px;font-size:12px}

/* =========================================
   E. 四季の星座
   ========================================= */
.taya-constellation .cz-seasons{background:var(--cz-white)}
.taya-constellation .cz-season{display:flex;flex-direction:column;min-width:0;padding-top:12px;border-top:2px solid var(--cz-season)}
.taya-constellation .cz-season__head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.taya-constellation .cz-season__en{display:block;font-family:var(--cz-serif-en);font-size:11px;letter-spacing:.2em;color:var(--cz-season)}
.taya-constellation .cz-season__title{margin-top:2px;font-family:var(--cz-mincho);font-size:20px;letter-spacing:.14em;line-height:1.4}
.taya-constellation .cz-season__deco{width:56px;height:auto;color:var(--cz-season)}
.taya-constellation .cz-season__deco circle{fill:currentColor}
.taya-constellation .cz-season .cz-prod__media{background:var(--cz-paper)}
.taya-constellation .cz-season__info{margin-top:12px}
.taya-constellation .cz-season__nav{margin-top:auto;padding-top:8px}
.taya-constellation .cz-season-lead{margin:clamp(-16px, -1.6vw, -8px) 0 clamp(32px, 4vw, 48px);max-width:760px;font-size:16px;line-height:2;color:var(--cz-ink)}
.taya-constellation .cz-season-lead[hidden]{display:none}

/* =========================================
   F. 天文学
   ========================================= */
.taya-constellation .cz-astro__intro{position:relative;overflow:hidden;padding:var(--cz-pt, var(--cz-section)) 0 clamp(32px, 4vw, 48px);background:var(--cz-white)}
.taya-constellation .cz-astro__intro .cz-head{position:relative;margin-bottom:0}
.taya-constellation .cz-astro__orbit{position:absolute;right:max(-120px, -8vw);top:50%;width:min(520px, 60vw);transform:translateY(-50%);color:rgba(106,120,144,.28);pointer-events:none}
.taya-constellation .cz-astro__orbit circle.dot{fill:var(--cz-gold-ink)}
.taya-constellation .cz-astro__body{padding:0 0 var(--cz-section);background:var(--cz-white)}
.taya-constellation .cz-astro__list{display:grid;gap:clamp(48px, 6vw, 72px)}
.taya-constellation .cz-astro__ghead{margin-bottom:clamp(20px, 2.4vw, 28px);padding-bottom:14px;border-bottom:1px solid var(--cz-rule)}
.taya-constellation .cz-astro__gdesc{margin-top:8px;max-width:760px;font-size:14px;line-height:1.9;color:var(--cz-ink)}
.taya-constellation .cz-astro__gdesc[hidden]{display:none}
.taya-constellation .cz-astro__item{display:flex;flex-direction:column;min-width:0}
.taya-constellation .cz-astro__info{margin-top:12px}
.taya-constellation .cz-astro__en{display:block;font-family:var(--cz-serif-en);font-size:11px;letter-spacing:.2em;color:var(--cz-gold-ink)}
.taya-constellation .cz-astro__title{margin:2px 0 4px;font-family:var(--cz-mincho);font-size:20px;letter-spacing:.12em;line-height:1.4}
.taya-constellation .cz-astro__nav{margin-top:auto;padding-top:8px}
/* 未登録時のプレビュー（見本枠。商品数には数えない） */
.taya-constellation .cz-astro__empty{display:grid;gap:16px;max-width:760px}
.taya-constellation .cz-astro__empty[hidden]{display:none}
.taya-constellation .cz-astro__sample{
  display:flex;align-items:center;justify-content:center;min-height:240px;padding:24px;
  border:1px dashed var(--cz-line-paper);color:var(--cz-sub);font-size:14px;text-align:center;
}
/* 本番設定：天文学を表示しない（章・上部の導線・紹介文をまとめて隠す） */
.taya-constellation[data-cz-astronomy="off"] .cz-astro-only{display:none !important}
.taya-constellation .cz-astro-off-only{display:none}
.taya-constellation[data-cz-astronomy="off"] .cz-astro-off-only{display:inline}

/* =========================================
   G. 関連コンテンツ（ブルーエレットと同じ作り）
   ========================================= */
.taya-constellation .cz-related{padding:var(--cz-section) 0;background:var(--cz-white);border-top:1px solid var(--cz-rule)}
.taya-constellation .cz-related__head{margin-bottom:clamp(32px, 4.4vw, 56px)}
.taya-constellation .cz-related__en{font-family:var(--cz-serif-en);font-weight:400;font-size:clamp(28px, 4.4vw, 56px);line-height:1.05;letter-spacing:.04em;color:var(--cz-ink)}
.taya-constellation .cz-related__ja{margin-top:12px;font-family:var(--cz-mincho);font-weight:500;font-size:clamp(16px, 1.5vw, 19px);line-height:1.6;letter-spacing:.12em}
.taya-constellation .cz-related__grid{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:clamp(24px, 3.4vw, 48px)}
/* 縦横比の違う画像でも、2枚の高さをそろえる */
.taya-constellation .cz-related__media{display:block;overflow:hidden;aspect-ratio:580 / 245;background:var(--cz-paper)}
.taya-constellation .cz-related__media img{display:block;width:100%;height:100%;object-fit:cover}
/* サイエンスタイの写真：ネクタイの剣先が切れないよう、写真の下寄りを表示 */
.taya-constellation .cz-related__media--science img{object-position:center 78%}
.taya-constellation .cz-related__title{margin-top:18px;font-family:var(--cz-mincho);font-size:19px;font-weight:500;letter-spacing:.08em}
.taya-constellation .cz-related__title a{display:inline-flex;align-items:center;gap:12px;min-height:44px;text-decoration:none;color:var(--cz-ink)}
.taya-constellation .cz-related__title a::after{content:"";width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.taya-constellation .cz-related__title a:hover{color:var(--cz-gold-ink)}
.taya-constellation .cz-related__text{margin-top:4px;font-size:15px;line-height:1.9;color:var(--cz-sub)}


/* =========================================
   レスポンシブ
   ========================================= */
@media (max-width:1024px){
  .taya-constellation .cz-paths{grid-template-columns:1fr}
  .taya-constellation .cz-sign__list,
  .taya-constellation .cz-season__list,
  .taya-constellation .cz-astro__row{grid-template-columns:repeat(3, minmax(0, 1fr))}
}
@media (max-width:768px){
  /* ヒーロー：縦長の写真に文字を重ねる */
  .taya-constellation .cz-hero__eyebrow{font-size:11px;letter-spacing:.18em}
  .taya-constellation .cz-hero__title{font-size:min(5vw, 26px);letter-spacing:.06em}
  .taya-constellation .cz-hero__media img{min-height:420px}
  .taya-constellation .cz-hero__media img{height:auto;aspect-ratio:1170 / 1462;max-height:86vh}
  .taya-constellation .cz-hero::after{
    background:
      linear-gradient(to top, #0C1729 0, #0C1729 3px, rgba(12,23,41,.6) 22px, rgba(12,23,41,0) 66px),
      radial-gradient(ellipse 80% 40% at 50% 50%, rgba(8,14,32,.66), rgba(8,14,32,.34) 45%, rgba(8,14,32,0) 74%);
  }
  /* 補助リンクもPCと同じく横に2つ並べる（狭い画面に合わせて文字と間隔を小さく） */
  .taya-constellation .cz-hero__sub{flex-wrap:nowrap;gap:0 clamp(14px, 5vw, 28px);margin-top:10px}
  .taya-constellation .cz-hero .cz-hero__cta,
  .taya-constellation .cz-hero__sub .cz-textlink{font-size:clamp(11px, 3.4vw, 13px);letter-spacing:.08em;gap:10px;white-space:nowrap}

  /* 星座ダイヤル：画面幅いっぱい。リングは星座名だけにして押しやすく */
  .taya-constellation .cz-map__howto{font-size:clamp(12px, 3.6vw, 15px)}
  .taya-constellation .cz-map__note{font-size:12px}
  .taya-constellation .cz-dial{width:calc(100% + 24px);margin-left:-12px;margin-right:-12px;max-width:none}
  .taya-constellation .cz-dial__glyph{font-size:clamp(14px, 4.2vw, 18px)}
  .taya-constellation .cz-dial__item .cz-map__name{font-size:clamp(9px, 2.6vw, 11px);letter-spacing:0;line-height:1.2}
  /* マークと名前をマスの真ん中に置き、間をつめて内側の円にかからないようにする */
  .taya-constellation .cz-dial__item{gap:3px}
  .taya-constellation .cz-dial__num{font-size:10px;letter-spacing:.14em}
  /* 中央の中身を、内側の円に入る枠（幅46%・高さ47%）に収める。余った高さに合わせて星座図だけが縮む */
  .taya-constellation .cz-dial__center{width:46%;height:47%;justify-content:center}
  .taya-constellation .cz-dial__fig{flex:1 1 0;min-height:0;width:100%;height:auto;margin:4px 0 2px}
  .taya-constellation .cz-dial__go{white-space:nowrap}
  .taya-constellation .cz-dial__go-name{display:none}
  .taya-constellation .cz-dial__name{font-size:clamp(13px, 3.8vw, 16px);letter-spacing:.08em}
  .taya-constellation .cz-dial__date{margin-top:0;font-size:clamp(10px, 3vw, 12px)}
  .taya-constellation .cz-dial__go{min-height:32px;margin-top:2px;font-size:clamp(10px, 3vw, 12px);letter-spacing:0}


  .taya-constellation .cz-paths__seasons{grid-template-columns:repeat(2, minmax(0, 1fr))}

  .taya-constellation .cz-hide-sp{display:none}
  .taya-constellation .cz-prod__spec span{display:block}
  .taya-constellation .cz-prod__spec span + span::before{content:none}
  /* 季節・天文学の入口も中央揃え */
  .taya-constellation .cz-paths{row-gap:64px} /* 季節と天文学の間を少し開ける */
  .taya-constellation #zodiac-collection{--cz-pt:64px} /* 天文学の入口と12星座の間 */
  .taya-constellation .cz-paths{text-align:center}
  .taya-constellation .cz-paths__title{text-align:center}
  .taya-constellation .cz-paths__season{align-items:center;text-align:center;border:1px solid var(--cz-season, var(--cz-gold-ink))}
  /* 関連コンテンツ：1列・中央揃え */
  .taya-constellation .cz-related__grid{grid-template-columns:1fr}
  .taya-constellation .cz-related__head,.taya-constellation .cz-related__ja,.taya-constellation .cz-related__item,.taya-constellation .cz-related__title{text-align:center}
  /* 商品カード：2列 */
  /* スマホは文章・見出し・商品カードをすべて中央揃え（ブルーエレットと同じ） */
  .taya-constellation .cz-head,.taya-constellation .cz-head__ja,.taya-constellation .cz-head__lead{text-align:center}
  .taya-constellation .cz-head__lead,.taya-constellation .cz-season-lead,.taya-constellation .cz-astro__gdesc{margin-left:auto;margin-right:auto}
  .taya-constellation .cz-season-lead,.taya-constellation .cz-astro__ghead,.taya-constellation .cz-astro__title{text-align:center}
  .taya-constellation .cz-prod{text-align:center}
  .taya-constellation .cz-sign__head,
  .taya-constellation .cz-sign__head > div{display:flex;flex-direction:column;align-items:center}
  .taya-constellation .cz-sign__head{gap:4px}
  .taya-constellation .cz-sign__icon{order:-1}
  .taya-constellation .cz-sign__title,.taya-constellation .cz-season__title{text-align:center}
  .taya-constellation .cz-season__head{justify-content:center}
  .taya-constellation .cz-season__head > div{text-align:center}
  .taya-constellation .cz-prod__desc{font-size:13px;line-height:1.8}
  /* 改行は文節単位（対応ブラウザー）。商品データの説明文は JavaScript で文節に区切る */
  .taya-constellation p{word-break:auto-phrase}
  /* 「商品を見る」：ブルーエレットのスマホと同じ大きさ（カード幅いっぱい・高さ36px・11px） */
  .taya-constellation .cz-prod__cta{width:100%;max-width:none;height:36px;margin:12px 0 0;padding:0 12px;font-size:11px}
  /* スマホ：画像の切り替えアイコンと「商品を見る」は中央に */
  .taya-constellation .cz-prod__views{justify-content:center}
  .taya-constellation .cz-prod__cta{margin-left:auto;margin-right:auto}
  /* 見出しの高さをどのカードもそろえる（日付はいつも星座名の下、欧文は1行） */
  .taya-constellation .cz-sign__titlerow{display:block}
  .taya-constellation .cz-sign__date{display:block;margin-top:2px}
  .taya-constellation .cz-sign__num,.taya-constellation .cz-season__en,.taya-constellation .cz-astro__en{font-size:10px;letter-spacing:.08em;white-space:nowrap;overflow:hidden;text-overflow:clip}
  .taya-constellation .cz-sign__list,
  .taya-constellation .cz-season__list,
  .taya-constellation .cz-astro__row{grid-template-columns:repeat(2, minmax(0, 1fr));gap:40px 14px}
  .taya-constellation .cz-sign__title,.taya-constellation .cz-season__title,.taya-constellation .cz-astro__title{font-size:17px}
  .taya-constellation .cz-sign__icon{width:48px}
  .taya-constellation .cz-season__deco{width:40px}
  .taya-constellation .cz-prod__price{font-size:14px}
  .taya-constellation .cz-prod__name{font-size:15px;letter-spacing:.02em}
  .taya-constellation .cz-prod__color{margin-left:8px}
  /* 天文学：色名は商品名の下の行に、中央揃えで */
  .taya-constellation .cz-astro__item .cz-prod__color{display:block;margin:2px 0 0;text-align:center}
  .taya-constellation .cz-prod{--cz-sel-pad:6px}
  .taya-constellation .cz-astro__orbit{opacity:.6}

  /* スマホは画面下の共通メニュー（固定）の上に出す */
}
@media (max-width:360px){
  .taya-constellation .cz-dial__glyph{font-size:12px;line-height:1}
  .taya-constellation .cz-dial__item .cz-map__name{line-height:1.1}
  .taya-constellation .cz-dial__go{min-height:26px;font-size:10px}
  .taya-constellation .cz-sign__head > div{min-width:0}
  .taya-constellation .cz-sign__title,.taya-constellation .cz-season__title,.taya-constellation .cz-astro__title{font-size:15px;letter-spacing:.04em}
  /* とても狭い画面：長い星座名でも折り返さない */
  .taya-constellation .cz-sign__title{white-space:nowrap}
  .taya-constellation .cz-paths__seasons{grid-template-columns:1fr 1fr}
}

/* 動きを減らす設定：スムーズスクロール・到着演出・切り替えのフェードを止める */
@media (prefers-reduced-motion: reduce){
  .taya-constellation *,.taya-constellation *::before,.taya-constellation *::after{animation:none !important;transition:none !important}
}