/* ============================================================
   美容師免許ワーク コラム 専用CSS
   （共有 /assets/css/style.css の上に重ねる。BEM風 bmw-* 名前空間）
   ブランド色: #f7988c / hover #ef8276 / light #fdeeec
   ============================================================ */

.l-container--narrow{ max-width: 820px; margin: 0 auto; }

/* パンくずは共有 style.css に委譲（重複::before除去済み） */

/* ---- アーカイブ見出し ---- */
.bmw-archive{ padding: 1rem 0 4rem; }
.bmw-archive__head{ text-align:center; margin: 1rem 0 2.4rem; }
.bmw-archive__title{ font-size: 1.8rem; font-weight: 800; color:#333; margin:0 0 .6rem; }
.bmw-archive__lead{ font-size:.92rem; color:#777; line-height:1.8; margin:0; }

/* ---- カードグリッド（PC 3列 × 5行 = 15件）---- */
.bmw-cards{
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.6rem;
}
.bmw-card{
	background:#fff;
	border:1px solid #f1e8e6;
	border-radius: .9rem;
	overflow:hidden;
	transition: box-shadow .2s, transform .2s;
}
.bmw-card:hover{ box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-2px); }
.bmw-card__link{ display:block; text-decoration:none; color:inherit; }
.bmw-card__thumb{ position:relative; width:100%; aspect-ratio: 4 / 3; overflow:hidden; background:#fdf5f4; }
.bmw-card__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.bmw-card__body{ padding: 1rem 1.1rem 1.2rem; }
.bmw-card__cat{
	display:inline-block; font-size:.72rem; font-weight:700; color:#ef8276;
	background:#fdeeec; padding:.2rem .6rem; border-radius: 1rem; margin-bottom:.5rem;
}
.bmw-card__title{
	font-size: 1rem; font-weight:700; color:#333; line-height:1.5; margin:0 0 .6rem;
	display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.bmw-card__date{ font-size:.78rem; color:#aaa; }

/* ---- ページネーション ---- */
.bmw-pager{ margin: 3rem 0 0; }
.bmw-pager .page-numbers{
	list-style:none; display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
	gap:.5rem; margin:0; padding:0;
}
.bmw-pager .page-numbers li{ margin:0; }
.bmw-pager .page-numbers a,
.bmw-pager .page-numbers span{
	display:inline-flex; align-items:center; justify-content:center;
	min-width: 2.6rem; height: 2.6rem; padding:0 .8rem;
	border:1px solid #f0e0dd; border-radius:.5rem; background:#fff;
	color:#666; font-size:.9rem; text-decoration:none; transition: all .15s;
}
.bmw-pager .page-numbers a:hover{ border-color:#f7988c; color:#ef8276; background:#fdeeec; }
.bmw-pager .page-numbers .current{ background:#f7988c; border-color:#f7988c; color:#fff; font-weight:700; }
.bmw-pager .page-numbers .dots{ border:none; background:transparent; }

.bmw-empty{ text-align:center; color:#999; padding: 3rem 0; }

/* ---- シングル記事 ---- */
.bmw-single{ padding: 1rem 0 4rem; }
.bmw-article__head{ margin: 1rem 0 1.8rem; }
.bmw-article__cats{ display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:.8rem; }
.bmw-article__cat{
	display:inline-block; font-size:.76rem; font-weight:700; color:#ef8276;
	background:#fdeeec; padding:.25rem .7rem; border-radius:1rem; text-decoration:none;
}
.bmw-article__cat:hover{ background:#f7988c; color:#fff; }
.bmw-article__title{ font-size: 1.7rem; font-weight:800; color:#222; line-height:1.5; margin:0 0 1rem; }
.bmw-article__meta{ display:flex; align-items:center; gap:1rem; color:#aaa; font-size:.85rem; }
.bmw-article__date i{ color:#f7988c; margin-right:.2rem; }

.bmw-article__eyecatch{ margin: 1.5rem 0 2rem; border-radius:.9rem; overflow:hidden; }
.bmw-article__eyecatch img{ width:100%; height:auto; display:block; }

/* 本文 */
.bmw-article__body{ font-size: 1rem; line-height: 2; color:#444; }
.bmw-article__body h2{ font-size:1.4rem; font-weight:800; color:#333; margin:2.4rem 0 1rem; padding:.6rem 0 .6rem 1rem; border-left:5px solid #f7988c; background:#fdf5f4; }
.bmw-article__body h3{ font-size:1.15rem; font-weight:700; color:#333; margin:2rem 0 .8rem; padding-bottom:.4rem; border-bottom:2px solid #fdeeec; }
.bmw-article__body p{ margin:0 0 1.4rem; }
.bmw-article__body a{ color:#ef8276; text-decoration:underline; }
.bmw-article__body ul,
.bmw-article__body ol{ margin:0 0 1.4rem 1.4rem; }
.bmw-article__body li{ margin:0 0 .5rem; }
.bmw-article__body img{ max-width:100%; height:auto; border-radius:.5rem; }
.bmw-article__body blockquote{ margin:1.4rem 0; padding:1rem 1.2rem; background:#faf6f5; border-left:4px solid #f7988c; color:#666; }

/* タグ */
.bmw-article__tags{ display:flex; flex-wrap:wrap; gap:.6rem; margin: 2.4rem 0 0; padding-top:1.6rem; border-top:1px solid #f1e8e6; }
.bmw-article__tag{
	display:inline-block; font-size:.82rem; color:#888; background:#f6f6f6;
	padding:.3rem .8rem; border-radius:1rem; text-decoration:none; transition: all .15s;
}
.bmw-article__tag:hover{ background:#fdeeec; color:#ef8276; }

/* 戻るボタン */
.bmw-article__back{ text-align:center; margin: 3rem 0 0; }
.bmw-article__back-btn{
	display:inline-flex; align-items:center; justify-content:center;
	min-width: 16rem; height: 3.4rem; padding:0 1.6rem;
	background:#f7988c; color:#fff; font-weight:700; text-decoration:none;
	border-radius: 1.7rem; transition: background .15s;
}
.bmw-article__back-btn:hover{ background:#ef8276; }

/* ---- レスポンシブ ---- */
@media (max-width: 900px){
	.bmw-cards{ grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
}
@media (max-width: 600px){
	.bmw-cards{ grid-template-columns: 1fr; }
	.bmw-archive__title{ font-size: 1.5rem; }
	.bmw-article__title{ font-size: 1.4rem; }
	.bmw-article__back-btn{ width:100%; min-width:0; }
}

/* ============================================================
   記事内データデザイン要素 v2（自動投稿で使用・11種類）
   コーラル/ピンク系ブランド統一
   color: コーラル#d85a30 / ピンク#f7988c / light#fdeeec / 補助#993c1d
   ============================================================ */

/* 共通の見出し */
.bmw-c-title{ font-size:1.05rem; font-weight:700; color:#333; margin:0 0 1.1rem; }

/* ① 数字カード（横並び3つ） */
.bmw-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:2rem 0; }
.bmw-stat{ background:#fdf5f4; border:1px solid #f3e3e0; border-radius:.9rem; padding:1.2rem 1rem; text-align:center; display:flex; flex-direction:column; justify-content:space-between; }
.bmw-stat__label{ font-size:.8rem; color:#888; margin:0 0 .7rem; display:flex; align-items:center; justify-content:center; min-height:2.6em; line-height:1.4; }
.bmw-stat__num{ font-size:2rem; font-weight:800; color:#d85a30; margin:0 auto; line-height:1.2; display:block; }
.bmw-stat__num .bmw-stat__unit{ font-size:1rem; font-weight:700; margin-left:.1rem; }
@media(max-width:600px){ .bmw-stats{ grid-template-columns:1fr 1fr; gap:10px; } }

/* ② 横棒グラフ */
.bmw-bars{ background:#fff; border:1px solid #f1e8e6; border-radius:.9rem; padding:1.4rem 1.5rem; margin:2rem 0; }
.bmw-bars__title{ font-size:1.05rem; font-weight:700; color:#333; margin:0 0 1.1rem; }
.bmw-bars__list{ display:flex; flex-direction:column; gap:.9rem; margin:0; padding:0; list-style:none; }
.bmw-bars__item{ margin:0; }
.bmw-bars__head{ display:flex; justify-content:space-between; align-items:baseline; font-size:.9rem; margin-bottom:.35rem; }
.bmw-bars__label{ color:#555; }
.bmw-bars__value{ font-weight:700; color:#d85a30; }
.bmw-bars__track{ background:#f3e3e0; border-radius:999px; height:11px; overflow:hidden; }
.bmw-bars__fill{ height:100%; background:#f7988c; border-radius:999px; }

/* ③ ステップ（手順） */
.bmw-steps{ background:#fff; border:1px solid #f1e8e6; border-radius:.9rem; padding:1.4rem 1.5rem; margin:2rem 0; }
.bmw-steps__title{ font-size:1.05rem; font-weight:700; color:#333; margin:0 0 1.1rem; }
.bmw-steps__list{ display:flex; flex-direction:column; gap:1.1rem; margin:0; padding:0; list-style:none; counter-reset:bmwstep; }
.bmw-steps__item{ display:flex; gap:.9rem; align-items:flex-start; margin:0; }
.bmw-steps__num{ counter-increment:bmwstep; flex-shrink:0; width:30px; height:30px; border-radius:50%; background:#fdeeec; color:#993c1d; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.95rem; }
.bmw-steps__num::before{ content:counter(bmwstep); }
.bmw-steps__body{ flex:1; }
.bmw-steps__head{ font-size:.98rem; font-weight:700; color:#333; margin:0 0 .2rem; }
.bmw-steps__desc{ font-size:.88rem; color:#777; margin:0; line-height:1.7; }

/* ④ 大数字強調ブロック（1つの数字を大きく見せる） */
.bmw-bignum{ background:linear-gradient(135deg,#fdeeec,#fdf5f4); border-radius:1rem; padding:2rem 1.5rem; margin:2rem 0; text-align:center; }
.bmw-bignum__label{ font-size:.95rem; color:#993c1d; font-weight:700; margin:0 0 .6rem; }
.bmw-bignum__num{ font-size:3.4rem; font-weight:800; color:#d85a30; line-height:1; margin:0; }
.bmw-bignum__num .bmw-bignum__unit{ font-size:1.6rem; margin-left:.2rem; }
.bmw-bignum__note{ font-size:.85rem; color:#888; margin:.8rem 0 0; }

/* ⑤ 比較表（2項目を左右で比較） */
.bmw-compare{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:2rem 0; }
.bmw-compare__col{ border-radius:.9rem; padding:1.3rem 1.2rem; }
.bmw-compare__col--a{ background:#fdf5f4; border:1px solid #f3c9c0; }
.bmw-compare__col--b{ background:#f6f8f8; border:1px solid #e2e8e8; }
.bmw-compare__head{ font-size:1rem; font-weight:800; margin:0 0 .9rem; padding-bottom:.6rem; border-bottom:2px solid rgba(0,0,0,.06); }
.bmw-compare__col--a .bmw-compare__head{ color:#d85a30; }
.bmw-compare__col--b .bmw-compare__head{ color:#4a7a72; }
.bmw-compare__list{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:.6rem; }
.bmw-compare__list li{ font-size:.9rem; color:#555; line-height:1.6; padding-left:1.2rem; position:relative; }
.bmw-compare__list li::before{ content:"・"; position:absolute; left:0; color:#bbb; }
@media(max-width:600px){ .bmw-compare{ grid-template-columns:1fr; } }

/* ⑥ チェックリスト（✓付き） */
.bmw-check{ background:#fff; border:1px solid #f1e8e6; border-radius:.9rem; padding:1.4rem 1.5rem; margin:2rem 0; }
.bmw-check__title{ font-size:1.05rem; font-weight:700; color:#333; margin:0 0 1rem; }
.bmw-check__list{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:.7rem; }
.bmw-check__list li{ display:flex; gap:.7rem; align-items:flex-start; font-size:.92rem; color:#555; line-height:1.6; }
.bmw-check__list li::before{ content:"✓"; flex-shrink:0; width:22px; height:22px; border-radius:50%; background:#f7988c; color:#fff; font-size:.8rem; font-weight:700; display:flex; align-items:center; justify-content:center; margin-top:.05rem; }

/* ⑦ ポイントボックス（重要強調・左ボーダー） */
.bmw-point{ background:#fdf5f4; border-left:5px solid #f7988c; border-radius:.5rem; padding:1.2rem 1.4rem; margin:2rem 0; }
.bmw-point__title{ font-size:.98rem; font-weight:800; color:#d85a30; margin:0 0 .5rem; display:flex; align-items:center; gap:.4rem; }
.bmw-point__title::before{ content:"!"; width:20px; height:20px; border-radius:50%; background:#f7988c; color:#fff; font-size:.8rem; display:inline-flex; align-items:center; justify-content:center; }
.bmw-point__body{ font-size:.92rem; color:#555; line-height:1.8; margin:0; }

/* ⑧ メリット/デメリット2カラム */
.bmw-procon{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:2rem 0; }
.bmw-procon__col{ border-radius:.9rem; padding:1.3rem 1.2rem; }
.bmw-procon__col--pro{ background:#fdf3f1; border:1px solid #f3c9c0; }
.bmw-procon__col--con{ background:#f5f6f7; border:1px solid #e0e3e6; }
.bmw-procon__head{ font-size:.98rem; font-weight:800; margin:0 0 .8rem; display:flex; align-items:center; gap:.4rem; }
.bmw-procon__col--pro .bmw-procon__head{ color:#d85a30; }
.bmw-procon__col--con .bmw-procon__head{ color:#777; }
.bmw-procon__list{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:.5rem; }
.bmw-procon__list li{ font-size:.88rem; color:#555; line-height:1.6; padding-left:1.1rem; position:relative; }
.bmw-procon__col--pro .bmw-procon__list li::before{ content:"○"; position:absolute; left:0; color:#f7988c; font-size:.8rem; }
.bmw-procon__col--con .bmw-procon__list li::before{ content:"△"; position:absolute; left:0; color:#aaa; font-size:.8rem; }
@media(max-width:600px){ .bmw-procon{ grid-template-columns:1fr; } }

/* ⑨ Q&Aボックス */
.bmw-qa{ margin:2rem 0; display:flex; flex-direction:column; gap:.9rem; }
.bmw-qa__item{ background:#fff; border:1px solid #f1e8e6; border-radius:.8rem; overflow:hidden; }
.bmw-qa__q{ display:flex; gap:.7rem; align-items:flex-start; padding:1rem 1.2rem; font-weight:700; color:#333; font-size:.95rem; background:#fdf5f4; }
.bmw-qa__q::before{ content:"Q"; flex-shrink:0; width:24px; height:24px; border-radius:50%; background:#d85a30; color:#fff; font-size:.85rem; display:flex; align-items:center; justify-content:center; }
.bmw-qa__a{ display:flex; gap:.7rem; align-items:flex-start; padding:1rem 1.2rem; font-size:.9rem; color:#555; line-height:1.8; }
.bmw-qa__a::before{ content:"A"; flex-shrink:0; width:24px; height:24px; border-radius:50%; background:#f7988c; color:#fff; font-size:.85rem; display:flex; align-items:center; justify-content:center; }

/* ⑩ 体験談・引用ボックス */
.bmw-voice{ background:#faf6f5; border-radius:1rem; padding:1.5rem 1.6rem; margin:2rem 0; position:relative; }
.bmw-voice__mark{ font-size:2.4rem; color:#f3c9c0; line-height:1; font-weight:800; }
.bmw-voice__text{ font-size:.95rem; color:#555; line-height:1.9; margin:.3rem 0 .8rem; font-style:normal; }
.bmw-voice__name{ font-size:.82rem; color:#999; text-align:right; margin:0; }

/* ⑪ 注意・補足ボックス */
.bmw-note{ background:#fffaf0; border:1px solid #f0e0b0; border-radius:.7rem; padding:1.1rem 1.3rem; margin:2rem 0; }
.bmw-note__title{ font-size:.92rem; font-weight:700; color:#b8860b; margin:0 0 .4rem; }
.bmw-note__body{ font-size:.88rem; color:#776; line-height:1.8; margin:0; }