/* skin-uchiikura — うちいくら（uchiikura.jp）の記事側 /guide/
   2026-10-21 Luxeta と同じ方針で、トップ(静的・media-platform/genres/estate の estate.css)と世界観をそろえる。
   深い緑 #1F6F5C＋白、数字と押す所は黄土 #C8A24A、見出しは Zen Maru Gothic、本文 Noto Sans JP、
   白いカード＋細い線＋角14px、ボタンは丸くて下に3pxの影。値はすべて estate.css の写し。 */
.skin-uchiikura{
  --radius:14px;
  --bg:#FBFAF7; --panel:#ffffff; --bg2:#FBFAF7;
  --accent:#1F6F5C; --accent-deep:#154D40; --accent-soft:#E8F2EE;
  --accent2:#2E8B74; --accent3:#C8A24A; --gold:#C8A24A; --gold-deep:#8A6720;
  --ink:#22303A; --sub:#626B73; --line:#E3E6E8;
  --font-body:"Noto Sans JP","Hiragino Kaku Gothic ProN",system-ui,sans-serif;
  --font-head:"Zen Maru Gothic","Noto Sans JP",sans-serif;
  --font-serif:var(--font-body);
  background:var(--bg);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.8;
}
.skin-uchiikura a{color:var(--accent)}
.skin-uchiikura h1,.skin-uchiikura h2,.skin-uchiikura h3,.skin-uchiikura .card h3,.skin-uchiikura .section-h h2,.skin-uchiikura .post-head h1{font-family:var(--font-head);font-weight:900;letter-spacing:0}
.skin-uchiikura :focus-visible{outline-color:var(--accent)}

/* ---- ヘッダー（header.site と同じ：白・細い線・ロゴ44px・文字だけのナビ＋黄土の診断ボタン） ---- */
.skin-uchiikura .site-head{background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.skin-uchiikura .site-head .wrap{min-height:60px;gap:16px}
.skin-uchiikura .brand .logo.logo-full{height:44px;max-width:min(58vw,260px)}
.skin-uchiikura .nav{gap:4px 14px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;align-items:center}
.skin-uchiikura .nav::-webkit-scrollbar{display:none}
.skin-uchiikura .nav a{white-space:nowrap;color:var(--ink);font-size:14px;font-weight:700;padding:6px 4px;border-radius:0;background:none}
.skin-uchiikura .nav a:hover,.skin-uchiikura .nav a[aria-current]{background:none;color:var(--accent);text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:2px}
.skin-uchiikura .nav a.cta{background:var(--gold);color:#fff;border-radius:999px;padding:8px 18px;box-shadow:0 3px 0 var(--gold-deep);font-weight:900;text-decoration:none}
.skin-uchiikura .nav a.cta:hover{background:var(--gold-deep);box-shadow:0 3px 0 #5e4512}
.skin-uchiikura form.search input{background:#fff;border:2px solid var(--line);border-radius:12px;font-size:14px;padding:7px 12px;width:150px}
.skin-uchiikura form.search input:focus{border-color:var(--accent)}
.skin-uchiikura form.search button{background:var(--accent);border-radius:999px;box-shadow:0 3px 0 var(--accent-deep);font-weight:900}
@media (max-width:1100px){.skin-uchiikura form.search{display:none}}

/* ---- トップのヒーロー（.hero と同じ：白い箱・細い線・黄土の英字小見出し・丸ゴ見出し） ---- */
.skin-uchiikura .hero{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 20px;margin:20px auto 0;max-width:var(--wide);width:calc(100% - 40px)}
.skin-uchiikura .hero-grid{grid-template-columns:1fr;padding:0}
.skin-uchiikura .hero-art{display:none}
.skin-uchiikura .hero .kicker{font-family:var(--font-body);font-size:11px;letter-spacing:.2em;color:var(--gold);font-weight:900;margin:0}
.skin-uchiikura .hero h1{font-size:clamp(25px,4.2vw,30px);line-height:1.4;margin:5px 0 8px;max-width:none;color:var(--ink)}
.skin-uchiikura .hero p{color:var(--ink);font-size:16px;max-width:44em}
.skin-uchiikura .hero-search{margin:16px 0 6px;max-width:560px}
.skin-uchiikura .hero-search input{border:2px solid var(--accent);border-radius:12px;background:#fff;padding:11px 14px;font-size:16px}
.skin-uchiikura .hero-search input:focus{outline:3px solid var(--accent-soft);border-color:var(--accent)}
.skin-uchiikura .hero-search button{background:var(--accent);border-radius:999px;font-weight:900;font-size:14.5px;padding:0 20px;box-shadow:0 3px 0 var(--accent-deep)}
.skin-uchiikura .hero-search button:hover{background:var(--accent-deep)}
.skin-uchiikura .quick a{background:#fff;border-color:var(--line);color:var(--ink)}
.skin-uchiikura .quick a:hover{border-color:var(--accent);color:var(--accent)}

/* ---- 見出し（トップの h2 と同じ：左に緑の太い線） ---- */
.skin-uchiikura .section{padding:28px 0}
.skin-uchiikura .section-h{margin:0 0 14px}
.skin-uchiikura .section-h h2{font-size:19px;padding-left:11px;border-left:5px solid var(--accent);line-height:1.4}
.skin-uchiikura .section-sub{font-size:12px;color:var(--sub)}

/* ---- 「いま、どこで迷っていますか？」の札：絵つきのまま、トップの .card と同じ白い箱に ---- */
.skin-uchiikura .problems{padding:18px 0 0}
.skin-uchiikura .pcards{gap:13px}
.skin-uchiikura .pcards li{--pc:var(--accent)}
.skin-uchiikura .pcards li.pc-1{--pc:var(--gold)}
.skin-uchiikura .pcards li.pc-2{--pc:var(--accent2)}
.skin-uchiikura .pgrid.pcards a{border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:16px 40px 16px 16px;box-shadow:none}
.skin-uchiikura .pgrid.pcards a::before{display:none}
.skin-uchiikura .pgrid.pcards a:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:none}
.skin-uchiikura .pcards .pc-art{background:var(--accent-soft);border-radius:14px}
.skin-uchiikura .pcards .pc-no{color:var(--accent);font-family:var(--font-body)}
.skin-uchiikura .pgrid.pcards b{font-size:17px}
.skin-uchiikura .pcards .pc-go{background:var(--accent-soft)}
.skin-uchiikura .pgrid.pcards a:hover .pc-go{background:var(--accent)}
.skin-uchiikura .pgrid.pcards a:hover .pc-go::after{border-color:#fff}

/* ---- 記事カード（トップの .card と同じ：白・細い線・角14px・浮かない） ---- */
.skin-uchiikura .card{background:#fff;border:1px solid var(--line);border-left-width:1px;border-radius:var(--radius);box-shadow:none}
.skin-uchiikura .card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:none}
.skin-uchiikura .card h3{font-size:15.5px;line-height:1.5}
.skin-uchiikura .thumb{background:var(--accent-soft)}
.skin-uchiikura .thumb .title-card,.skin-uchiikura .hero-card .title-card{background:linear-gradient(135deg,var(--accent),var(--accent-deep))}
.skin-uchiikura .chip{color:var(--accent);background:var(--accent-soft);border-radius:999px}
.skin-uchiikura .chips a{background:#fff;border-color:var(--line);color:var(--ink);border-radius:999px}
.skin-uchiikura .chips a:hover{border-color:var(--accent);color:var(--accent)}
.skin-uchiikura .pager a,.skin-uchiikura .pager span{border-radius:999px;background:#fff}
.skin-uchiikura .pager .current{background:var(--accent);border-color:var(--accent)}
.skin-uchiikura .sgrid li{background:#fff;border:1px solid var(--line);box-shadow:none}

/* ---- 記事ページ ---- */
.skin-uchiikura .post-head h1{font-size:clamp(24px,3.6vw,32px);line-height:1.4}
.skin-uchiikura .crumb a,.skin-uchiikura .crumb{color:var(--sub);font-size:12.5px}
.skin-uchiikura .byline .who i{background:var(--accent)}
.skin-uchiikura .pr{background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 11px;font-size:12px;color:var(--sub)}
.skin-uchiikura .pr::before{display:none}
.skin-uchiikura .hero-card{border-radius:var(--radius);border:1px solid var(--line)}
.skin-uchiikura .content h2{font-size:clamp(19px,3.4vw,22px);border-bottom:0;border-left:5px solid var(--accent);padding:0 0 0 11px;line-height:1.4}
.skin-uchiikura .content h2::after{display:none}
.skin-uchiikura .content h3{border-left:0;padding-left:0;font-size:17px}
.skin-uchiikura .content strong{background:linear-gradient(transparent 62%,color-mix(in srgb,var(--gold) 28%,#fff) 62%)}
.skin-uchiikura .verdict{background:#fff;border:1px solid var(--line);border-top:4px solid var(--accent);border-radius:var(--radius);box-shadow:none}
.skin-uchiikura .verdict .lbl{color:var(--accent)}
.skin-uchiikura .verdict .lbl::before{background:var(--gold);border-radius:50%;transform:none}
.skin-uchiikura .tbl{border-radius:12px;background:#fff}
.skin-uchiikura .tbl thead th,.skin-uchiikura .tbl thead th:first-child,.skin-uchiikura .tbl-float th{background:var(--accent-soft);color:var(--ink);font-size:12.5px}
.skin-uchiikura .cta{background:#fff;border:1px solid var(--line);border-top:4px solid var(--gold);border-radius:var(--radius)}
.skin-uchiikura .related a{background:#fff}
.skin-uchiikura .related a:hover{border-color:var(--accent)}
.skin-uchiikura .nl-box{background:#fff;border:1px solid var(--line)}

/* ---- ボタン（トップの .btn と同じ：丸い・緑・下に3pxの影。黄土は押してほしい所） ---- */
.skin-uchiikura .btn{background:var(--accent);border-radius:999px;box-shadow:0 3px 0 var(--accent-deep);font-weight:900;font-size:14.5px;padding:10px 20px}
.skin-uchiikura .btn:hover{background:var(--accent-deep);text-decoration:none}
.skin-uchiikura .content .alg-btn,.skin-uchiikura .alg-sticky .alg-btn{background:linear-gradient(180deg,#d4b05a 0%,var(--gold) 100%)!important;box-shadow:0 4px 0 var(--gold-deep),0 14px 24px -14px rgba(138,103,32,.6)!important}
.skin-uchiikura .content .alg-btn:hover{box-shadow:0 5px 0 var(--gold-deep),0 18px 28px -14px rgba(138,103,32,.7)!important}
.skin-uchiikura .content .alg-btn:active{box-shadow:0 1px 0 var(--gold-deep)!important}
.skin-uchiikura .content .alg-btn-arr::after,.skin-uchiikura .alg-sticky .alg-btn-arr::after{border-color:var(--gold-deep)!important}
.skin-uchiikura .content .alg-mid,.skin-uchiikura .content .alg-cta li.is-top,.skin-uchiikura .g-offer{border-color:var(--accent)!important;background:linear-gradient(180deg,var(--accent-soft),#fff)!important}
.skin-uchiikura .content .alg-mid-h,.skin-uchiikura .content .alg-ribbon,.skin-uchiikura .g-offer .go-h{background:var(--accent)!important}
.skin-uchiikura .content .alg-cta{border-color:var(--line)!important;background:#fff!important}
.skin-uchiikura .rk-btn,.skin-uchiikura .rk-search-btn{background:var(--accent)}
.skin-uchiikura .rk-price{color:var(--accent-deep)}

/* ---- フッター（トップの footer.site と同じ：白・上に細い線） ---- */
.skin-uchiikura .site-foot{background:#fff;border-top:1px solid var(--line);margin-top:48px;padding:28px 0;font-size:12.5px;color:var(--sub)}
.skin-uchiikura .site-foot a{color:var(--sub)}
.skin-uchiikura .site-foot a:hover{color:var(--accent)}
.skin-uchiikura .site-foot .foot-nav{width:100%;display:flex;flex-wrap:wrap;gap:4px 14px;margin:0 0 6px}

/* ---- スマホ：ロゴの下にメニューを横スクロールで（共通テーマは960px以下でメニューを隠すので戻す） ---- */
@media (max-width:960px){
  .skin-uchiikura .site-head .wrap{flex-wrap:wrap;justify-content:flex-start;gap:4px 12px;padding-top:8px;padding-bottom:8px}
  .skin-uchiikura .brand{flex:1 1 100%}
  .skin-uchiikura .brand .logo.logo-full{height:36px}
  .skin-uchiikura .site-head .nav{display:flex;flex:1 1 100%;margin:0 -16px;padding:0 16px;gap:4px 12px}
  .skin-uchiikura .site-head .nav a{font-size:13px}
  .skin-uchiikura .site-head .nav a.cta{padding:6px 14px;font-size:12.5px}
  .skin-uchiikura .hero{width:calc(100% - 32px);padding:20px 16px}
}