@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
*/

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

/** 記事本文内のマージンを調整 */
.content p {
margin-bottom: 1.4em;
line-height: 160%;	
 }

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
.blogcard-type .blogcard-label{
  background-color:#ff8c00;
}
	
	/*カテゴリーラベルの表示を消す*/
.cat-label{
	display:none;
}
}

/************************************
** カード・マトリックス デザイン（サーモンピンク×薄水色）
** 記事内カスタムHTML用（Claude追記 2026-07-11）
************************************/
.lead-wrap{max-width:660px;margin:1.4em auto;}
.lead-intro{font-size:.97em;color:#444;line-height:1.85;margin-bottom:1em;}
.lead-checklist{background:#eaf6fa;border-radius:14px;border-left:5px solid #9fd0e0;padding:1em 1.3em;margin-bottom:1em;}
.lead-checklist-title{font-size:.85em;color:#5b93a8;font-weight:bold;margin-bottom:.65em;letter-spacing:.05em;}
.lead-check-item{display:flex;align-items:center;gap:.7em;padding:.45em 0;border-bottom:1px solid #d9edf4;}
.lead-check-item:last-child{border-bottom:none;padding-bottom:0;}
.lead-check-icon{flex-shrink:0;width:24px;height:24px;background:#f0967f;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8em;font-weight:bold;}
.lead-check-text{font-size:.94em;color:#444;line-height:1.6;}
.lead-outro{font-size:.95em;color:#555;line-height:1.8;}
.cgm-def-card{max-width:660px;margin:1.6em auto;background:#fdf2ef;border-radius:14px;overflow:hidden;border-left:5px solid #f0967f;}
.cgm-def-header{background:#f0967f;color:#fff;font-weight:bold;font-size:1.05em;padding:.65em 1.2em;display:flex;align-items:center;gap:.5em;}
.cgm-def-body{padding:1.1em 1.4em;}
.cgm-def-lead{font-size:.97em;color:#555;line-height:1.9;margin:0;}
.cgm-def-lead em{font-style:normal;font-weight:bold;color:#c96a52;}
.cgm-def-note{display:inline-block;margin-top:.75em;background:#eaf6fa;border-radius:8px;padding:.45em .9em;font-size:.88em;color:#5b93a8;border-left:3px solid #9fd0e0;}
.cgm-steps-wrap{max-width:660px;margin:1.6em auto 1em;}
.cgm-step{display:flex;gap:1em;align-items:flex-start;margin-bottom:1em;background:#f4fafc;border-radius:14px;padding:1.1em 1.3em;border-left:5px solid #f0967f;}
.cgm-step-num{flex-shrink:0;width:48px;height:48px;background:#f0967f;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-weight:bold;line-height:1.1;}
.cgm-step-num span{font-size:9px;letter-spacing:1px;}
.cgm-step-num strong{font-size:19px;}
.cgm-step-body{flex:1;}
.cgm-step-title{font-weight:bold;font-size:1.03em;color:#c96a52;margin-bottom:.35em;}
.cgm-step-desc{font-size:.9em;color:#555;line-height:1.75;}
.cgm-arrow{text-align:center;color:#f0967f;font-size:1.3em;margin:-.3em 0 -.1em;}
.honest-card{max-width:660px;margin:1.6em auto;background:#fdf2ef;border-radius:14px;overflow:hidden;border-left:5px solid #f0967f;}
.honest-header{background:#f0967f;color:#fff;font-weight:bold;font-size:1.05em;padding:.65em 1.2em;display:flex;align-items:center;gap:.5em;}
.honest-body{padding:1.1em 1.4em;color:#555;font-size:.93em;line-height:1.85;}
.honest-body p{margin:.6em 0;}
.honest-body p:first-child{margin-top:0;}
.honest-body p:last-child{margin-bottom:0;}
.km-matrix table{border-collapse:collapse;font-size:.86em;line-height:1.6;}
.km-matrix th{background:#f0967f;color:#fff;border:1px solid #f7c2b4;padding:.6em .5em;text-align:center;}
.km-matrix td{border:1px solid #f2d9d1;padding:.7em .6em;vertical-align:top;color:#444;}
.km-matrix tbody tr:nth-child(odd) td{background:#f4fafc;}
.km-matrix tbody tr:nth-child(even) td{background:#fdf2ef;}
.km-matrix td:first-child{background:#eaf6fa !important;color:#5b93a8;font-weight:bold;white-space:nowrap;}
.km-matrix em{font-style:normal;font-size:.9em;color:#c96a52;display:block;margin-top:.35em;}

/* ブロックエディター（グループ/段落ブロック化）対応の微調整 */
.cgm-step-num{font-size:9px;letter-spacing:1px;}
.cgm-step-num strong{display:block;}
.cgm-def-lead + .cgm-def-lead{margin-top:.6em;}
p.cgm-def-header,p.cgm-def-note,p.lead-checklist-title,p.lead-check-icon,p.lead-check-text,p.cgm-step-title,p.cgm-step-desc,p.cgm-step-num,p.honest-header,p.cgm-arrow{margin-bottom:0;}
.wp-block-group.lead-wrap,.wp-block-group.cgm-def-card,.wp-block-group.cgm-steps-wrap,.wp-block-group.honest-card{margin-left:auto;margin-right:auto;}

/* グループブロックの余白リセット（間延び対策） */
.lead-wrap .wp-block-group,.cgm-def-card .wp-block-group,.cgm-steps-wrap .wp-block-group,.honest-card .wp-block-group{margin-top:0;margin-bottom:0;}
.lead-wrap .lead-checklist{margin-bottom:1em;}
.cgm-steps-wrap .wp-block-group.cgm-step{margin-bottom:1em;}
.wp-block-group.lead-wrap{margin:1.4em auto;}
.wp-block-group.cgm-def-card,.wp-block-group.honest-card{margin:1.6em auto;}
.wp-block-group.cgm-steps-wrap{margin:1.6em auto 1em;}

/* エディター内でもカード内の余白を正しく表示（詳細度ブースト） */
.lead-wrap p.lead-intro{margin:0 0 1em;}
.lead-wrap p.lead-outro{margin:0;}
.lead-checklist p.lead-checklist-title{margin:0 0 .65em;}
.lead-check-item p.lead-check-icon{margin:0;width:24px;height:24px;}
.lead-check-item p.lead-check-text{margin:0;}
.cgm-def-card p.cgm-def-header{margin:0;}
.cgm-def-body p.cgm-def-lead{margin:0;}
.cgm-def-body p.cgm-def-lead + p.cgm-def-lead{margin-top:.6em;}
.cgm-def-body p.cgm-def-note{margin:.75em 0 0;}
.cgm-step p.cgm-step-num{margin:0;}
.cgm-step-body p.cgm-step-title{margin:0 0 .35em;}
.cgm-step-body p.cgm-step-desc{margin:0;}
.cgm-steps-wrap p.cgm-arrow{margin:-.3em 0 -.1em;}
.honest-card p.honest-header{margin:0;}
.honest-card .honest-body p{margin:.6em 0;}
.honest-card .honest-body p:first-child{margin-top:0;}
.honest-card .honest-body p:last-child{margin-bottom:0;}

/* マトリックス左上セル：斜線区切り（タイプ＼ポロシティ） */
.km-matrix thead th:first-child{position:relative;font-size:0;line-height:0;min-width:7.5em;background-image:linear-gradient(to bottom left,transparent calc(50% - 1px),rgba(255,255,255,.9) calc(50% - 1px),rgba(255,255,255,.9) calc(50% + 1px),transparent calc(50% + 1px));}
.km-matrix thead th:first-child::before{content:"ポロシティ";position:absolute;top:.5em;right:.6em;color:#fff;font-size:12px;line-height:1.2;font-weight:bold;}
.km-matrix thead th:first-child::after{content:"タイプ";position:absolute;bottom:.5em;left:.6em;color:#fff;font-size:12px;line-height:1.2;font-weight:bold;}

.km-matrix thead th:first-child{height:56px;}

/* ヘアタイプ分類カード（2A〜4C） */
.type-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:660px;margin:1.4em auto;}
.type-cards .wp-block-group{margin:0;}
.type-card{background:#f4fafc;border-radius:14px;overflow:hidden;border-top:4px solid #f0967f;}
.type-card p.type-card-header{background:#f0967f;color:#fff;font-weight:bold;text-align:center;padding:.5em .3em;font-size:.95em;margin:0;}
.type-card p.type-card-sub{text-align:center;background:#fdf2ef;color:#c96a52;font-size:.8em;padding:.35em .3em;margin:0;}
.type-card p.type-row{padding:.55em .8em;border-bottom:1px dashed #f2d9d1;font-size:.87em;color:#555;line-height:1.6;margin:0;}
.type-card p.type-row:last-child{border-bottom:none;}
.type-card p.type-row strong{color:#c96a52;margin-right:.35em;}
@media screen and (max-width:600px){.type-cards{grid-template-columns:1fr;}}