/*
Theme Name: Astra Child (ニキビ薬ガイド)
Theme URI: https://nikibilab.com/acne-medicine/
Description: ニキビ薬ガイド by ニキビ研究所 専用の Astra 子テーマ
Author: 株式会社エプリ
Template: astra
Version: 1.7.9
Text Domain: astra-child-acnemed
*/

:root{
  --am-primary:#2E8B84;      /* ブルーグリーン（清潔感） */
  --am-primary-dark:#246E68;
  --am-accent:#E4813E;       /* CTA用アクセント */
  --am-bg:#FFFFFF;
  --am-bg-soft:#F5F8F8;
  --am-text:#333333;
  --am-text-sub:#666666;
  --am-border:#E3E9E9;
  --am-radius:10px;
}

body{ color:var(--am-text); }

/* --- CTA（mu-plugin から出力） --- */
.am-cta{
  background:var(--am-bg-soft);
  border:1px solid var(--am-border);
  border-left:5px solid var(--am-primary);
  border-radius:var(--am-radius);
  padding:22px 24px;
  margin:40px 0 24px;
}
.am-cta__title{
  font-size:19px; font-weight:700; line-height:1.5;
  color:var(--am-primary-dark); margin:0 0 10px;
}
.am-cta__body{ font-size:15px; line-height:1.8; margin:0 0 16px; }
.am-cta__btn{
  display:inline-block; background:var(--am-primary); color:#fff !important;
  font-weight:700; text-decoration:none !important;
  padding:13px 26px; border-radius:6px; font-size:16px;
}
.am-cta__btn:hover{ background:var(--am-primary-dark); }
.am-cta__note{ font-size:11.5px; color:var(--am-text-sub); margin:12px 0 0; line-height:1.6; }

/* --- PR表記（ステマ規制） --- */
.am-pr{
  background:#FBFBFA; border-bottom:1px solid var(--am-border);
  font-size:11.5px; color:var(--am-text-sub);
  padding:7px 16px; text-align:center; line-height:1.5;
}

/* --- 打消し・注記は11.5px以上（景表法） --- */
.am-note{ font-size:11.5px; color:var(--am-text-sub); line-height:1.6; }

/* --- モバイル基準（流入の約9割がスマホ） --- */
@media (max-width:600px){
  .am-cta{ padding:18px 16px; margin:32px 0 20px; }
  .am-cta__title{ font-size:17px; }
  .am-cta__body{ font-size:14.5px; }
  .am-cta__btn{ display:block; text-align:center; padding:14px 18px; }
}

/* =============================================
   記事見出しスタイル（v1.1.0 / 2026-08-28）
   白×ブルーグリーンのデザインシステム準拠
   ============================================= */

/* --- H2: 左アクセント＋淡色背景の帯 --- */
.entry-content h2{
  position:relative;
  background:var(--am-bg-soft);
  border-left:6px solid var(--am-primary);
  border-radius:0 var(--am-radius) var(--am-radius) 0;
  padding:14px 18px;
  margin:48px 0 22px;
  font-size:24px;
  line-height:1.5;
  color:var(--am-text);
}

/* --- H3: 下線＋アクセントセグメント --- */
.entry-content h3{
  position:relative;
  border-bottom:2px solid var(--am-border);
  padding:0 2px 10px;
  margin:38px 0 18px;
  font-size:20px;
  line-height:1.5;
  color:var(--am-text);
}
.entry-content h3::after{
  content:"";
  position:absolute;
  left:0; bottom:-2px;
  width:72px; height:2px;
  background:var(--am-primary);
}

/* --- H4: 小バー付き（商品名などの小見出し） --- */
.entry-content h4{
  position:relative;
  padding-left:14px;
  margin:28px 0 12px;
  font-size:17px;
  line-height:1.5;
  color:var(--am-primary-dark);
}
.entry-content h4::before{
  content:"";
  position:absolute;
  left:0; top:0.28em;
  width:5px; height:1em;
  border-radius:3px;
  background:var(--am-primary);
}

/* --- FAQのQ見出し（h3のQ番号を強調） --- */
.entry-content h3 .am-q{ color:var(--am-primary-dark); }

/* --- 見出し直下の画像・表との間隔調整 --- */
.entry-content h2 + .wp-block-image{ margin-top:18px; }

/* --- モバイル（流入の約9割がスマホ想定） --- */
@media (max-width:600px){
  .entry-content h2{ font-size:20px; padding:12px 14px; margin:38px 0 18px; }
  .entry-content h3{ font-size:17.5px; margin:30px 0 14px; }
  .entry-content h4{ font-size:16px; margin:24px 0 10px; }
}
@media (max-width:380px){
  .entry-content h2{ font-size:19px; }
  .entry-content h3{ font-size:17px; }
}

/* =============================================
   サイドバー（v1.1.1 / 2026-08-28）
   ============================================= */
.widget-area h2{
  font-size:16px;
  border-left:4px solid var(--am-primary);
  padding:2px 0 2px 10px;
  margin:0 0 14px;
  color:var(--am-text);
}
.widget-area .widget{ margin-bottom:32px; }
.widget-area .am-side-card{
  background:var(--am-bg-soft);
  border:1px solid var(--am-border);
  border-radius:var(--am-radius);
  padding:14px 16px;
  font-size:13.5px;
  line-height:1.8;
}
.widget-area .wp-block-latest-posts li,
.widget-area .wp-block-categories li{
  font-size:14px;
  margin-bottom:10px;
  line-height:1.6;
}
.widget-area a{ color:var(--am-primary-dark); }

/* =============================================
   見出しサイズ最適化（v1.1.2 / 2026-08-28）
   デスクトップ: H1 32(Astra既定) > H2 24 > H3 20 > H4 17
   以下は画面幅ごとの統一スケール（ファイル後方=優先のため
   ここが最終値。前方の同名メディア規則より優先される）
   ============================================= */

/* タブレット・小型PC */
@media (max-width:921px){
  .ast-single-post header.entry-header .entry-title{ font-size:26px; line-height:1.45; }
  .entry-content h2{ font-size:22px; padding:13px 16px; }
  .entry-content h3{ font-size:19px; }
  .entry-content h4{ font-size:16.5px; }
}

/* スマートフォン（流入の約9割） */
@media (max-width:600px){
  .ast-single-post header.entry-header .entry-title{ font-size:23px; line-height:1.5; }
  .entry-content h2{ font-size:20px; padding:12px 14px; margin:38px 0 18px; }
  .entry-content h3{ font-size:17.5px; margin:30px 0 14px; }
  .entry-content h4{ font-size:16px; margin:24px 0 10px; }
}

/* 小型スマートフォン */
@media (max-width:380px){
  .ast-single-post header.entry-header .entry-title{ font-size:21px; }
  .entry-content h2{ font-size:19px; }
  .entry-content h3{ font-size:17px; }
  .entry-content h4{ font-size:15.5px; }
}


/* =============================================
   タイポグラフィ（v1.3.0 / 2026-08-28）
   本文=Noto Sans JP／見出し=Zen Kaku Gothic New
   ============================================= */
body, button, input, select, textarea{
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
}
h1,h2,h3,h4,h5,.site-title,.main-header-menu{
  font-family:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;
}

/* =============================================
   トップページ（固定ページ front-page）v1.3.0
   ============================================= */
.am-top-hero{
  background:linear-gradient(135deg,var(--am-primary) 0%,var(--am-primary-dark) 100%);
  padding:64px 24px 56px; text-align:center;
}
.am-top-hero__title{
  color:#fff !important; font-size:30px; font-weight:800; line-height:1.5;
  letter-spacing:.02em; margin:0 auto 18px; max-width:760px;
}
.am-top-hero__title em{ font-style:normal; color:#FFD9B8; }
.am-top-hero__lead{
  color:#fff; opacity:.92; font-size:15px; line-height:1.9;
  max-width:640px; margin:0 auto 28px;
}
.am-top-btns{ justify-content:center; gap:14px; }
.am-top-btns .wp-block-button__link{
  border-radius:999px; font-weight:700; font-size:15px; padding:13px 28px;
}
.am-top-btns .am-btn-a .wp-block-button__link{ background:#fff; color:var(--am-primary-dark); }
.am-top-btns .am-btn-b .wp-block-button__link{ background:var(--am-accent); color:#fff; }

/* セクション共通 */
.am-top-sec{ padding:48px 0 8px; }
.am-top-lead{ color:var(--am-text-sub); font-size:14px; margin:-6px 0 24px; }

/* 状況ナビ: 主役カード1枚＋3カード（非対称） */
.am-top-card--main{
  background:#fff; border:1px solid var(--am-border);
  border-left:6px solid var(--am-accent); border-radius:12px;
  padding:24px 26px; margin-bottom:16px;
  box-shadow:0 4px 16px -10px rgba(0,0,0,.12);
}
.am-top-card--main .am-top-card__t{ font-size:18px; }
.am-top-card--main .am-top-card__d{ font-size:13.5px; max-width:640px; }
.am-top-card--main .am-top-card__to a{ margin-right:18px; }
.am-top-cards{ gap:16px; }
.am-top-cards .wp-block-column{
  background:var(--am-bg-soft); border:1px solid var(--am-border);
  border-top:4px solid var(--am-primary); border-radius:12px; padding:20px 18px;
}
.entry-content h3.am-top-card__t{
  font-size:15.5px; font-weight:700; color:var(--am-primary-dark);
  line-height:1.5; margin:0 0 8px; border-bottom:none; padding:0;
}
.entry-content h3.am-top-card__t::after{ display:none; }
.am-top-card__d{ font-size:12.5px; color:var(--am-text-sub); margin:0 0 10px; line-height:1.7; }
.am-top-card__to{ font-size:13px; font-weight:700; margin:0; }
.am-top-card__to a{ color:var(--am-accent); text-decoration:none; }
.am-top-card__to a:hover{ text-decoration:underline; }

/* 約束3か条 */
.am-top-promise{ background:#E8F4F3; padding:48px 24px; }
.am-top-pitem{
  display:flex; gap:18px; align-items:flex-start;
  background:#fff; border-radius:12px; padding:20px 24px;
  max-width:820px; margin:0 auto 14px;
  box-shadow:0 4px 16px -10px rgba(46,139,132,.25);
}
.am-top-pitem__num{
  flex:0 0 42px; display:flex; width:42px; height:42px; border-radius:50%;
  background:var(--am-primary); color:#fff; font-weight:800; font-size:18px;
  align-items:center; justify-content:center; margin:0;
}
.am-top-pitem__body{ flex:1; }
.entry-content h3.am-top-pitem__t{
  font-size:15.5px; font-weight:700; color:var(--am-primary-dark);
  margin:2px 0 6px; border-bottom:none; padding:0;
}
.entry-content h3.am-top-pitem__t::after{ display:none; }
.am-top-pitem__d{ font-size:13px; color:#555; line-height:1.8; margin:0; }
.entry-content h2.am-top-promise__h2{ max-width:1080px; margin:0 auto 8px; }
.am-top-promise__lead{ max-width:1080px; margin:12px auto 24px; }
.am-top-pol{ text-align:center; font-size:13.5px; font-weight:700; margin:24px 0 0; }
.am-top-pol a{ color:var(--am-primary-dark); }

/* カテゴリ枠 */
.am-top-cats{ gap:18px; }
.am-top-cat{
  border:1px solid var(--am-border); border-radius:12px;
  padding:20px 22px; margin-bottom:18px;
}
.entry-content h3.am-top-cat__t{
  display:inline-block; font-size:14.5px; font-weight:700;
  color:#fff; background:var(--am-primary);
  padding:3px 14px; border-radius:6px; margin:0 0 12px; border-bottom:none;
}
.entry-content h3.am-top-cat__t::after{ display:none; }
.am-top-cat ul{ list-style:none; margin:0; padding:0; }
.am-top-cat li{
  font-size:13.5px; padding:9px 0 9px 20px; margin:0;
  border-bottom:1px dashed var(--am-border); position:relative; line-height:1.6;
}
.am-top-cat li::before{ content:"›"; position:absolute; left:4px; color:var(--am-accent); font-weight:800; }
.am-top-cat li a{ color:var(--am-text); text-decoration:none; }
.am-top-cat li a:hover{ color:var(--am-primary-dark); text-decoration:underline; }
.am-top-cat__all{ font-size:12.5px; font-weight:700; text-align:right; margin:10px 0 0; }
.am-top-cat__all a{ color:var(--am-accent); text-decoration:none; }

/* まず読んでほしい記事: 主役1本＋2本（非対称） */
.am-top-pick--main{
  border:1px solid var(--am-border); border-left:6px solid var(--am-primary);
  border-radius:12px; padding:22px 26px; margin-bottom:16px;
  background:var(--am-bg-soft);
}
.am-top-pick--main .am-top-pick__t{ font-size:16.5px; }
.am-top-pick--main .am-top-pick__d{ font-size:13px; max-width:680px; }
.am-top-picks{ gap:16px; }
.am-top-picks .wp-block-column{
  border:1px solid var(--am-border); border-radius:12px; padding:18px;
}
.am-top-pick__tag{
  display:inline-block; font-size:11px; color:#fff; background:var(--am-accent);
  border-radius:4px; padding:1px 10px; margin:0 0 8px;
}
.am-top-pick__t{ font-size:14px; font-weight:700; line-height:1.6; margin:0 0 6px; }
.am-top-pick__t a{ color:var(--am-text); text-decoration:none; }
.am-top-pick__t a:hover{ color:var(--am-primary-dark); }
.am-top-pick__d{ font-size:12px; color:var(--am-text-sub); margin:0; line-height:1.7; }

/* 運営者ブロック */
.am-top-about{
  background:var(--am-bg-soft); border:1px solid var(--am-border);
  border-radius:14px; padding:28px;
}
.am-top-about__name{ font-size:16px; font-weight:700; color:var(--am-primary-dark); margin:0 0 8px; }
.am-top-about__body{ font-size:14px; line-height:1.9; margin:0 0 10px; }
.am-top-about__links{ font-size:13px; font-weight:700; margin:12px 0 0; }
.am-top-about__links a{ color:var(--am-accent); text-decoration:none; margin-right:22px; }

/* 新着記事（latest-posts） */
.am-top-latest.wp-block-latest-posts{ margin-top:8px; }
.am-top-latest li{
  border:1px solid var(--am-border); border-radius:10px; padding:14px 16px;
}
.am-top-latest li > a{ font-size:13.5px; font-weight:700; line-height:1.6; color:var(--am-text); text-decoration:none; }
.am-top-latest li > a:hover{ color:var(--am-primary-dark); }
.am-top-latest .wp-block-latest-posts__post-date{ font-size:11px; color:var(--am-text-sub); }

/* ふわっと表示（動きはこの1種のみ。home-fade.jsが付与） */
.am-fade{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
.am-fade.is-visible{ opacity:1; transform:none; }

/* モバイル（〜600px） */
@media (max-width:600px){
  .am-top-hero{ padding:44px 18px 40px; }
  .am-top-hero__title{ font-size:22px; }
  .am-top-hero__title br{ display:none; }
  .am-top-hero__lead{ font-size:13.5px; }
  .am-top-sec{ padding:36px 0 4px; }
  .am-top-promise{ padding:36px 18px; }
  .am-top-cat{ padding:16px 16px; }
  .am-top-about{ padding:20px 18px; }
  .am-top-card--main{ padding:18px 18px; }
  .am-top-card--main .am-top-card__t{ font-size:16px; }
  .am-top-pitem{ padding:16px 16px; gap:12px; }
  .am-top-pick--main{ padding:18px 18px; }
}
@media (max-width:380px){
  .am-top-hero__title{ font-size:20px; }
}

/* =============================================
   ニキビ対策ナビ（固定ページ acne-navi）v1.4.0
   ============================================= */
#am-navi{ margin:24px 0 8px; }
.am-navi-box{
  background:var(--am-bg-soft); border:1px solid var(--am-border);
  border-top:4px solid var(--am-primary); border-radius:14px;
  padding:28px 26px; max-width:680px; margin:0 auto;
}
.am-navi-progress{
  font-size:12px; font-weight:700; color:var(--am-primary-dark);
  letter-spacing:.08em; margin:0 0 10px;
}
.am-navi-q{
  font-size:18px; font-weight:700; line-height:1.6;
  color:var(--am-text); margin:0 0 18px;
}
.am-navi-opts{ display:flex; flex-direction:column; gap:10px; }
.am-navi-opt{
  display:block; width:100%; text-align:left;
  background:#fff; border:1px solid var(--am-border); border-radius:10px;
  padding:14px 16px; font-size:14.5px; line-height:1.6; color:var(--am-text);
  cursor:pointer; transition:border-color .15s, box-shadow .15s;
  font-family:inherit;
}
.am-navi-opt:hover{
  border-color:var(--am-primary);
  box-shadow:0 2px 10px -4px rgba(46,139,132,.35);
}
.am-navi-back{
  display:inline-block; margin-top:18px;
  background:none; border:none; padding:0;
  font-size:13px; font-weight:700; color:var(--am-text-sub);
  cursor:pointer; text-decoration:underline; font-family:inherit;
}
.am-navi-back:hover{ color:var(--am-primary-dark); }
.am-navi-rtitle{
  font-size:19px; font-weight:800; line-height:1.5;
  color:var(--am-primary-dark); margin:0 0 12px;
}
.am-navi-rbody{ font-size:14.5px; line-height:1.9; margin:0 0 18px; }
.am-navi-links{ display:flex; flex-direction:column; gap:10px; }
.am-navi-cta{
  display:block; background:var(--am-primary); color:#fff !important;
  font-weight:700; font-size:14.5px; line-height:1.5;
  padding:14px 18px; border-radius:8px;
  text-decoration:none !important; text-align:center;
}
.am-navi-cta:hover{ background:var(--am-primary-dark); }
.am-navi-note{
  font-size:11.5px; color:var(--am-text-sub); line-height:1.7;
  margin:16px 0 0; padding-top:12px; border-top:1px dashed var(--am-border);
}
@media (max-width:600px){
  .am-navi-box{ padding:20px 16px; }
  .am-navi-q{ font-size:16px; }
  .am-navi-opt{ font-size:13.5px; padding:13px 14px; }
  .am-navi-rtitle{ font-size:17px; }
}
.am-top-navilink{ margin-top:18px; font-size:14px; font-weight:700; }
.am-top-navilink a{ color:var(--am-accent); text-decoration:none; }
.am-top-navilink a:hover{ text-decoration:underline; }

/* =============================================
   ナビ誘導バナー（記事内・サイドバー）v1.5.0
   ============================================= */
.am-navi-banner{
  background:#fff; border:1px solid var(--am-border);
  border-left:5px solid var(--am-accent);
  border-radius:var(--am-radius); padding:18px 20px; margin:32px 0 24px;
}
.am-navi-banner__title{ font-size:15.5px; font-weight:700; color:var(--am-text); margin:0 0 6px; }
.am-navi-banner__body{ font-size:13px; color:var(--am-text-sub); margin:0 0 12px; line-height:1.7; }
.am-navi-banner__btn{
  display:inline-block; background:var(--am-accent); color:#fff !important;
  font-weight:700; font-size:13.5px; padding:10px 20px; border-radius:6px;
  text-decoration:none !important;
}
.am-navi-banner__btn:hover{ opacity:.9; }
.widget-area .am-navi-banner{ margin:0 0 28px; padding:16px; }
@media (max-width:600px){
  .am-navi-banner{ padding:16px; }
  .am-navi-banner__btn{ display:block; text-align:center; }
}

/* v1.5.1: トップのナビ導入文（カードとの間隔） */
.am-top-navi-lead{
  margin:44px 0 4px; font-size:14px; font-weight:700; color:var(--am-text);
}

/* v1.5.2: トップへ戻るボタンをサイトカラーに統一（Astra既定は青#046bd2） */
#ast-scroll-top{
  background-color:var(--am-primary);
  border-radius:8px;
}
#ast-scroll-top:hover,
#ast-scroll-top:focus{
  background-color:var(--am-primary-dark);
}

/* v1.5.3: 状況ナビカードのSVGアイコン */
.am-top-card__icon{
  width:46px; height:46px; border-radius:50%;
  background:#E8F4F3; color:var(--am-primary);
  display:flex; align-items:center; justify-content:center;
  margin:0 0 12px;
}
.am-top-card__icon svg{ width:24px; height:24px; display:block; }
.am-top-card--main .am-top-card__icon{
  background:#FCEBDD; color:var(--am-accent);
  width:52px; height:52px;
}
.am-top-card--main .am-top-card__icon svg{ width:27px; height:27px; }
@media (max-width:600px){
  .am-top-card__icon{ width:42px; height:42px; margin-bottom:10px; }
}

/* v1.5.4: フッターメニューを中央横並びに（primary行を1カラム化） */
.site-footer .site-primary-footer-inner-wrap{ grid-template-columns:1fr !important; }
.site-footer .footer-navigation{ width:100%; }
.site-footer ul.ast-nav-menu{
  display:flex; flex-wrap:wrap; justify-content:center;
  column-gap:28px; row-gap:6px; width:100%;
}
.site-footer ul.ast-nav-menu li{ margin:0; }
.site-footer ul.ast-nav-menu a{ font-size:13px; }
@media (max-width:600px){
  .site-footer ul.ast-nav-menu{ column-gap:18px; }
  .site-footer ul.ast-nav-menu a{ font-size:12.5px; }
}

/* v1.5.5: 新着記事カードにアイキャッチ表示 */
.am-top-latest li{ overflow:hidden; padding:0 0 14px; }
.am-top-latest .wp-block-latest-posts__featured-image{ margin:0 0 12px; }
.am-top-latest .wp-block-latest-posts__featured-image img{
  display:block; width:100%; height:auto; border-radius:10px 10px 0 0;
}
.am-top-latest li > a{ display:block; padding:0 16px; }
.am-top-latest .wp-block-latest-posts__post-date{ padding:0 16px; }

/* v1.5.6: まず読んでほしい記事にサムネイル */
.am-top-pick__img img{ display:block; width:100%; height:auto; border-radius:10px; }
.am-top-picks .wp-block-column .am-top-pick__img{ margin:0 0 12px; }
.am-top-pick--main{ display:flex; gap:22px; align-items:center; }
.am-top-pick__img--main{ flex:0 0 38%; margin:0; }
.am-top-pick--main .am-top-pick__body{ flex:1; }
@media (max-width:600px){
  .am-top-pick--main{ flex-direction:column; align-items:stretch; gap:12px; }
  .am-top-pick__img--main{ flex:none; }
}

/* v1.5.7: サイドバー最新記事にサムネイル（画像左・タイトル右） */
.widget-area .am-side-latest li{
  display:flex; align-items:center; gap:10px;
  margin-bottom:14px;
}
.widget-area .am-side-latest .wp-block-latest-posts__featured-image{
  flex:0 0 64px; margin:0;
}
.widget-area .am-side-latest .wp-block-latest-posts__featured-image img{
  display:block; width:64px; height:64px; object-fit:cover; border-radius:8px;
}
.widget-area .am-side-latest li > a{
  flex:1; font-size:13px; line-height:1.55;
}

/* v1.5.8: ヒーロー背景写真（仮=記事12アイキャッチ。Codex納品後に home-hero.jpg へ差し替え） */
.am-top-hero{
  background:
    linear-gradient(135deg, rgba(36,110,104,.88) 0%, rgba(46,139,132,.82) 100%),
    url(https://nikibilab.com/acne-medicine/wp-content/uploads/2026/08/01_nikibi-nomigusuri-eye-catch.jpg) center 35%/cover no-repeat;
}

/* v1.5.9: ヒーローの高さ拡大（縦中央揃え） */
.am-top-hero{
  min-height:68vh;
  display:flex; flex-direction:column; justify-content:center;
}
@media (max-width:600px){
  .am-top-hero{ min-height:58vh; }
}

/* v1.6.0: 運営者ブロックにロゴ（画像左・テキスト右） */
.am-top-about{ display:flex; gap:24px; align-items:flex-start; }
.am-top-about__logo{ flex:0 0 92px; }
.am-top-about__logo img{
  display:block; width:92px; height:92px; border-radius:50%;
  border:1px solid var(--am-border);
}
.am-top-about__inner{ flex:1; }
@media (max-width:600px){
  .am-top-about{ flex-direction:column; align-items:center; gap:14px; }
  .am-top-about__inner{ width:100%; }
  .am-top-about__name{ text-align:center; }
}

/* v1.6.1: サイドバー「このサイトについて」プロフィールカード */
.am-side-about{
  background:var(--am-bg-soft); border:1px solid var(--am-border);
  border-top:4px solid var(--am-primary); border-radius:12px;
  padding:22px 18px; text-align:center;
}
.am-side-about__logo{
  width:76px; height:76px; border-radius:50%;
  border:1px solid var(--am-border); margin:0 auto 10px; display:block;
}
.am-side-about__name{
  font-size:14.5px; font-weight:700; color:var(--am-primary-dark); margin:0 0 8px;
}
.am-side-about__desc{
  font-size:12.5px; color:var(--am-text-sub); line-height:1.8;
  text-align:left; margin:0 0 12px;
}
.am-side-about__rules{
  list-style:none; margin:0 0 16px; padding:12px 0 0;
  border-top:1px dashed var(--am-border); text-align:left;
}
.am-side-about__rules li{
  font-size:12.5px; font-weight:700; color:var(--am-text);
  padding:4px 0 4px 22px; margin:0; position:relative;
}
.am-side-about__rules li::before{
  content:"\2713"; position:absolute; left:2px; top:4px;
  color:var(--am-primary); font-weight:800;
}
.am-side-about__btn{
  display:block; background:var(--am-primary); color:#fff !important;
  font-size:13px; font-weight:700; padding:11px 14px; border-radius:8px;
  text-decoration:none !important;
}
.am-side-about__btn:hover{ background:var(--am-primary-dark); }

/* v1.6.2: サイドバー末尾のナビバナーをスクロール追従に */
.widget-area.secondary{ height:100%; }
.widget-area.secondary .sidebar-main{ height:100%; }
.widget-area.secondary .sidebar-main > .widget:last-child{
  position:sticky; top:32px;
}
@media (max-width:921px){
  .widget-area.secondary .sidebar-main > .widget:last-child{ position:static; }
}

/* v1.6.3: サイドバーaboutカードの上部アクセント帯を削除 */
.am-side-about{ border-top:1px solid var(--am-border); }

/* v1.6.4: 約束リストとボタンの間隔を拡大 */
.am-side-about__rules{ margin-bottom:22px; }

/* v1.6.5: 約束リストとボタンの間隔をさらに拡大 */
.am-side-about__rules{ margin-bottom:28px; }

/* v1.6.6: sticky有効化＋マージンの詳細度修正
   ①Astraの body{overflow-x:hidden} が position:sticky を殺すため clip に置換
     （横スクロール防止効果は同じ・stickyは生きる）
   ②Astraの .widget ul{margin:0} に詳細度で勝つセレクタでボタン前の間隔を確保 */
body{ overflow-x: clip; }
.widget .am-side-about__rules{ margin: 0 0 28px; }

/* v1.6.7: sticky修正＋マージン22px
   #secondaryはflexストレッチで自然に全高になるため、v1.6.2のheight:100%指定を撤回
   （height:100%がストレッチを打ち消して可動域を潰していた） */
.widget-area.secondary{ height:auto; }
.widget-area.secondary .sidebar-main{ height:100%; }
.widget .am-side-about__rules{ margin:0 0 22px; }

/* v1.6.8: サイドバーのカテゴリ一覧にSVGアイコン */
.widget-area .wp-block-categories .cat-item{ position:relative; padding-left:27px; }
.widget-area .wp-block-categories .cat-item::before{
  content:""; position:absolute; left:2px; top:50%; transform:translateY(-50%);
  width:17px; height:17px; background-position:center; background-repeat:no-repeat; background-size:contain;
}
.widget-area .wp-block-categories .cat-item-1::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E8B84' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='rotate%28-40 12 12%29'%3E%3Crect x='3' y='8.5' width='18' height='7' rx='3.5'/%3E%3Cline x1='12' y1='8.5' x2='12' y2='15.5'/%3E%3C/g%3E%3C/svg%3E"); }
.widget-area .wp-block-categories .cat-item-2::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E8B84' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4.5' width='14' height='17' rx='2'/%3E%3Cpath d='M9.5 4.5a2.5 2.5 0 0 1 5 0'/%3E%3Cline x1='12' y1='10' x2='12' y2='16'/%3E%3Cline x1='9' y1='13' x2='15' y2='13'/%3E%3C/svg%3E"); }
.widget-area .wp-block-categories .cat-item-3::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E8B84' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5c3.2 4 6 6.8 6 10a6 6 0 0 1-12 0c0-3.2 2.8-6 6-10z'/%3E%3C/svg%3E"); }
.widget-area .wp-block-categories .cat-item-4::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E8B84' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 3.5 14.6 9 20.5 9.7 16.2 13.8 17.3 19.7 12 16.8 6.7 19.7 7.8 13.8 3.5 9.7 9.4 9'/%3E%3C/svg%3E"); }
.widget-area .wp-block-categories .cat-item-5::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E8B84' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2.5' width='10' height='19' rx='2.5'/%3E%3Cline x1='12' y1='8' x2='12' y2='14'/%3E%3Cline x1='9' y1='11' x2='15' y2='11'/%3E%3Cline x1='11' y1='18.5' x2='13' y2='18.5'/%3E%3C/svg%3E"); }
.widget-area .wp-block-categories .cat-item-6::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E8B84' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14a2 2 0 0 1-2 2H8l-4 4V6a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2z'/%3E%3Cpath d='M9.8 8.6a2.2 2.2 0 0 1 4.3.6c0 1.4-2.1 1.8-2.1 3'/%3E%3Cline x1='12' y1='14.4' x2='12' y2='14.5'/%3E%3C/svg%3E"); }

/* v1.6.9: ナビバナーのフォトカード化（サイドバー） */
.am-navi-banner--photo{
  padding:0; border-left:1px solid var(--am-border); overflow:hidden;
  border-radius:14px; box-shadow:0 6px 20px -10px rgba(46,139,132,.35);
}
.am-navi-banner__photo{ position:relative; }
.am-navi-banner__photo img{
  display:block; width:100%; aspect-ratio:16/10; object-fit:cover;
}
.am-navi-banner__badge{
  position:absolute; left:10px; top:10px;
  background:rgba(255,255,255,.94); color:var(--am-primary-dark);
  font-size:11.5px; font-weight:700; padding:4px 12px; border-radius:999px;
}
.am-navi-banner--photo .am-navi-banner__inner{ padding:16px 16px 18px; }
.am-navi-banner--photo .am-navi-banner__title{ font-size:15.5px; margin:0 0 6px; }
.am-navi-banner--photo .am-navi-banner__body{ margin:0 0 14px; }
.am-navi-banner--photo .am-navi-banner__btn{
  display:block; text-align:center; padding:12px 16px;
}
.am-navi-banner--photo .am-navi-banner__btn:hover{ opacity:1; background:#d06f2d; }

/* v1.7.0: 記事末尾ナビバナーの横並びフォトカード */
.am-navi-banner--h{ display:flex; align-items:stretch; margin:32px 0 24px; }
.am-navi-banner--h .am-navi-banner__photo{ flex:0 0 36%; }
.am-navi-banner--h .am-navi-banner__photo img{
  width:100%; height:100%; aspect-ratio:auto; object-fit:cover;
}
.am-navi-banner--h .am-navi-banner__inner{
  flex:1; display:flex; flex-direction:column; justify-content:center;
  padding:20px 24px;
}
.am-navi-banner--h .am-navi-banner__title{ font-size:16.5px; }
.am-navi-banner--h .am-navi-banner__btn{
  display:inline-block; align-self:flex-start; padding:12px 26px;
}
.am-navi-banner--h p{ margin-bottom:0; }
.am-navi-banner--h .am-navi-banner__title{ margin-bottom:6px; }
.am-navi-banner--h .am-navi-banner__body{ margin-bottom:14px; }
@media (max-width:600px){
  .am-navi-banner--h{ flex-direction:column; }
  .am-navi-banner--h .am-navi-banner__photo{ flex:none; }
  .am-navi-banner--h .am-navi-banner__photo img{ aspect-ratio:16/9; height:auto; }
  .am-navi-banner--h .am-navi-banner__btn{ display:block; align-self:stretch; text-align:center; }
}

/* v1.7.1: A8テキストリンクのボタン化 */
.am-af{ text-align:center; margin:26px 0 10px; }
.am-af a{
  display:inline-block; background:var(--am-accent); color:#fff !important;
  font-weight:700; font-size:15px; line-height:1.5;
  padding:14px 30px; border-radius:8px; text-decoration:none !important;
}
.am-af a:hover{ background:#d06f2d; }
@media (max-width:600px){
  .am-af a{ display:block; padding:14px 16px; font-size:14px; }
}

/* v1.7.2: ヒーロー背景を本番画像に差し替え（Codex納品 home-hero.jpg） */
.am-top-hero{
  background:
    linear-gradient(135deg, rgba(36,110,104,.86) 0%, rgba(46,139,132,.80) 100%),
    url(https://nikibilab.com/acne-medicine/wp-content/uploads/2026/08/home-hero.jpg) center 40%/cover no-repeat;
}

/* v1.7.3: ヒーローのオーバーレイを薄く（.86/.80 → .70/.62）＋文字に影で可読性を確保 */
.am-top-hero{
  background:
    linear-gradient(135deg, rgba(36,110,104,.70) 0%, rgba(46,139,132,.62) 100%),
    url(https://nikibilab.com/acne-medicine/wp-content/uploads/2026/08/home-hero.jpg) center 40%/cover no-repeat;
}
.am-top-hero__title{ text-shadow:0 2px 12px rgba(0,0,0,.28); }
.am-top-hero__lead{ text-shadow:0 1px 8px rgba(0,0,0,.30); opacity:1; }

/* v1.7.4: トップのナビ導入文をリンク行に戻す（ツール本体は専用ページのみ） */
.am-top-navi-lead{ margin:36px 0 8px; font-size:14px; font-weight:700; }
.am-top-navi-lead a{ color:var(--am-accent); text-decoration:none; }
.am-top-navi-lead a:hover{ text-decoration:underline; }

/* v1.7.5: トップのナビ導線をボタン化 */
.am-top-navi-lead{ margin:36px 0 12px; }
.am-top-navi-lead a{ all:unset; }
.am-top-navi-btn{ text-align:center; margin:0 0 8px; }
.am-top-navi-btn a{
  display:inline-block; background:var(--am-primary); color:#fff !important;
  font-size:15px; font-weight:700; padding:14px 34px; border-radius:999px;
  text-decoration:none !important;
  box-shadow:0 6px 18px -8px rgba(46,139,132,.5);
}
.am-top-navi-btn a:hover{ background:var(--am-primary-dark); }
@media (max-width:600px){
  .am-top-navi-btn a{ display:block; margin:0 8px; padding:14px 16px; font-size:14px; }
}

/* v1.7.6: ナビ専用ページの注記（幅制限・マージン・改行制御） */
.am-navi-note{
  max-width:680px; margin:32px auto 0; text-align:left;
  padding-top:18px; border-top:1px dashed var(--am-border);
}
@media (max-width:600px){
  .am-navi-note{ margin-top:24px; }
  .am-navi-note br{ display:none; }
  .am-navi-note{ text-indent:0; }
}

/* v1.7.7: フッターを1セクションに統合（メニュー＋コピーライト縦積み） */
.site-footer .site-footer-primary-section-1{
  display:flex; flex-direction:column; align-items:center; gap:14px;
}
.site-footer .site-primary-footer-wrap{ padding-top:34px; padding-bottom:30px; }
.site-footer .ast-footer-copyright{ width:100%; }
.site-footer .ast-footer-copyright p{
  font-size:11.5px; letter-spacing:.04em; color:var(--am-text-sub);
  text-align:center; margin:0; line-height:1.8;
}
.site-footer .ast-footer-copyright a{ color:var(--am-primary-dark); text-decoration:none; }
.site-footer .ast-footer-copyright a:hover{ text-decoration:underline; }
/* 空になった下段は詰める */
.site-footer .site-below-footer-wrap{ padding:0; min-height:0; }
@media (max-width:600px){
  .site-footer .ast-footer-copyright p{ font-size:11px; }
}

/* v1.7.8: フッターメニューを確実に中央揃え
   （ウィジェット領域・nav・ul の各段で中央寄せを明示） */
.site-footer .footer-widget-area[data-section="section-footer-menu"]{ width:100%; }
.site-footer .footer-bar-navigation{ width:100%; }
.site-footer .footer-navigation{ width:100%; flex-grow:0 !important; }
.site-footer .footer-nav-wrap{ width:100%; display:flex; justify-content:center; }
.site-footer ul.ast-nav-menu{
  display:flex !important; flex-wrap:wrap; justify-content:center !important;
  width:auto; margin:0 auto;
}

/* ==========================================================================
   パンくずリスト（Rank Math × Astra entry_top・v1.7.9）
   ========================================================================== */
.ast-breadcrumbs-wrapper {
  margin-bottom: 14px;
}
.ast-breadcrumbs-wrapper .rank-math-breadcrumb {
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--am-text-sub);
}
.ast-breadcrumbs-wrapper .rank-math-breadcrumb a {
  color: var(--am-primary);
  text-decoration: none;
}
.ast-breadcrumbs-wrapper .rank-math-breadcrumb a:hover {
  color: var(--am-primary-dark);
  text-decoration: underline;
}
.ast-breadcrumbs-wrapper .rank-math-breadcrumb .separator {
  color: var(--am-border);
  margin: 0 2px;
}
.ast-breadcrumbs-wrapper .rank-math-breadcrumb .last {
  color: var(--am-text-sub);
  opacity: 0.85;
}
@media (max-width: 600px) {
  .ast-breadcrumbs-wrapper {
    margin-bottom: 10px;
  }
  .ast-breadcrumbs-wrapper .rank-math-breadcrumb {
    font-size: 11.5px;
  }
}