/* ==========================================================================
   12星座ランキング：背景とヘッダーを九星気学ランキング（TOPページ）に合わせる
   ranking.css の後に読み込み、背景・ヘッダー・おまじない欄だけを上書きします。
   カードはピンク系のまま（九星気学＝青、12星座＝ピンクで色分け）。
   ========================================================================== */

/* 背景（TOPと同じ） */
body.zodiac-ranking-page{margin:0;color:#4b3a2f;background:#fdf8e9 url(/images/motherN_bg.png) repeat top left/600px auto;}

/* 戻るリンク */
.zodiac-ranking-page .zodiac-back{display:inline-block;margin-bottom:8px;font-family:"Kosugi Maru","モトヤ丸アポロ",sans-serif;font-size:.9375rem;letter-spacing:.06em;color:#4b3a2f;text-decoration:none;}
.zodiac-ranking-page .zodiac-back:hover{text-decoration:underline;}

/* タイトル（九星気学ランキングと同じ見た目） */
.zodiac-ranking-page .zodiac-page-title{margin:0 0 28px;padding:0;background:none;border:0;text-align:center;font-family:"Kosugi Maru","モトヤ丸アポロ",sans-serif;color:#4b3a2f;}
.zodiac-ranking-page .zodiac-title-brand{display:flex;flex-direction:column;align-items:center;margin:0 0 10px;font-size:.8125rem;letter-spacing:.4em;}
.zodiac-ranking-page .zodiac-title-brand span{font-family:"Libre Baskerville",serif;font-style:italic;font-weight:bold;font-size:1.75rem;line-height:1.1;letter-spacing:0;color:#5a3a26;}
.zodiac-ranking-page .zodiac-page-title h1{display:inline-block;position:relative;margin:0;padding:0 62px;font-family:"Zen Antique Soft","Kosugi Maru",serif;font-size:2.625rem;font-weight:normal;letter-spacing:.06em;line-height:1.3;color:#4b3a2f;}
.zodiac-ranking-page .zodiac-page-title h1::before,.zodiac-ranking-page .zodiac-page-title h1::after{content:'';position:absolute;top:50%;transform:translateY(-50%);background:center/contain no-repeat;}
.zodiac-ranking-page .zodiac-page-title h1::before{left:0;width:48px;height:62px;background-image:url(/images/motherN01-star-left.png);}
.zodiac-ranking-page .zodiac-page-title h1::after{right:0;width:52px;height:80px;background-image:url(/images/motherN01-star-right.png);}

/* 動物イラストと日付 */
.zodiac-ranking-page .zodiac-title-illust{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:8px;}
.zodiac-ranking-page .zodiac-title-illust img{display:block;flex-shrink:1;min-width:0;height:auto;}
.zodiac-ranking-page .zodiac-title-cat{width:220px;}
.zodiac-ranking-page .zodiac-title-birds{width:246px;}
.zodiac-ranking-page .zodiac-title-illust time,.zodiac-ranking-page .zodiac-title-illust span{flex:1;align-self:center;display:block;font-size:1.0625rem;letter-spacing:.1em;white-space:nowrap;}

/* 注意書きの文字色 */
.zodiac-ranking-page .zodiac-note{color:#4b3a2f;}

/* 項目名の列を一番長い見出しに合わせ、「おまじない」が途中で改行されないようにする */
.zodiac-ranking-page .zodiac-details{grid-template-columns:auto 1fr;column-gap:16px;row-gap:8px;}
.zodiac-ranking-page .zodiac-details div{display:contents;}
.zodiac-ranking-page .zodiac-details dt{white-space:nowrap;}

/* 12位だけに出る「気分転換のおまじない」を、お守りのような枠で特別に見せる */
.zodiac-ranking-page .zodiac-details div:nth-child(6){display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px;grid-column:1/-1;margin-top:6px;padding:12px 16px;border:1px dashed #e9c46a;border-radius:14px;background:#fff8e1;}
.zodiac-ranking-page .zodiac-details div:nth-child(6) dt{color:#b07d1a;white-space:nowrap;}
.zodiac-ranking-page .zodiac-details div:nth-child(6) dt::before{content:'✦';margin-right:6px;color:#e9b949;}
.zodiac-ranking-page .zodiac-details div:nth-child(6) dd{font-weight:bold;color:#5a3a26;}

/* スマホ */
@media (max-width:599px){
.zodiac-ranking-page .zodiac-page-title{margin-bottom:20px;}
.zodiac-ranking-page .zodiac-title-brand{margin-bottom:6px;font-size:.6875rem;}
.zodiac-ranking-page .zodiac-title-brand span{font-size:1.375rem;}
.zodiac-ranking-page .zodiac-page-title h1{padding:0 26px;font-size:1.375rem;letter-spacing:.04em;}
.zodiac-ranking-page .zodiac-page-title h1::before{width:22px;height:30px;}
.zodiac-ranking-page .zodiac-page-title h1::after{width:24px;height:36px;}
.zodiac-ranking-page .zodiac-title-illust{gap:6px;}
.zodiac-ranking-page .zodiac-title-cat{width:120px;}
.zodiac-ranking-page .zodiac-title-birds{width:132px;}
.zodiac-ranking-page .zodiac-title-illust time{font-size:.8125rem;letter-spacing:.04em;}
}