/* 5つの型の個別のページ（部3＝53番）。見た目の正は 50_サイト全面改修\試作\T1〜T5.html（53-1、2026-10-31 確定）。部品は inc/single-parts.php。
   色の名前と html の字の大きさは css/sk-chrome.css（共通の部品）。名前はすべて sk-art- で始め、古い CSS・ほかの部品とぶつけない。寸法はすべて rem。
   部品は使う段で足す（53-2：帯・本文の器・目次・横の札・一覧。会員の案内・関連・相談の帯は 53-3、購入の札は 53-6） */

.sk-art{
  --sk-cream:#FBF8F3;--sk-cream-2:#F4EDE2;--sk-line:#E6DACA;--sk-ink:#241812;--sk-muted:#7b6a5c;--sk-link:#8A6420;
  --sk-brand:linear-gradient(135deg,#2A1A12 0%,#4A2F20 55%,#5E3E2A 100%);
  font-size:.9375rem;line-height:1.75;color:var(--sk-ink);background:var(--sk-cream)
}
/* 古い style.css の見出し・段落・表・リストの指定を打ち消す（58-1 の sk-sem と同じ） */
.sk-art :where(h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,table,figure,blockquote){margin:0}
.sk-art :where(h1,h2,h3,h4,h5,h6){font-weight:inherit;line-height:1.45;color:inherit;letter-spacing:normal;text-transform:none}
.sk-art :where(table,th,td){border:0;background:none}
/* 古い style.css に nav{display:none} がある（パンくずと横の目次が消えた） */
.sk-art nav.sk-art-crumb,.sk-art nav.sk-art-stoc{display:block}

/* ===== 見出しの帯 ===== */
.sk-art-head{position:relative;overflow:hidden;isolation:isolate;background:var(--sk-brand);color:var(--sk-ink-dk);padding:.875rem 0 1.125rem}
.sk-art-crumb{font-size:.6875rem;color:#cdbda6;margin-bottom:.5rem;overflow-wrap:anywhere}
.sk-art-crumb a{color:inherit;text-decoration:underline;text-underline-offset:.1875rem}
.sk-art-crumb a:hover{color:var(--sk-gold-lt)}
.sk-art-badges{display:flex;flex-wrap:wrap;gap:.375rem;margin-bottom:.375rem}
.sk-art-badge{font-size:.6875rem;line-height:1.375rem;padding:0 .5625rem;background:var(--sk-champ);color:var(--sk-brown-dk);border:.0625rem solid var(--sk-champ);font-weight:700}
.sk-art-eyebrow{display:block;font-family:var(--sk-latin);letter-spacing:.32em;font-size:.6875rem;text-transform:uppercase;color:var(--sk-gold-text);margin-bottom:.125rem}
.sk-art-head h1{font-family:var(--sk-serif);font-weight:600;font-size:clamp(1.25rem,2vw,1.75rem);line-height:1.45;margin:0 0 .5rem;color:var(--sk-champ)}
.sk-art-pre{display:block;font-size:.8125rem;font-family:"Noto Sans JP",sans-serif;font-weight:500;letter-spacing:.12em;color:var(--sk-gold-text);margin-bottom:.0625rem}
.sk-art-lead{margin:0 0 .75rem;color:#eadfce;font-size:.875rem;line-height:1.75}
.sk-art-facts{display:flex;flex-wrap:wrap;margin:0;border-top:.0625rem solid rgba(243,221,174,.3);border-bottom:.0625rem solid rgba(243,221,174,.3)}
.sk-art-facts div{padding:.375rem 1.25rem .375rem 0}
.sk-art-facts div+div{padding-left:1.25rem;border-left:.0625rem solid rgba(243,221,174,.2)}
.sk-art-facts dt{font-size:.6875rem;color:var(--sk-gold-text);letter-spacing:.08em}
.sk-art-facts dd{margin:0;font-size:.8125rem;font-weight:500;line-height:1.55}
.sk-art-hchips{display:flex;flex-wrap:wrap;gap:.3125rem;margin-top:.5rem}
.sk-art-hchips a{font-size:.6875rem;line-height:1.375rem;padding:0 .5rem;border:.0625rem solid rgba(243,221,174,.35);color:var(--sk-ink-dk);transition:background-color .2s,color .2s}
.sk-art-hchips a:hover{background:var(--sk-gold-lt);color:var(--sk-brown-dk);border-color:var(--sk-gold-lt)}
/* 背景の画像（型ごとの設定）。左は不透明、右へ行くほど透明。画像はトップの MV と同じ色の調整。
   幅 1101px 以上は文字を帯の6割までにし、その範囲の覆いは濃く保つ（試作で左40%の輝度 21.5〜24.3、帯の文字のコントラスト比 5.2 以上を確かめた） */
.sk-art-head .sk-art-mv{position:absolute;inset:0;z-index:-2;width:100%;height:100%;max-width:none;object-fit:cover;object-position:right center;filter:sepia(.35) saturate(.8) hue-rotate(-8deg)}
.sk-art-head.sk-art-has-mv{background:var(--sk-brown-dk)}
.sk-art-head.sk-art-has-mv::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(30,20,15,.96) 0%,rgba(30,20,15,.93) 45%,rgba(42,26,18,.8) 60%,rgba(42,26,18,.35) 76%,rgba(42,26,18,.1) 100%)}
.sk-art-head.sk-art-has-mv .sk-wrap>*{max-width:60%}

/* ===== 本文の面と横の札 ===== */
.sk-art-body{background:var(--sk-cream);padding:1.75rem 0 3rem}
.sk-art-grid{display:grid;grid-template-columns:minmax(0,1fr) 19rem;gap:2.5rem;align-items:start}
.sk-art-col{min-width:0}
.sk-art-main{background:#fff;border:.0625rem solid var(--sk-line);padding:1.75rem 2rem 2.25rem;min-width:0}
.sk-art-toc{margin:0 0 1.75rem;padding:.875rem 1.125rem 1rem;background:var(--sk-cream);border:.0625rem solid var(--sk-line)}
.sk-art-toc p,.sk-art-stoc p{margin:0 0 .375rem;font-family:var(--sk-latin);font-size:.6875rem;letter-spacing:.24em;color:var(--sk-link)}
/* 番号は上の段の見出しだけで数える（一段下げた小見出しは数に入れない） */
.sk-art-toc ol,.sk-art-stoc ol{margin:0;padding:0;list-style:none;counter-reset:sk-toc;font-size:.8125rem;line-height:1.55}
.sk-art-toc li,.sk-art-stoc li{margin:.25rem 0;display:grid;grid-template-columns:1.5rem 1fr}
.sk-art-toc li:not(.is-sub),.sk-art-stoc li:not(.is-sub){counter-increment:sk-toc}
.sk-art-toc li:not(.is-sub)::before,.sk-art-stoc li:not(.is-sub)::before{content:counter(sk-toc) ".";color:var(--sk-brown-md)}
.sk-art-toc li.is-sub,.sk-art-stoc li.is-sub{font-size:.75rem;padding-left:.5rem}
.sk-art-toc li.is-sub::before,.sk-art-stoc li.is-sub::before{content:"–";color:var(--sk-muted);text-align:right;padding-right:.375rem}
.sk-art-toc a,.sk-art-stoc a{color:var(--sk-brown-md);text-decoration:underline;text-underline-offset:.1875rem;text-decoration-color:var(--sk-line)}
.sk-art-toc a:hover,.sk-art-stoc a:hover{color:var(--sk-brown);text-decoration-color:var(--sk-brown)}
.sk-art-stoc a.is-on{color:var(--sk-brown);font-weight:700;text-decoration-color:var(--sk-gold)}
/* 横の札に目次があるとき（幅 1101px 以上）は、本文の上の目次を出さない */
@media (min-width:1101px){.sk-art-grid:has(.sk-art-stoc) .sk-art-toc{display:none}}
/* 上はヘッダー（固定。約5.3rem）の下に止める */
.sk-art-side{position:sticky;top:6.5rem;display:grid;gap:1rem}
.sk-art-card{background:var(--sk-brown-dk);color:var(--sk-ink-dk);padding:1.25rem 1.25rem 1.5rem;border-top:.25rem solid var(--sk-gold)}
.sk-art-t{font-family:var(--sk-serif);font-size:.9375rem;font-weight:600;color:var(--sk-champ);line-height:1.55;margin:.25rem 0 .75rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sk-art-card dl{margin:0 0 1rem;font-size:.8125rem}
.sk-art-card dl div{display:grid;grid-template-columns:4.5rem 1fr;gap:.5rem;padding:.4375rem 0;border-bottom:.0625rem solid rgba(243,221,174,.15)}
.sk-art-card dt{color:var(--sk-gold-text)}
.sk-art-card dd{margin:0}
.sk-art-card .sk-btn{width:100%;min-height:3rem;font-size:.875rem;white-space:normal;text-align:center;line-height:1.4;padding:.5rem 1rem}
.sk-art-stoc{background:#fff;border:.0625rem solid var(--sk-line);padding:1rem 1.125rem;max-height:calc(100vh - 25rem);overflow:auto}

/* ===== 本文の器：今の本文の HTML（クラシックの編集画面・ブロックの HTML・ACF の段）を新しい器で。古い .wp__single_content は使わない ===== */
.sk-art-prose{font-size:.9375rem;line-height:1.8;color:var(--sk-ink);overflow-wrap:anywhere}
.sk-art-prose>:first-child{margin-top:0}
.sk-art-prose [id]{scroll-margin-top:6.5rem}
.sk-art-prose input,.sk-art-prose select,.sk-art-prose textarea,.sk-art-prose iframe,.sk-art-prose video{max-width:100%}
.sk-art-prose h2{font-family:var(--sk-serif);font-weight:600;font-size:1.3125rem;line-height:1.5;margin:2.25rem 0 .875rem;padding:0 0 .4375rem;border-bottom:.125rem solid var(--sk-brown);color:var(--sk-ink)}
.sk-art-prose h3{font-size:1.0625rem;font-weight:700;line-height:1.55;color:var(--sk-brown);margin:1.75rem 0 .625rem;padding-left:.625rem;border-left:.25rem solid var(--sk-gold)}
.sk-art-prose h4{font-size:.9375rem;font-weight:700;margin:1.5rem 0 .5rem}
.sk-art-prose h5,.sk-art-prose h6{font-size:.9375rem;font-weight:700;margin:1.25rem 0 .5rem}
.sk-art-prose p{margin:0 0 .875rem}
/* sk-chrome.css の :where(.sk) ul{list-style:none} を、本文の中では戻す */
.sk-art-prose ul,.sk-art-prose ol{margin:0 0 .875rem;padding-left:1.5rem}
.sk-art-prose ul{list-style:disc}
.sk-art-prose ol{list-style:decimal}
.sk-art-prose ul ul{list-style:circle}
.sk-art-prose li{margin-bottom:.3125rem}
.sk-art-prose a{color:var(--sk-link);text-decoration:underline;text-underline-offset:.1875rem}
.sk-art-prose a:hover{color:var(--sk-brown)}
.sk-art-prose img{max-width:100%;height:auto;display:inline-block}
.sk-art-prose strong,.sk-art-prose b{font-weight:700}
.sk-art-prose blockquote,.sk-art-prose .wp-block-quote{margin:0 0 1.25rem;padding:1rem 1.25rem;background:var(--sk-cream);border-left:.25rem solid var(--sk-gold)}
.sk-art-prose blockquote p:last-child{margin-bottom:0}
.sk-art-tscroll{overflow-x:auto;margin:0 0 1.25rem}
/* 古い style.css は投稿・固定ページの表を、JS が印（active）を付けるまで隠す（行を display:none、表の高さ 50px と読み込み中の画像）。
   WP Meteor が JS を最初の操作まで止めるので、新しい器では表を常に出す */
.sk-art-prose table{display:table!important;background-image:none!important}
.sk-art-prose table tr{display:table-row!important}
.sk-art-prose table{width:100%!important;height:auto!important;border-collapse:collapse;margin:0;font-size:.8125rem;line-height:1.65}
.sk-art-prose th,.sk-art-prose td{border:.0625rem solid var(--sk-line);padding:.5rem .6875rem;vertical-align:top;height:auto!important;word-break:normal;overflow-wrap:break-word}
/* 表の中の長い URL は途中で折り返す（折り返せないと表の幅が広がり、枠が1つの囲みの表まで横に動く。53-5） */
.sk-art-prose td a{overflow-wrap:anywhere}
/* 番号・規格番号だけの列が1文字ずつ折れないように */
.sk-art-prose td:first-child{min-width:2.75rem}
.sk-art-prose td p:last-child,.sk-art-prose th p:last-child{margin-bottom:0}
.sk-art-prose th{background:var(--sk-cream-2);font-weight:700;text-align:left}
.sk-art-prose table.table1 tr:first-child>td,.sk-art-prose table.table3 tr:first-child>td{background:var(--sk-brown);color:var(--sk-gold-lt);font-weight:500}
.sk-art-prose table.table2 td:first-child,.sk-art-prose table.table3 tr+tr td:first-child{background:var(--sk-cream-2);font-weight:700}
.sk-art-prose .has-text-align-center,.sk-art-prose .rtecenter{text-align:center}
.sk-art-prose .has-text-align-right{text-align:right}
.sk-art-prose .wp-block-columns{display:flex;flex-wrap:wrap;gap:1.5rem;margin:0 0 1rem}
.sk-art-prose .wp-block-column{flex:1 1 0;min-width:min(100%,14rem)}
.sk-art-prose a.btn,.sk-art-prose .btn-flat{display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;padding:.5rem 1.25rem;background:var(--sk-brown);color:var(--sk-gold-lt);border:.0625rem solid var(--sk-brown);text-decoration:none;font-weight:500;line-height:1.4}
.sk-art-prose a.btn:hover,.sk-art-prose .btn-flat:hover{background:var(--sk-gold-lt);color:var(--sk-brown-dk)}
/* 法令解説・C Topics の段（ACF の柔軟コンテンツ。今の HTML のまま） */
.sk-art-prose .wp_block_purpose{margin:0 0 2rem}
.sk-art-prose .wp_block_purpose_content{display:flex;gap:1.5rem;align-items:flex-start;margin:0 0 1rem}
.sk-art-prose .wp_block_purpose_content.right{flex-direction:row-reverse}
.sk-art-prose .wp_block_purpose_content--item{min-width:0}
.sk-art-prose .wp_block_purpose_content--item.txt{flex:1 1 0}
.sk-art-prose .wp_block_purpose_content--item.img{flex:0 0 13.5rem}
.sk-art-prose .wp_block_purpose_content--item.--vs-20.img{flex-basis:20%}
.sk-art-prose .wp_block_purpose_content--item.img img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border:.0625rem solid var(--sk-line)}
.sk-art-prose .wp_block_cloumsx{columns:2 18rem;column-gap:2rem;margin:0 0 1.25rem;padding:1rem 1.25rem;background:var(--sk-cream);border:.0625rem solid var(--sk-line)}
.sk-art-prose .wp_block_cloumsx p{margin:0 0 .25rem;break-inside:avoid;font-size:.875rem}
.sk-art-dl{margin-top:1.25rem}

/* ===== 一覧（小さな札） ===== */
.sk-art-block-h{display:flex;justify-content:space-between;align-items:baseline;border-top:.125rem solid var(--sk-brown);padding-top:.625rem;margin-bottom:.375rem}
.sk-art-block-h h2,.sk-art-block-h h3{margin:0;font-family:var(--sk-serif);font-size:1rem;font-weight:600;letter-spacing:.05em}
.sk-art-go{font-size:.8125rem;color:var(--sk-link);text-decoration:underline;text-underline-offset:.1875rem}
.sk-art-cards{list-style:none;margin:0;padding:0}
.sk-art-cardi{display:grid;grid-template-columns:5.25rem 1fr;gap:.75rem;padding:.75rem 0;border-bottom:.0625rem solid var(--sk-line)}
.sk-art-im{display:block;width:5.25rem;height:5.25rem;overflow:hidden;background:var(--sk-brand)}
.sk-art-im img{width:100%;height:100%;object-fit:cover}
.sk-art-ph{width:100%;height:100%;display:grid;place-items:center;text-align:center;font-family:var(--sk-latin);font-size:.6875rem;letter-spacing:.08em;color:var(--sk-gold-text)}
.sk-art-meta{display:flex;gap:.5rem;align-items:center;font-size:.75rem;color:var(--sk-muted)}
.sk-art-mem{font-size:.6562rem;border:.0625rem solid var(--sk-link);color:var(--sk-link);padding:0 .3125rem;line-height:1.6}
.sk-art-ct{display:block}
.sk-art-tt{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:.875rem;font-weight:500;line-height:1.55;margin:.125rem 0 .375rem}
.sk-art-ct:hover .sk-art-tt{text-decoration:underline;text-underline-offset:.1875rem}
.sk-art-chips{display:flex;flex-wrap:wrap;gap:.25rem .3125rem;max-height:3rem;overflow:hidden}
.sk-art-chip{font-size:.6875rem;line-height:1.25rem;height:1.375rem;padding:0 .5rem;border:.0625rem solid var(--sk-line);background:var(--sk-cream-2);color:var(--sk-brown-md);white-space:nowrap}
/* 横の札の中の一覧（お知らせの「新しい商品」） */
.sk-art-slist{background:#fff;border:.0625rem solid var(--sk-line);padding:1rem 1.125rem}
.sk-art-slist .sk-art-cardi{grid-template-columns:3.75rem 1fr;gap:.625rem;padding:.625rem 0}
.sk-art-slist .sk-art-im{width:3.75rem;height:3.75rem}
.sk-art-slist .sk-art-tt{font-size:.8125rem;-webkit-line-clamp:2;margin-bottom:0}
.sk-art-slist .sk-art-go{display:inline-block;margin-top:.5rem}
/* お知らせ：ほかのお知らせ */
.sk-art-sec-h{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin:2.5rem 0 1rem;padding-bottom:.875rem;border-bottom:.0625rem solid var(--sk-line)}
.sk-art-sec-h h2{margin:0;font-family:var(--sk-serif);font-weight:600;font-size:1.5rem;letter-spacing:.06em;line-height:1.3}
.sk-art-sec-h small{display:block;font-family:var(--sk-latin);font-size:.7812rem;letter-spacing:.32em;color:var(--sk-link);font-weight:500}
.sk-art-news{list-style:none;margin:0;padding:0;border-top:.0625rem solid var(--sk-line)}
.sk-art-news a{display:grid;grid-template-columns:6.5rem 1fr;gap:1rem;padding:.75rem .5rem;border-bottom:.0625rem solid var(--sk-line);transition:background-color .2s,color .2s}
.sk-art-news a:hover{background:var(--sk-brown);color:var(--sk-gold-lt)}
.sk-art-news time{font-family:var(--sk-latin);font-size:.875rem;color:var(--sk-link)}
.sk-art-news a:hover time{color:var(--sk-gold-text)}

/* ===== 53-3：投稿の記事の後（会員の案内・キーワード・前後の記事・あわせて読む・よく読まれているページ・相談の帯） ===== */
/* 先頭部分で切れているとき、本文の下を薄くする（全文は会員の案内の先） */
.sk-art-cut{position:relative}
.sk-art-cut::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6rem;background:linear-gradient(180deg,rgba(255,255,255,0),#fff);pointer-events:none}
/* 会員の案内：今の部品（swpm/swpm-membership-regist.php）の HTML を、新しい見た目に。古い style.css の指定より強くする */
.sk-art .sk-art-member .grid-1600,.sk-art .sk-art-member .grid-746{width:auto;max-width:none;margin:0;padding:0}
.sk-art .sk-art-member .wp__member_single{margin:1.5rem 0 0;padding:1.75rem 1.5rem;background:var(--sk-brand);color:var(--sk-ink-dk);border-top:.25rem solid var(--sk-gold);text-align:center}
.sk-art .sk-art-member .wp__member_single h4{margin:0 0 .5rem;font-family:var(--sk-serif);font-weight:600;font-size:1.1875rem;line-height:1.5;color:var(--sk-champ)}
.sk-art .sk-art-member .wp__member_single h5{margin:0 0 .5rem;padding:0;font-size:.875rem;font-weight:500;line-height:1.6;color:#eadfce}
.sk-art .sk-art-member .wp__member_single h4:empty,.sk-art .sk-art-member .wp__member_single h5:empty,.sk-art .sk-art-member .wp__member_single p:empty{display:none}
.sk-art .sk-art-member .wp__member_single p{margin:0 0 1rem;padding:0;font-size:.875rem;text-align:center;color:#eadfce}
.sk-art .sk-art-member .wp__member_single button,.sk-art .sk-art-member .wp__member_single a{display:inline-flex;align-items:center;justify-content:center;min-width:0;min-height:3rem;margin:.375rem;padding:0 1.5rem;font-size:.875rem;font-weight:500;line-height:1.4;text-decoration:none;background-image:none;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s;font-family:inherit}
.sk-art .sk-art-member .wp__member_single button{background:var(--sk-champ-btn);color:var(--sk-brown-dk);border:.0625rem solid var(--sk-champ)}
.sk-art .sk-art-member .wp__member_single button:hover{background:var(--sk-brown-dk);color:var(--sk-champ);opacity:1}
.sk-art .sk-art-member .wp__member_single a{background:transparent;color:var(--sk-ink-dk);border:.0625rem solid rgba(244,235,221,.55)}
.sk-art .sk-art-member .wp__member_single a:hover{background:var(--sk-gold-lt);color:var(--sk-brown-dk)!important;opacity:1}
.sk-art .sk-art-member .wp__member_single .wrap__buton_con,.sk-art .sk-art-member .wp__member_single .swpm__membership--logout{display:inline-block}
/* キーワード・前後の記事 */
.sk-art-tags{margin-top:2.25rem;padding-top:1rem;border-top:.0625rem solid var(--sk-line)}
.sk-art-tags .sk-art-chips{max-height:none}
.sk-art-tags a.sk-art-chip{transition:background-color .2s,color .2s}
.sk-art-tags a.sk-art-chip:hover{background:var(--sk-brown);color:var(--sk-gold-lt);border-color:var(--sk-brown)}
.sk-art-note{font-size:.8125rem;color:var(--sk-muted);margin:0 0 .5rem}
.sk-art nav.sk-art-pn{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.5rem}
.sk-art-pn a{display:block;padding:.875rem 1rem;background:var(--sk-cream);border:.0625rem solid var(--sk-line);transition:background-color .2s,color .2s}
.sk-art-pn a:hover{background:var(--sk-brown);color:var(--sk-gold-lt);border-color:var(--sk-brown)}
.sk-art-pn small{display:block;font-size:.75rem;color:var(--sk-muted)}
.sk-art-pn a:hover small{color:var(--sk-gold-text)}
.sk-art-pn span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.8125rem;line-height:1.55}
.sk-art-pn .sk-art-next{text-align:right}
/* あわせて読む */
.sk-art-rel{background:#fff;border-top:.0625rem solid var(--sk-line);padding:3.5rem 0}
.sk-art-rel .sk-art-sec-h{margin-top:0}
.sk-art-sec-h p{margin:0;color:var(--sk-muted);font-size:.8125rem}
.sk-art-relgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem 2rem}
.sk-art-block{min-width:0}
.sk-art-block.sk-art-wide{grid-column:1/-1}
.sk-art-block.sk-art-wide .sk-art-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:2rem}
.sk-art-pop{margin-top:2.75rem}
.sk-art-pop ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1.25rem;counter-reset:sk-pop}
.sk-art-pop li{counter-increment:sk-pop;border-left:.0625rem solid var(--sk-line);padding-left:.875rem}
.sk-art-pop li a{display:grid;gap:.25rem;padding:.125rem .375rem .375rem;margin-left:-.375rem;transition:background-color .2s,color .2s}
.sk-art-pop li a::before{content:counter(sk-pop,decimal-leading-zero);font-family:var(--sk-latin);font-size:1.625rem;line-height:1.1;color:var(--sk-link)}
.sk-art-pop li a:hover{background:var(--sk-brown);color:var(--sk-gold-lt)}
.sk-art-pop li a:hover::before{color:var(--sk-gold-text)}
.sk-art-pop .sk-art-tt{font-size:.8125rem;margin:0}
.sk-art-ty{display:block;font-size:.6875rem;color:var(--sk-muted)}
.sk-art-pop li a:hover .sk-art-ty{color:#e9dfd0}
/* 相談の帯（中身は部2 の無料相談フォーム。フォームは自分の明るい面を持つ） */
.sk-art-consult{background:var(--sk-brand);color:var(--sk-ink-dk)}
.sk-art-consult>.sk-wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:2.5rem;align-items:start;padding-block:3rem}
.sk-art-consult h2{margin:.25rem 0 .75rem;font-family:var(--sk-serif);font-weight:600;font-size:1.375rem;line-height:1.45;color:var(--sk-champ)}
.sk-art-consult p{margin:0 0 .75rem;color:#eadfce;font-size:.875rem}
.sk-art-consult ul{margin:0;padding-left:1.25rem;list-style:disc;font-size:.8125rem;color:#eadfce}
.sk-art-formbox{min-width:0}
.sk-art-formbox .sk-form{margin:0;max-width:none}

@media (max-width:1100px){
  .sk-art-relgrid{grid-template-columns:1fr 1fr}
  .sk-art-block.sk-art-wide .sk-art-cards{grid-template-columns:1fr 1fr}
  .sk-art-pop ol{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sk-art-consult>.sk-wrap{grid-template-columns:1fr}
}
@media (max-width:700px){
  .sk-art-relgrid,.sk-art-block.sk-art-wide .sk-art-cards{grid-template-columns:1fr}
  .sk-art-pop ol{grid-template-columns:1fr}
  .sk-art nav.sk-art-pn{grid-template-columns:1fr}
  .sk-art-pn .sk-art-next{text-align:left}
  .sk-art-consult>.sk-wrap{padding-block:2.25rem}
  .sk-art-consult h2{font-size:1.1875rem}
  .sk-art .sk-art-member .wp__member_single button,.sk-art .sk-art-member .wp__member_single a{display:flex;width:100%;margin:.375rem 0}
}

@media (max-width:1100px){
  /* 文字が帯の右側まで並ぶ幅なので、覆いは右側も濃いめに */
  .sk-art-head.sk-art-has-mv::after{background:linear-gradient(90deg,rgba(30,20,15,.96) 0%,rgba(30,20,15,.9) 55%,rgba(42,26,18,.72) 100%)}
  .sk-art-head.sk-art-has-mv .sk-wrap>*{max-width:100%}
  .sk-art-grid{grid-template-columns:minmax(0,1fr)}
  .sk-art-side{position:static;display:none}
}
@media (max-width:700px){
  .sk-art-head{padding:.75rem 0 1rem}
  .sk-art-facts{display:grid;grid-template-columns:1fr 1fr}
  .sk-art-facts div,.sk-art-facts div+div{padding:.5rem .75rem .5rem 0;border-left:0}
  .sk-art-facts .sk-art-w{grid-column:1/-1}
  .sk-art-main{padding:1.25rem 1rem 1.75rem}
  .sk-art-prose{font-size:.875rem;line-height:1.75}
  .sk-art-prose h2{font-size:1.1875rem}
  .sk-art-prose h3{font-size:1rem}
  .sk-art-prose .wp_block_purpose_content,.sk-art-prose .wp_block_purpose_content.right{flex-direction:column;align-items:stretch}
  .sk-art-prose .wp_block_purpose_content--item.img{flex-basis:auto;width:100%;max-width:20rem}
  .sk-art-sec-h h2{font-size:1.25rem}
  .sk-art-news a{grid-template-columns:1fr;gap:.125rem}
}

/* 商品（53-6）：購入の札・表・ご購入の流れ・ご利用範囲・ご注意。試作 T4 の指定を本番の名前にしたもの */
.sk-art-buy{background:#fff;border:.0625rem solid var(--sk-line);border-top:.25rem solid var(--sk-gold);padding:1.25rem 1.25rem 1.5rem}
.sk-art-be{font-family:var(--sk-latin);letter-spacing:.24em;font-size:.6875rem;color:var(--sk-link)}
.sk-art-brow{padding:.75rem 0;border-bottom:.0625rem solid var(--sk-line)}
.sk-art-bnm{font-size:.8125rem;color:var(--sk-muted);line-height:1.5}
.sk-art-bpr{font-family:var(--sk-latin);font-size:1.5rem;color:var(--sk-brown);line-height:1.3}
.sk-art-bpr small{font-family:"Noto Sans JP",sans-serif;font-size:.75rem;color:var(--sk-muted);margin-left:.25rem}
.sk-art-bnote{font-size:.8125rem;color:var(--sk-muted)}
.sk-art-buy .sk-art-acts{display:grid;gap:.5rem;margin-top:.875rem}
.sk-art-brow .sk-art-acts{margin-top:.625rem}
.sk-art-buy .sk-btn{margin:0;min-height:3rem;width:100%;white-space:normal;text-align:center;line-height:1.4;padding:.5rem 1rem;flex-direction:column;gap:.125rem}
/* 2行のボタン：（請求書払い・後払い）は下の段に。不自然な折り返しをさせない */
.sk-art-buy .sk-btn small{display:block;font-size:.75rem;font-weight:400;white-space:nowrap}
.sk-art-bline{background:transparent;color:var(--sk-brown);border-color:var(--sk-brown)}
.sk-art-bline:hover{background:var(--sk-brown-dk);color:var(--sk-champ);border-color:var(--sk-brown-dk)}
/* 購入の行が多い商品（4行を超える）は、札が画面より高くなるので追いかけない */
.sk-art-side.sk-art-blong{position:static}
.sk-art-spec{display:grid;grid-template-columns:10rem 1fr;margin:1rem 0 1.5rem;border-top:.0625rem solid var(--sk-line);font-size:.875rem}
.sk-art-spec dt,.sk-art-spec dd{margin:0;padding:.5rem .6875rem;border-bottom:.0625rem solid var(--sk-line)}
.sk-art-spec dt{background:var(--sk-cream-2);font-weight:700;font-size:.8125rem}
.sk-art-spec dd p{margin:0}
.sk-art-flow{display:grid;gap:1.25rem}
.sk-art-st{display:grid;grid-template-columns:minmax(0,1fr) 15rem;gap:1.5rem;align-items:start}
.sk-art-st.sk-art-noimg{grid-template-columns:1fr}
/* 流れの画像は背景を透かした絵なので枠を付けない（2026-10-31、石塚さんのご指摘） */
.sk-art-st img{width:100%;height:auto}
.sk-art-use .sk-art-n{margin:-.5rem 0 .875rem 1em;font-size:.8125rem;color:var(--sk-muted)}
.sk-art-pnote{font-size:.875rem;color:var(--sk-muted)}
@media (max-width:1100px){
  /* 購入の札は本文の前に出す（目次は本文の頭の札で） */
  .sk-art-side.sk-art-is-buy{display:grid;order:-1}
  .sk-art-is-buy nav.sk-art-stoc{display:none}
}
@media (max-width:700px){
  .sk-art-spec{grid-template-columns:7rem 1fr}
  .sk-art-st{grid-template-columns:1fr}
  .sk-art-st img{max-width:16rem}
}