@charset "utf-8";
/* CSS Document */

/* ==========================================================================
   Mother.N 九星気学ページ（C案）
   TOPページ（心の天気予報）と同じトーンに合わせています。
   背景・ヘッダー・フッターはサイト共通（/common/common.css）。
   画像はサイト直下の /images/ を相対パス（../../images/）で参照します。
   ========================================================================== */

/* ベース */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body.ky{margin:0;font-size:1rem;font-family:"Kosugi Maru","モトヤ丸アポロ",sans-serif;color:#4b3a2f;line-height:1.6;}
:where(.ky) ul{margin:0;padding:0;list-style:none;}
:where(.ky) p{margin:0;}
:where(.ky) img{max-width:100%;height:auto;vertical-align:middle;}
:where(.ky) a{color:inherit;text-decoration:none;}
.ky a:focus-visible,.ky button:focus-visible,.ky input:focus-visible,.ky select:focus-visible{outline:2px solid #e3a45c;outline-offset:3px;}
.sec-title,.ky-page-title,.ky-box-title,.ky-scene-title,.ky-card h2,.ky-card h3{font-family:"Zen Antique Soft","Kosugi Maru",serif;font-weight:normal;}
.ky-main{max-width:880px;margin:0 auto;padding:0 20px 24px;}


/* パンくず */
.ky-crumbs ol{display:flex;flex-wrap:wrap;gap:2px 8px;max-width:880px;margin:0 auto;padding:0 20px 8px;list-style:none;font-size:.8125rem;color:#6a5a4d;}
.ky-crumbs li+li::before{content:'›';margin-right:8px;color:#c9b8a4;}
.ky-crumbs a:hover{text-decoration:underline;}

/* セクション見出し（TOPと同じ） */
.sec{padding:40px 0 16px;}
.sec-head{margin-bottom:24px;text-align:center;}
.sec-title{display:flex;align-items:center;gap:20px;margin:0;font-size:2.25rem;line-height:1.3;letter-spacing:.06em;}
.sec-title::before,.sec-title::after{content:'';flex:1;min-width:30px;height:22px;}
.sec-title::before{background:url(../../images/motherN04-06.png) left center/22px auto no-repeat,repeating-linear-gradient(90deg,#f0c794 0 6px,transparent 6px 10px) right center/calc(100% - 34px) 2px no-repeat;}
.sec-title::after{background:url(../../images/motherN04-06.png) right center/22px auto no-repeat,repeating-linear-gradient(90deg,#f0c794 0 6px,transparent 6px 10px) left center/calc(100% - 34px) 2px no-repeat;}
.sec-title span{display:flex;align-items:center;gap:14px;}
.sec-title span::before,.sec-title span::after{content:'';flex-shrink:0;width:36px;height:42px;background:url(../../images/motherN04-02.png) center/contain no-repeat;}
.sec-title span::after{background-image:url(../../images/motherN04-03.png);}
.sec-lead{margin-top:6px;font-size:1rem;letter-spacing:.08em;}

/* ページ見出し（ランキング見出しと同じ構成） */
.ky-hero{padding:12px 0 0;}
.ky-hero-head{position:relative;min-height:120px;padding-top:12px;text-align:center;}
.ky-hero-txt{position:relative;z-index:1;}
.ky-page-title{display:inline-block;position:relative;margin:0;padding:0 62px;font-size:2.625rem;letter-spacing:.06em;line-height:1.3;}
.ky-page-title::before,.ky-page-title::after{content:'';position:absolute;top:50%;transform:translateY(-50%);background:center/contain no-repeat;}
.ky-page-title::before{left:0;width:48px;height:62px;background-image:url(../../images/motherN01-star-left.png);}
.ky-page-title::after{right:0;width:52px;height:80px;background-image:url(../../images/motherN01-star-right.png);}
.ky-page-lead{position:relative;margin-top:14px;text-align:center;word-break:auto-phrase;font-size:1.0625rem;letter-spacing:.1em;}
.ky-hero-cat,.ky-hero-birds{position:absolute;bottom:-4px;height:auto;}
.ky-hero-cat{left:0;width:220px;}
.ky-hero-birds{right:0;width:246px;}
.ky-today{margin-top:14px;text-align:center;font-size:.9375rem;letter-spacing:.06em;}
.ky-today strong{font-family:"Zen Maru Gothic","Kosugi Maru",sans-serif;font-weight:700;color:#4f7eae;}

/* 色ごとの面・枠・矢印（TOPのパステル） */
.ky-box,.ky-scene--blue{--c-bg:#e6eef8;--c-line:#c8daee;--c-btn:#4f7eae;}
.ky-box--pink,.ky-scene--pink{--c-bg:#fce7e4;--c-line:#f3cdc8;--c-btn:#c9665d;}
.ky-box--purple,.ky-scene--purple{--c-bg:#efe8f5;--c-line:#dccfea;--c-btn:#8468ad;}
.ky-box--green,.ky-scene--green{--c-bg:#ebf1df;--c-line:#d4e1c2;--c-btn:#627f47;}
.ky-box--yellow,.ky-scene--yellow{--c-bg:#fdf1d5;--c-line:#f3ddab;--c-btn:#a8741f;}
.ky-box--salmon,.ky-scene--salmon{--c-bg:#fde6e0;--c-line:#f4ccc2;--c-btn:#bf6650;}
.ky-box--blue{--c-bg:#e6eef8;--c-line:#c8daee;--c-btn:#4f7eae;}

/* 自分の占い・入力ボックス */
.ky-box{margin:28px auto 0;max-width:600px;padding:6px 12px 16px;background:var(--c-bg);border:1px solid var(--c-line);border-radius:20px;}
.ky-box-title{display:flex;align-items:center;gap:12px;margin:0;padding:10px 12px 4px;font-size:1.75rem;letter-spacing:.06em;line-height:1.3;}
.ky-box-icon{flex-shrink:0;width:auto;height:42px;}
.ky-box-lead{padding:0 12px 10px;font-size:.9375rem;color:#6a5a4d;}
.ky-panel{padding:16px;background:rgba(255,255,255,.55);border-radius:14px;}

/* フォーム */
.ky-form{display:grid;gap:16px;}
.ky-field{margin:0;padding:0;border:0;display:grid;gap:6px;min-width:0;}
.ky-field legend,.ky-field>label{padding:0;font-size:.9375rem;}
.ky-form input[type=date],.ky-form select{width:100%;max-width:280px;height:48px;padding:0 14px;font-size:16px;font-family:inherit;color:#4b3a2f;background:#fff;border:1px solid var(--c-line,#c8daee);border-radius:10px;}
.ky-switch,.ky-gender{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:.9375rem;}
.ky-switch label,.ky-gender label{display:inline-flex;align-items:center;gap:6px;min-height:36px;}
.ky-note{font-size:.8125rem;line-height:1.6;color:#6a5a4d;}
.ky-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.ky-error{margin-top:10px;color:#b3261e;font-size:.9375rem;}
.ky-button{position:relative;display:block;width:min(100%,340px);margin:4px auto 0;padding:12px 40px;border:0;border-radius:999px;background:var(--c-btn,#4f7eae);color:#fff;font-family:inherit;font-size:1.125rem;letter-spacing:.14em;cursor:pointer;transition:opacity .2s;}
.ky-button::after{content:'';position:absolute;top:50%;right:28px;width:8px;height:8px;border-top:2px solid #fff;border-right:2px solid #fff;transform:translateY(-50%) rotate(45deg);}
.ky-button:hover{opacity:.85;}

/* 結果 */
.ky-result{margin:20px auto 0;max-width:600px;padding:20px;background:#fff;border:1px solid #f1e3cc;border-radius:16px;display:grid;gap:14px;}
.ky-result-label{font-size:.8125rem;letter-spacing:.1em;color:#6a5a4d;}
.ky-result>p,.ky-card p{line-height:1.9;}
.ky-card--main{display:flex;align-items:center;gap:12px;}
.ky-card-img{flex-shrink:0;width:96px;margin:-8px 0;}
.ky-card-sub{font-size:.8125rem;color:#6a5a4d;}
.ky-card-name{margin:0;font-family:"Zen Maru Gothic","Kosugi Maru",sans-serif;font-weight:700;font-size:1.625rem;letter-spacing:.06em;}
.ky-catch{font-family:"Zen Maru Gothic","Kosugi Maru",sans-serif;font-weight:700;}
.ky-chips{display:flex;flex-wrap:wrap;gap:8px;}
.ky-chips span{padding:6px 14px;background:#e6eef8;border-radius:999px;font-size:.875rem;}
.ky-card{padding:16px;background:#fff;border:1px solid #f1e3cc;border-radius:16px;display:grid;gap:8px;}
.ky-result .ky-card{padding:14px 0 0;border:0;border-top:1px dashed #ead9bf;border-radius:0;}
.ky-result .ky-card--main{display:flex;padding:0;border-top:0;}
.ky-card h2,.ky-card h3{margin:0;font-size:1.25rem;letter-spacing:.04em;line-height:1.4;}
.ky-card h3 small{display:block;font-family:"Kosugi Maru",sans-serif;font-size:.8125rem;color:#6a5a4d;}
.ky-strong{font-family:"Zen Maru Gothic","Kosugi Maru",sans-serif;font-weight:700;font-size:1.25rem;color:#4f7eae;}
.ky-more-link a{font-size:.9375rem;color:#4f7eae;text-decoration:underline;text-underline-offset:3px;}

/* 九星の一覧 */
.ky-stars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.ky-stars a{display:flex;flex-direction:column;align-items:center;gap:4px;height:100%;padding:10px 6px 12px;background:#e6eef8;border:1px solid #c8daee;border-radius:16px;transition:background .2s;}
.ky-stars a:hover{background:#f0f5fb;}
.ky-stars img{display:block;width:auto;height:110px;}
.ky-stars-name{font-family:"Zen Maru Gothic","Kosugi Maru",sans-serif;font-weight:700;font-size:1.125rem;letter-spacing:.04em;}

/* テーマ別（TOPのシチュエーション別占いと同じ形） */
.ky-scenes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.ky-scene{padding:14px 14px 16px;background:var(--c-bg);border:1px solid var(--c-line);border-radius:16px;}
.ky-scene-head{display:flex;align-items:flex-end;gap:10px;margin-bottom:10px;}
.ky-scene-img{flex-shrink:0;width:auto;height:70px;}
.ky-scene-title{flex:1;min-width:0;margin:0 0 6px;font-size:1.375rem;letter-spacing:.04em;line-height:1.4;}
.ky-links li+li{margin-top:8px;}
.ky-links a,.ky-links p{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 8px 8px 12px;background:rgba(255,255,255,.75);border-radius:10px;font-size:1rem;line-height:1.4;letter-spacing:.02em;transition:background .2s;}
.ky-links a:hover{background:#fff;}
.ky-links span{flex:1;min-width:0;word-break:auto-phrase;}
.ky-links .is-soon p{color:#7d6d60;background:rgba(255,255,255,.45);}
.ky-links small{flex-shrink:0;padding:2px 8px;border-radius:999px;background:#fff;font-size:.75rem;}
.ky-arrow{position:relative;flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--c-btn,#4f7eae);transition:transform .2s;}
.ky-arrow::before{content:'';position:absolute;top:50%;left:50%;width:7px;height:7px;border-top:2px solid #fff;border-right:2px solid #fff;transform:translate(-70%,-50%) rotate(45deg);}
.ky-links a:hover .ky-arrow{transform:translateX(3px);}

/* 続きを見る型のボタン（TOPの rank-more と同じ） */
.ky-more{display:flex;align-items:center;justify-content:center;gap:14px;margin:32px 0 8px;}
.ky-more::before,.ky-more::after{content:'';flex-shrink:0;width:52px;height:36px;background:url(../../images/motherN04-02.png) center/contain no-repeat;}
.ky-more::after{background-image:url(../../images/motherN04-03.png);}
.ky-more a{position:relative;display:block;width:min(100%,340px);padding:10px 40px;border-radius:999px;background:#4f7eae;color:#fff;font-size:1.125rem;letter-spacing:.1em;text-align:center;transition:opacity .2s;}
.ky-more a::after{content:'';position:absolute;top:50%;right:24px;width:8px;height:8px;border-top:2px solid #fff;border-right:2px solid #fff;transform:translateY(-50%) rotate(45deg);}
.ky-more a:hover{opacity:.85;}

/* 各占いページの結果まわり */
.ky-item .ky-result{margin-top:20px;}
.ky-score{font-size:1.25rem;text-align:center;}
.ky-score span{font-family:"Libre Baskerville",serif;font-style:italic;font-weight:bold;font-size:3.5rem;line-height:1.1;color:#5a3a26;}
.ky-pair{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 16px;font-size:.9375rem;}
.ky-result h2{margin:0;font-family:"Zen Antique Soft","Kosugi Maru",serif;font-weight:normal;font-size:1.375rem;line-height:1.4;}
.ky-result h3{margin:8px 0 0;font-family:"Zen Antique Soft","Kosugi Maru",serif;font-weight:normal;font-size:1.125rem;}
.ky-days,.ky-dirs{display:grid;gap:8px;}
.ky-days li,.ky-dirs li{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:10px 14px;background:#fdf8e9;border-radius:10px;}
.ky-dirs.is-bad li{background:#fce7e4;}
.ky-days-date,.ky-dirs strong{min-width:7.5em;font-family:"Zen Maru Gothic","Kosugi Maru",sans-serif;font-weight:700;}
.ky-board{display:grid;gap:4px;max-width:360px;margin:6px auto 0;}
.ky-board-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;}
.ky-board-cell{padding:8px 4px;text-align:center;font-size:.75rem;background:#fdf8e9;border-radius:8px;}
.ky-board-cell.is-good{background:#ebf1df;}
.ky-board-cell.is-bad{background:#fce7e4;}
.ky-board-dir{display:block;color:#6a5a4d;}
.ky-board-star{display:block;font-family:"Zen Maru Gothic","Kosugi Maru",sans-serif;font-weight:700;font-size:.875rem;}
.ky-board-tag{display:block;font-size:.6875rem;}
.ky-all{margin-top:24px;}
.ky-acc{border-top:1px dashed #ead9bf;padding:10px 0;}
.ky-acc summary{cursor:pointer;font-family:"Zen Maru Gothic","Kosugi Maru",sans-serif;font-weight:700;}
.ky-acc p{margin-top:8px;line-height:1.9;}

/* 九星の解説ページ */
.ky-star .ky-card{margin-top:14px;}
.ky-star-hero{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:8px;}
.ky-star-hero img{width:auto;height:180px;}
.ky-tags{display:flex;flex-wrap:wrap;gap:8px;}
.ky-tags a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;background:#e6eef8;border-radius:999px;}
.ky-dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 16px;}
.ky-dl dt{color:#6a5a4d;}
.ky-dl dd{margin:0;}
.ky-star-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:24px;font-size:.9375rem;}
.ky-star-nav a{text-decoration:underline;text-underline-offset:3px;}


/* タブレット */
@media (max-width:999px){
.ky-hero-head{min-height:150px;max-width:600px;margin:0 auto;}
.ky-page-title{font-size:2.25rem;padding:0 56px;}
.ky-hero-cat{width:190px;}
.ky-hero-birds{width:210px;}
.ky-scenes{grid-template-columns:1fr;max-width:600px;margin:0 auto;}
}

/* スマホ */
@media (max-width:599px){
.ky-main{padding:0 16px 16px;}
.ky-crumbs ol{padding:0 16px 6px;font-size:.75rem;}

.sec{padding:28px 0 8px;}
.sec-head{margin-bottom:16px;}
.sec-title{gap:6px;font-size:1.25rem;letter-spacing:.02em;}
.sec-title::before,.sec-title::after{min-width:12px;height:2px;background:repeating-linear-gradient(90deg,#f0c794 0 5px,transparent 5px 9px);}
.sec-title span{gap:6px;}
.sec-title span::before,.sec-title span::after{width:28px;height:28px;}
.sec-lead{font-size:.875rem;}

.ky-hero-head{min-height:0;padding:10px 0 70px;}
.ky-page-title{padding:0 26px;font-size:1.5rem;letter-spacing:.04em;}
.ky-page-title::before{width:22px;height:30px;}
.ky-page-title::after{width:24px;height:36px;}
.ky-page-lead{margin-top:8px;font-size:.8125rem;letter-spacing:.04em;}
.ky-hero-cat{width:150px;}
.ky-hero-birds{width:168px;}
.ky-today{margin-top:10px;font-size:.8125rem;}

.ky-box{margin-top:16px;padding:4px 8px 12px;border-radius:16px;}
.ky-box-title{gap:8px;padding:8px 8px 2px;font-size:1.3125rem;}
.ky-box-icon{height:32px;}
.ky-box-lead{padding:0 8px 8px;font-size:.8125rem;}
.ky-panel{padding:14px;}
.ky-button{font-size:1rem;padding:10px 32px;}
.ky-button::after{right:20px;}

.ky-result{padding:16px;}
.ky-card-img{width:76px;}
.ky-card-name{font-size:1.375rem;}

.ky-stars{gap:8px;}
.ky-stars img{height:76px;}
.ky-stars-name{font-size:.9375rem;}

.ky-scenes{gap:12px;}
.ky-scene{padding:8px 10px 10px;}
.ky-scene-img{height:46px;}
.ky-scene-title{font-size:1.125rem;}
.ky-links li+li{margin-top:4px;}
.ky-links a,.ky-links p{padding:6px 8px 6px 10px;font-size:.9375rem;}
.ky-arrow{width:22px;height:22px;}

.ky-more{gap:8px;margin-top:24px;}
.ky-more::before,.ky-more::after{width:40px;height:28px;}
.ky-more a{padding:8px 30px 8px 22px;font-size:.9375rem;letter-spacing:.04em;}
.ky-more a::after{right:20px;}

.ky-star-hero img{height:140px;}
}

@media (prefers-reduced-motion:reduce){
.ky *{transition:none !important;}
}
/* 生年月日：年・月・日の選択欄（四柱推命と同じ形） */
.ky-date{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:10px;max-width:420px;}
.ky-date label{display:grid;gap:4px;font-size:.875rem;min-width:0;}
.ky-form .ky-date select{max-width:none;padding:0 10px;}
.ky-partner .ky-date{margin-top:4px;}
@media (max-width:599px){.ky-date{gap:6px;}.ky-form .ky-date select{padding:0 6px;}}
