/* ===== 遺品整理の手帖｜SWELL風クリーンメディア × 和モダン明朝 ===== */
:root{
  --accent:#1f4a3d; --accent2:#143028; --accent-soft:#eef2ee;
  --ink:#33312c; --muted:#8a857a; --line:#e7e3d9; --bg:#f7f6f2;
  --cream:#f3efe4; --chip:#5a7d6f;
  --mincho:"Hiragino Mincho ProN","Yu Mincho","YuMincho","MS PMincho",serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  line-height:1.95; font-size:16px; -webkit-font-smoothing:antialiased;
}
a{color:var(--accent2); text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%;height:auto;}
.muted{color:var(--muted);}

/* ===== ヘッダー ===== */
.site-header{background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50;}
.header-inner{max-width:1120px; margin:0 auto; padding:13px 22px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;}
.brand{font-family:var(--mincho); font-weight:700; font-size:21px; color:var(--accent2); letter-spacing:.06em;}
.brand:hover{text-decoration:none;}
.brand small{display:block; font-family:-apple-system,"Hiragino Sans",sans-serif; font-size:11px; color:var(--muted); font-weight:500; letter-spacing:0;}
.gnav{display:flex; gap:2px; flex-wrap:wrap;}
.gnav a{color:var(--ink); font-size:14px; font-weight:600; padding:6px 13px; border-radius:3px; letter-spacing:.02em;}
.gnav a:hover{background:var(--accent-soft); color:var(--accent2); text-decoration:none;}

/* ===== 2カラムレイアウト ===== */
.layout{max-width:1120px; margin:32px auto; padding:0 22px; display:grid; grid-template-columns:minmax(0,1fr) 312px; gap:40px; align-items:start;}
.main{min-width:0;}
@media(max-width:920px){ .layout{grid-template-columns:1fr; gap:32px;} }

/* 単カラム（固定ページ用） */
.container{max-width:760px; margin:32px auto; padding:0 22px;}

/* 記事カード（本文の入れ物） */
.card{background:#fff; border:1px solid var(--line); border-radius:6px; padding:40px 44px 48px;}
@media(max-width:680px){ .card{padding:26px 20px 32px;} }

/* ===== 記事メタ・パンくず ===== */
.breadcrumb{font-size:12px; color:var(--muted); margin-bottom:14px; letter-spacing:.02em;}
.breadcrumb a{color:var(--muted);}
.post-meta{display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:12.5px; color:var(--muted); margin:6px 0 4px;}
.cat-chip{display:inline-block; background:var(--chip); color:#fff !important; font-size:11.5px; font-weight:600; padding:3px 10px; border-radius:3px; letter-spacing:.03em;}
.cat-chip:hover{text-decoration:none; opacity:.9;}
.post-date::before{content:"\1F4C5  "; }
.pr{display:inline-block; font-size:11.5px; color:var(--muted); border:1px solid var(--line); border-radius:3px; padding:2px 8px; margin-bottom:14px;}

/* ===== 記事タイポgrafi ===== */
article h1{font-family:var(--mincho); font-size:28px; line-height:1.6; margin:.25em 0 .7em; padding-bottom:.5em; border-bottom:1px solid var(--line); letter-spacing:.02em; font-weight:700;}
article h2{font-family:var(--mincho); font-size:22px; margin:2.2em 0 .8em; padding:.35em 0 .35em 15px; border-left:4px solid var(--accent); letter-spacing:.02em; font-weight:700; scroll-margin-top:78px;}
article h3{font-family:var(--mincho); font-size:18px; margin:1.6em 0 .4em; padding-bottom:.25em; border-bottom:1px dashed var(--line); color:var(--accent2); font-weight:700; scroll-margin-top:78px;}
article p{margin:1em 0;}
.lead{background:var(--accent-soft); border-radius:5px; padding:20px 24px; font-size:15px;}
table{border-collapse:collapse; width:100%; margin:1.4em 0; font-size:14.5px;}
th,td{border:1px solid var(--line); padding:10px 13px; text-align:left;}
th{background:#f0efe9; color:var(--accent2); font-weight:700;}
tr:nth-child(even) td{background:#faf9f5;}
strong{color:var(--accent2);}
ul,ol{padding-left:1.4em;} li{margin:.4em 0;}
blockquote{border-left:3px solid var(--accent); background:#faf9f5; margin:1em 0; padding:.6em 1em; color:#555;}
.faq-q{font-family:var(--mincho); font-weight:700; margin-top:1.2em;}
.faq-a{color:#4a4842;}

/* ===== 目次 ===== */
.toc{background:#faf9f5; border:1px solid var(--line); border-radius:5px; padding:18px 22px; margin:1.6em 0;}
.toc-title{font-family:var(--mincho); font-weight:700; color:var(--accent2); font-size:15px; margin-bottom:8px; letter-spacing:.04em;}
.toc ol{margin:0; padding-left:1.4em; font-size:14px;}
.toc ol li{margin:.35em 0;}
.toc a{color:#4a4842;}

/* ===== CTAボタン ===== */
.cta-box{margin:1.8em 0; text-align:center;}
.cta-btn{display:inline-block; background:var(--accent); color:#fff !important; font-weight:700; font-size:15.5px; padding:14px 34px; border-radius:4px; letter-spacing:.06em; transition:background .15s;}
.cta-btn:hover{background:#27604f; text-decoration:none;}
.cta-btn--block{display:block; text-align:center; padding:13px 16px; font-size:15px;}
.cta-btn--light{background:var(--cream); color:var(--accent2) !important;}
.cta-btn--light:hover{background:#fff;}
.cta-note{display:block; font-size:12px; color:var(--muted); margin-top:9px; letter-spacing:.02em;}

/* ===== サイドバー・ウィジェット ===== */
.sidebar{font-size:14px;}
.widget{background:#fff; border:1px solid var(--line); border-radius:6px; padding:20px 20px; margin-bottom:22px;}
.widget h3{font-family:var(--mincho); font-size:15.5px; color:var(--accent2); margin:0 0 12px; padding-bottom:10px; border-bottom:1px solid var(--line); letter-spacing:.04em; font-weight:700;}
.widget p{margin:.4em 0; font-size:13.5px; line-height:1.85; color:#4a4842;}
.widget--accent{background:var(--accent-soft); border-color:#cfe0d8;}
.widget--sticky{position:sticky; top:80px;}
.widget-profile{color:#4a4842;}
.rank{margin:0; padding-left:1.4em; font-size:13.5px;}
.rank li{margin:.5em 0; line-height:1.6;}
.cat-list{list-style:none; margin:0; padding:0; font-size:13.5px;}
.cat-list li{padding:8px 0; border-bottom:1px dotted var(--line);}
.cat-list li:last-child{border-bottom:none;}

/* ===== トップ：スリムなメインビジュアル ===== */
.hero{background:linear-gradient(rgba(15,38,32,.55),rgba(15,38,32,.72)), url('/assets/hero.jpg') center/cover no-repeat; color:#fff; padding:52px 22px; text-align:center;}
.hero h1{font-family:var(--mincho); font-size:27px; margin:0 0 12px; line-height:1.7; letter-spacing:.07em; text-shadow:0 2px 12px rgba(0,0,0,.45); font-weight:700;}
.hero p{font-size:15px; opacity:.96; margin:0 auto; max-width:620px; line-height:1.95; text-shadow:0 1px 8px rgba(0,0,0,.4);}

/* ===== トップ：記事カード一覧 ===== */
.list-title{font-family:var(--mincho); font-size:19px; color:var(--accent2); margin:0 0 16px; padding-left:12px; border-left:4px solid var(--accent); letter-spacing:.04em;}
.post-card{display:block; background:#fff; border:1px solid var(--line); border-radius:6px; padding:20px 22px; margin-bottom:16px; color:var(--ink);}
.post-card:hover{text-decoration:none; box-shadow:0 3px 12px rgba(0,0,0,.06);}
.post-card .pc-meta{display:flex; gap:9px; align-items:center; margin-bottom:8px; flex-wrap:wrap;}
.post-card h3{font-family:var(--mincho); font-size:18px; color:var(--accent2); margin:.1em 0 .4em; line-height:1.6; font-weight:700;}
.post-card p{margin:0; font-size:13.5px; color:#5a564d; line-height:1.8;}
.post-card.is-soon{opacity:.62;}

/* トップの導線ボックス（シミュレーター紹介） */
.intro-box{background:#fff; border:1px solid var(--line); border-top:3px solid var(--accent); border-radius:6px; padding:26px 26px; margin-bottom:28px; text-align:center;}
.intro-box h2{font-family:var(--mincho); color:var(--accent2); margin:.1em 0 .5em; font-size:20px;}
.intro-box p{font-size:14px; color:#4a4842; margin:.4em 0 1.1em;}

/* ===== 注意書き・固定ページ ===== */
.notice{background:#fbf6e3; border:1px solid #e6dcae; border-radius:4px; padding:13px 16px; font-size:13.5px; color:#6d5a1f; margin:1em 0;}
.fillin{background:#f4e7ef; border:1px dashed #c188aa; border-radius:3px; padding:2px 6px; font-size:13px; color:#993f76;}

/* ===== 費用シミュレーター ===== */
.sim{background:#faf9f5; border:1px solid var(--line); border-radius:5px; padding:24px 26px; margin:1.4em 0;}
.sim-field{margin-bottom:20px;}
.sim-field:last-child{margin-bottom:0;}
.sim-field > label{display:block; font-family:var(--mincho); font-weight:700; color:var(--accent2); margin-bottom:4px; letter-spacing:.03em;}
.sim-help{display:block; font-family:-apple-system,"Hiragino Sans",sans-serif; font-size:12.5px; color:var(--muted); font-weight:400; margin:2px 0 8px; letter-spacing:0;}
.sim select{width:100%; padding:12px 14px; font-size:15px; color:var(--ink); border:1px solid #c7c2b5; border-radius:4px; background:#fff;}
.sim-checks{display:flex; flex-direction:column; gap:10px;}
.sim-check{display:flex; align-items:center; gap:10px; font-size:14.5px; font-weight:400; cursor:pointer; color:var(--ink);}
.sim-check input{width:18px; height:18px; accent-color:var(--accent);}
.sim-result{background:var(--accent); color:#fff; border-radius:5px; padding:26px 24px; text-align:center; margin:1.2em 0;}
.sim-result-label{font-size:14px; letter-spacing:.1em; opacity:.9;}
.sim-result-amount{font-family:var(--mincho); font-size:33px; font-weight:700; letter-spacing:.04em; margin:8px 0 0; line-height:1.4;}
.sim-result-note{font-size:12.5px; opacity:.92; margin-top:12px; line-height:1.7; text-align:left; max-width:560px; margin-left:auto; margin-right:auto;}
.sim-hide{display:none;}
@media(max-width:680px){ .sim-result-amount{font-size:25px;} .sim{padding:18px 16px;} }

/* ===== フッター ===== */
.site-footer{background:#1a2823; color:#cdd6d0; margin-top:56px; padding:38px 22px;}
.footer-inner{max-width:1120px; margin:0 auto; display:flex; flex-wrap:wrap; gap:26px; justify-content:space-between;}
.site-footer a{color:#cdd6d0; font-size:13px; display:block; margin:.35em 0;}
.site-footer a:hover{color:#fff;}
.footer-brand{font-family:var(--mincho); font-weight:700; color:#fff; font-size:17px; letter-spacing:.06em;}
.copyright{max-width:1120px; margin:24px auto 0; font-size:12px; color:#8a948d; border-top:1px solid #2e3c36; padding-top:18px; letter-spacing:.02em;}

/* ===================================================== */
/* ===== モバイル最適化（SP） ============================ */
/* ===================================================== */

/* 1カラム化したら sticky widget は解除（スクロール阻害防止） */
@media (max-width: 920px) {
  .widget--sticky { position: static; }
}

/* スマートフォン全般（〜680px） */
@media (max-width: 680px) {
  /* ヘッダー */
  .header-inner { padding: 10px 14px; gap: 8px; }
  .brand { font-size: 18px; letter-spacing: .04em; }
  .brand small { display: none; }
  .gnav { gap: 1px; }
  .gnav a { font-size: 13px; padding: 6px 10px; letter-spacing: .01em; }

  /* ヒーロー */
  .hero { padding: 38px 18px; }
  .hero h1 { font-size: 22px; line-height: 1.6; letter-spacing: .04em; }
  .hero p { font-size: 13.5px; line-height: 1.85; }

  /* レイアウト */
  .layout { margin: 18px auto; padding: 0 14px; gap: 22px; }
  .container { margin: 18px auto; padding: 0 14px; }

  /* 記事カード（本文） */
  .card { padding: 22px 18px 28px; }
  article h1 { font-size: 22px; line-height: 1.55; padding-bottom: .4em; margin-bottom: .6em; }
  article h2 { font-size: 18.5px; margin: 1.8em 0 .6em; padding: .25em 0 .25em 12px; border-left-width: 4px; }
  article h3 { font-size: 16.5px; margin: 1.3em 0 .35em; }
  article p { margin: .9em 0; }
  .lead { padding: 16px 18px; font-size: 14.5px; line-height: 1.85; }
  .breadcrumb { font-size: 11.5px; }
  .post-meta { font-size: 12px; gap: 8px; flex-wrap: wrap; }

  /* 目次 */
  .toc { padding: 14px 16px; }
  .toc-title { font-size: 14px; }
  .toc ol { font-size: 13.5px; padding-left: 1.2em; }

  /* テーブル */
  table { font-size: 13px; margin: 1.2em 0; }
  th, td { padding: 7px 9px; }

  /* CTAボタン：全幅・タップしやすく */
  .cta-box { margin: 1.5em 0; }
  .cta-btn { display: block; width: 100%; padding: 16px 14px; font-size: 15px; box-sizing: border-box; }
  .cta-btn--block { padding: 14px 14px; }
  .cta-note { margin-top: 7px; font-size: 11.5px; }

  /* トップの記事一覧カード */
  .post-card { padding: 16px 18px; margin-bottom: 12px; }
  .post-card h3 { font-size: 16px; line-height: 1.55; }
  .post-card p { font-size: 12.5px; line-height: 1.7; }
  .pc-meta { gap: 7px; flex-wrap: wrap; }
  .cat-chip { font-size: 11px; padding: 2px 8px; }
  .list-title { font-size: 17px; margin-bottom: 12px; }
  .intro-box { padding: 22px 18px; }
  .intro-box h2 { font-size: 17px; }
  .intro-box p { font-size: 13.5px; }

  /* サイドバー（1カラム時） */
  .widget { padding: 16px 16px; margin-bottom: 16px; }
  .widget h3 { font-size: 14.5px; }
  .widget p, .rank, .cat-list { font-size: 13px; }

  /* シミュレーター（iOSの自動拡大防止: selectは16px以上） */
  .sim { padding: 16px 14px; }
  .sim select { font-size: 16px; padding: 11px 12px; }
  .sim-check { font-size: 14px; }
  .sim-help { font-size: 12px; }
  .sim-result { padding: 22px 16px; }
  .sim-result-amount { font-size: 25px; }

  /* フッター */
  .site-footer { padding: 28px 18px; }
  .footer-inner { gap: 16px; }
  .footer-brand { font-size: 15px; }
  .site-footer a { font-size: 12.5px; }
  .copyright { font-size: 11px; padding-top: 14px; }

  /* 通知ボックス */
  .notice { font-size: 12.5px; padding: 11px 13px; }
}

/* 小型スマホ（〜380px） */
@media (max-width: 380px) {
  body { font-size: 15px; }
  .brand { font-size: 17px; }
  .gnav a { font-size: 12.5px; padding: 5px 8px; }
}

/* ===== モバイル下部固定 CTA バー（コンバージョン直結） ===== */
.mobile-cta { display: none; }
@media (max-width: 680px) {
  .mobile-cta {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--accent);
    color: #fff !important;
    padding: 14px 18px;
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
    z-index: 100;
    box-shadow: 0 -3px 12px rgba(0,0,0,.18);
    letter-spacing: .05em;
    border-top: 1px solid var(--accent2);
  }
  .mobile-cta:hover, .mobile-cta:active {
    text-decoration: none;
    background: var(--accent2);
  }
  .mobile-cta .arrow {
    font-size: 22px;
    line-height: 1;
    font-weight: 400;
    margin-left: 8px;
  }
  /* 下部CTA分の余白を確保（CTAがあるページのみ） */
  body:has(.mobile-cta) { padding-bottom: 64px; }
}

/* ===== モバイル下部 CTA v2：クリッカブル強化版 ===== */
@media (max-width: 680px) {
  .mobile-cta {
    /* 全体は緑のバー */
    background: linear-gradient(180deg, var(--accent) 0%, #18402f 100%);
    padding: 10px 12px 11px;
    gap: 10px;
    justify-content: flex-start;
    align-items: center;
    box-shadow: 0 -4px 16px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08);
    font-size: 14px;
  }
  .mc-badge {
    background: #e8743b;
    color: #fff;
    padding: 4px 8px;
    font-size: 11px;
    border-radius: 3px;
    letter-spacing: .08em;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 1px 0 #b54e1c;
  }
  .mc-text {
    flex: 1;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.3;
  }
  .mc-go {
    background: #e8743b;
    color: #fff;
    padding: 11px 16px 12px;
    border-radius: 5px;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: .05em;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
    box-shadow: 0 3px 0 #b54e1c;
    transition: transform .12s ease, box-shadow .12s ease;
    animation: mcPulse 2.6s ease-in-out infinite;
  }
  .mc-arrow {
    display: inline-block;
    font-size: 18px;
    line-height: 1;
    margin-left: 2px;
    transition: transform .15s;
  }
  .mobile-cta:active .mc-go {
    box-shadow: 0 0 0 #b54e1c;
    transform: translateY(3px);
    animation: none;
  }
  .mobile-cta:active .mc-arrow { transform: translateX(3px); }

  /* バーが少し背が高くなった分の余白 */
  body:has(.mobile-cta) { padding-bottom: 70px; }
}

/* 注意を引くための軽い脈動（押せそうに見せる） */
@keyframes mcPulse {
  0%, 100% { box-shadow: 0 3px 0 #b54e1c, 0 0 0 0 rgba(232,116,59,0); }
  50%      { box-shadow: 0 3px 0 #b54e1c, 0 0 0 8px rgba(232,116,59,.18); }
}

/* ========== アフィリエイト広告（PR）関連 ========== */
.cta-pr{display:block; font-size:10.5px; color:#aaa; margin-bottom:6px; letter-spacing:.03em; font-weight:400;}
.cta-box .cta-btn + .cta-btn{margin-left:8px;}
@media (max-width: 720px){
  .cta-box .cta-btn + .cta-btn{margin-left:0; margin-top:8px;}
}
.ad-card{margin:1.4em 0; padding:16px 14px; text-align:center; background:#fafaf7; border:1px solid #ebe7df; border-radius:6px;}
.ad-card img{display:block; margin:0 auto 12px;}
.ad-card .cta-btn{display:inline-block;}
@media (max-width: 720px){
  .ad-card .cta-btn{display:block;}
}

/* ========== 本文中のインラインリンクを認識しやすく ========== */
/* 対象：記事本文の <p>・<li>・<td> 内のリンク と FAQ回答内リンク */
/* 除外：cta-btn、ナビ、パンクズ、フッター（既存の専用スタイルを尊重） */
article p a:not(.cta-btn):not(.cta-btn--block),
article li a:not(.cta-btn):not(.cta-btn--block),
article td a:not(.cta-btn):not(.cta-btn--block),
article dd a:not(.cta-btn):not(.cta-btn--block),
.faq-a a {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(31, 74, 61, .55);
  transition: color .15s, text-decoration-color .15s;
}
article p a:not(.cta-btn):not(.cta-btn--block):hover,
article li a:not(.cta-btn):not(.cta-btn--block):hover,
article td a:not(.cta-btn):not(.cta-btn--block):hover,
article dd a:not(.cta-btn):not(.cta-btn--block):hover,
.faq-a a:hover {
  color: var(--accent2);
  text-decoration-color: var(--accent2);
}
/* サイドバーのウィジェット内リンク（cta-btn以外）にも下線 */
.widget a:not(.cta-btn):not(.cta-btn--block) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(31, 74, 61, .45);
}