@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/* ===== ノウハウノート LP用（.kn-lp）2026-09-21 ===== */
.kn-lp{font-size:17px;line-height:1.95;color:#222;letter-spacing:.02em}
.kn-lp p{margin:0 0 1.5em}
.kn-lp h2{font-size:1.32em;line-height:1.5;margin:2.8em 0 1.1em;padding:.7em .9em;background:#f3f6fa;border-left:5px solid #1f4e79;border-radius:2px}
.kn-lp h3{font-size:1.12em;margin:2em 0 .8em;padding-bottom:.35em;border-bottom:2px solid #d5dde6}
.kn-lp strong{background:linear-gradient(transparent 62%,#ffe97a 62%);font-weight:700}
.kn-lp .kn-list{margin:0 0 1.6em;padding:1em 1em 1em 2em;background:#fafbfc;border:1px solid #e3e8ee;border-radius:6px}
.kn-lp .kn-list li{margin:.35em 0}
.kn-lp .kn-note{font-size:.88em;color:#555}
.kn-lp .kn-template{margin:1.2em 0 1.8em;padding:1.1em 1.2em;background:#fffdf3;border:1px dashed #c9b458;border-radius:6px;font-size:.95em;line-height:1.8}
.kn-lp .kn-template::before{content:none}
.kn-lp .kn-cta{margin:2.4em 0;text-align:center}
.kn-lp .kn-btn{display:block;max-width:560px;margin:0 auto;padding:1.05em 1.1em;background:#e8590c;color:#fff!important;font-weight:700;font-size:1.02em;line-height:1.55;text-decoration:none;border-radius:8px;box-shadow:0 4px 0 #a93f06;transition:transform .08s,box-shadow .08s}
.kn-lp .kn-btn:hover{transform:translateY(2px);box-shadow:0 2px 0 #a93f06;color:#fff}
.kn-lp .kn-btn--pending{background:#9aa5b1;box-shadow:0 4px 0 #6b7682;cursor:default}
.kn-lp .kn-foot{margin:4em 0 1em;padding-top:1.4em;border-top:1px solid #e3e8ee;font-size:.8em;color:#888;text-align:center;line-height:2.2}
.kn-lp .kn-foot a{color:#667;margin:0 .7em;text-decoration:underline;white-space:nowrap}
.kn-lp .kn-foot span{display:block}
.kn-lp .kn-fig{margin:1.8em 0 2.2em}
.kn-lp .kn-fig img{display:block;width:100%;height:auto;border:1px solid #e3e8ee;border-radius:8px}
.kn-lp .kn-jump{color:#1f4e79;font-weight:700;text-decoration:underline}
html{scroll-behavior:smooth}
.kn-lp .kn-cta-note{display:block;margin-top:.7em;font-size:.82em;color:#777}
@media (max-width:480px){.kn-lp{font-size:16px}.kn-lp h2{font-size:1.2em;margin-top:2.4em}}
.kn-lp .kn-refs{font-size:11px;line-height:1.6;color:#999;margin-top:2.5em}
.kn-lp .kn-btn-sub{display:block;margin-top:.45em;font-size:.78em;font-weight:600;opacity:.92;white-space:nowrap;letter-spacing:-.01em}
/* 2026-09-22 ヘッダー背景をノート風に: 画像は左端基準・高さ合わせで描き、スマホでも赤線と綴じ穴が見えるようにする */
#header{background-position:center top!important;background-size:auto 100%!important;background-repeat:repeat-x!important}
/* 2026-09-22 記事内の表 */
.kn-lp .kn-table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:.95em}
.kn-lp .kn-table th,.kn-lp .kn-table td{border:1px solid #d9dfe6;padding:.6em .7em;text-align:left;vertical-align:top}
.kn-lp .kn-table th{background:#f3f6f9;font-weight:700}
/* ==== 2026-09-22 note風レイアウト（あらいさん指示「他記事への動線と、見た目のスッキリ感」「noteに近く」） ==== */
body{background:#fff}
.main{border:0;box-shadow:none;background:#fff;padding:0 16px}
.wrap{margin-top:0}
/* 本文の幅と読みやすさ（noteは本文約620px・16〜17px・行間1.9） */
.article{font-size:17px;line-height:1.95;letter-spacing:.02em;color:#222}
.article p{margin-bottom:1.6em}
.entry-title,.article h1.entry-title{font-size:30px;font-weight:800;line-height:1.55;letter-spacing:.01em;margin:16px 0 14px}
.pr-label{font-size:11px;padding:2px 8px;border-color:#ccd}
/* メタ行を細く1行に（日付・著者） */
.article-header .post-date,.article-header .post-update,.article-header .author-info{font-size:13px;color:#8a949e}
.entry-categories-tags{margin-top:2em}
.cat-label{border:0;background:#f3f5f7;border-radius:999px;padding:2px 12px;font-size:12px}
.tag-link{border:0;background:#f3f5f7;border-radius:999px;font-size:12px}
/* アイキャッチは角丸で少し引く */
.eye-catch img,.eye-catch .eye-catch-image{border-radius:8px}
/* シェアは本文下だけ・小さく丸く */
.sns-share{margin:2.5em 0}
.sns-share-message{font-size:13px;color:#8a949e}
.sns-share-buttons a{border-radius:999px;height:40px;font-size:13px}
/* 関連記事＝「同じテーマの記事」を枠なしカードで */
.related-entry-heading{font-size:18px;font-weight:800;border:0;background:none;padding:0;margin:3em 0 1em}
.related-entry-card-wrap{border:0;box-shadow:none}
.related-entry-card-thumb img{border-radius:8px}
.related-entry-card-title{font-weight:700;line-height:1.5}
/* 前後記事ナビは薄く */
.prev-next-heading{font-size:14px;color:#8a949e;border:0;background:none;padding:0}
.post-navi{border:0}
/* 一覧（トップ）：note風のリスト＝枠なし・区切り線・余白 */
.entry-card-wrap{border:0;border-bottom:1px solid #eef0f2;border-radius:0;padding:22px 0;margin:0}
.entry-card-wrap:hover{background:none}
.entry-card-thumb img{border-radius:8px}
.entry-card-title{font-size:20px;font-weight:800;line-height:1.5;margin-bottom:8px}
.entry-card-snippet{font-size:14px;color:#6b7580;line-height:1.7}
.entry-card-meta{font-size:12px;color:#8a949e}
/* ヘッダーを少し薄く */
#header .header-container{padding-top:12px;padding-bottom:12px}
/* LP部品の余白を本文に合わせる */
.kn-lp .kn-cta{margin:2.2em 0}
@media screen and (max-width:640px){
  .main{padding:0 14px}
  .article{font-size:16.5px}
  .entry-title,.article h1.entry-title{font-size:24px}
  .entry-card-title{font-size:17px}
}
/* 2026-09-22 note風・追加調整 */
.wrap{max-width:900px;margin:0 auto}
.main>.pr-label,.article .pr-label{position:static!important;display:inline-block;margin:14px 0 0}
.eye-catch .cat-label,.entry-card-thumb .cat-label,.related-entry-card-thumb .cat-label{display:none}
.toc{border:0;background:#f7f8fa;border-radius:10px;padding:18px 22px;width:100%;margin:2em 0}
.toc-title{text-align:left;font-size:14px;color:#8a949e;font-weight:700}
.toc-title::before{display:none}
.toc-content{font-size:15px}
.toc-content>ol>li{margin:6px 0}
.entry-card-title{font-size:18px}
.entry-card-content{font-size:14px}
/* 2026-09-23 記事タイトルの改行位置（あらいさん指摘「読みにくいので改行を入れてほしい」）: 語の途中で折らず、句読点・？・空白で折る */
.entry-title,.article h1.entry-title{overflow-wrap:anywhere}
/* 2026-09-23 番号付きリスト（手順・チェック項目）: 項目ごとに余白とインデント */
.kn-lp ol.kn-steps{margin:1.2em 0 1.6em;padding-left:1.6em}
.kn-lp ol.kn-steps li{margin:0 0 .9em;padding-left:.3em;line-height:1.85}
.kn-lp ol.kn-steps li strong{display:table;margin-bottom:.15em}
.kn-lp ul.kn-list li{margin:0 0 .6em}
