/*
Theme Name: mamacollege
Template: astra          
Text Domain: mamacollege.jp
Author: WebSys
Version: 1.0.0
Description: Custom child theme for mamacollege
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/


@import url("../astra/style.css");

/*全体一括*/
/* ===== 余白ルール（全ページ） =====
   - ベースは #content.site-content
   - 画面幅 850px 以下：左右30px / 項目間40px
   - 画面幅 851px 以上：左右50px / 項目間48px
*/
#content.site-content{
  --mc-top:    48px;  /* Desktop 上部余白 */
  --mc-gutter: 50px;   /* Desktop 左右余白 */
  --mc-gap:    48px;   /* Desktop 項目間余白 */
  padding-inline: var(--mc-gutter);  /* 左右余白 */
  padding-top:    var(--mc-top);
}

/* 連続する直下要素の“間”だけを空ける */
#content.site-content > * + *{
  margin-top: var(--mc-gap);         /* 項目間余白 */
}

/* モバイル／iPad（下部固定メニューあり） */
@media (max-width: 850px){
  #content.site-content{
    --mc-top:    32px;  /* Mobile 上部余白 */
    --mc-gutter: 15px;   /* Mobile 左右余白 */
    --mc-gap:    32px;   /* Mobile 項目間余白 */
    padding-top:    var(--mc-top);
    padding-inline: var(--mc-gutter);

    /* 下部固定メニューと重ならないように少し多めに下余白（必要に応じて調整） */
    padding-bottom: calc(var(--mc-gap) + 0px); /* 96px ≒ ボトムナビの高さ */
  }
}

/* ダッシュボード等でセクション単位のクラスがある場合は統一できる */
.dashboard-section{ margin-bottom: var(--mc-gap); }

/* フルブリードにしたい要素（横いっぱいに出したいバナー等）はユーティリティで個別に解除 */
#content.site-content .mc-fullbleed{
  margin-inline: calc(-1 * var(--mc-gutter));   /* コンテナの左右余白を打ち消す */
}



/* ==== ヘッダー（少し高く） ==== */
.mc-header {
  position: sticky; 
  top: 0; 
  z-index: 1000;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.06);
}
.admin-bar .mc-header { 
  top: 46px; 
}
@media (min-width: 783px){ 
  .admin-bar .mc-header { 
    top: 32px; 
  }   
}

.mc-header__inner{
  max-width:1120px;
  margin:0 auto;
  padding:7px 18px;                 /* ← 高さアップ */
  display:flex;
  align-items:center;
  gap:18px;
}
.mc-logo img{height:44px;
  width:auto;
  display:block;
}  /* ← ロゴも少し大きく */

/* ==== PCナビ（>850px） ==== */
.mc-nav{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:22px;
}

.mc-btn{
  position:relative;
  display:inline-block;
  line-height:1;
  text-decoration:none;
}
.mc-btn__bg{
  display:block;
  height:85px;
  width:85px;
  object-fit:contain;
}  /* ← 円ボタンを拡大 */
.mc-btn__text{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:1000;
  font-size:14px;
  color:#eb6161;  /*元#c86471;*/
  padding:0 6px;
  text-align:center;
  white-space:nowrap;                 /* ← 2行に折り返さない */
  letter-spacing:.02em;
  pointer-events:none;
}

/* ==== モバイル/タブレット（<=850px）：上ロゴのみ／下に固定ナビ ==== */
.mc-bottomnav{
  display:none;
}

@media (max-width:850px){
  .mc-header__inner{
    justify-content:center;
  }
  .mc-nav{
    display:none;
  }  /* 上のボタンは隠す */

  .mc-bottomnav{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1000;
    display:flex;
    justify-content:space-around;
    align-items:center;
    gap:10px;
    background:rgba(255,255,255,.95);
    backdrop-filter:blur(8px);
    border-top:1px solid rgba(0,0,0,.08);
    padding:7px 12px calc(7px + env(safe-area-inset-bottom)) 12px; /* ← 少し高く */
  }
  .mc-bottomnav .mc-btn__bg{
    height:70px;
    width:70px;
  }  /* ← 下部ボタンも拡大 */
  .mc-bottomnav .mc-btn__text{
    font-size:11px;
    white-space:nowrap;
  }

  /* 下部ナビ分の余白（フッターが被らないように） */
  body{
    padding-bottom:calc(96px + env(safe-area-inset-bottom));
  }
}

/* 視覚的に隠す */
.screen-reader-text,.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* ヘッダー直下の余白（お好みで） */
.mc-header + #content{
  margin-top:8px;
}

/* 挨拶バー（ヘッダーのすぐ下に表示） */
.mc-greeting {
  background: transparent;
  padding: 6px 0 0;
	  display:flex;                 /* ← 親をフレックスに */
  justify-content:center; 
}
.mc-greeting__inner {
  max-width: 1120px;
  margin-bottom: 20px;
  padding: 10px 16px;
  text-align: center;
  color: #eb6161;
  background: #ffffff;
  border: 1px solid #fcc1c0;
  border-radius: 26px;
  box-shadow: 0 4px 16px rgba(235,97,97,.08);
  font-weight: 700;
  font-size:1.2rem;
	display:flex;align-items:center;justify-content:center;gap:.35em;
	width: min(1120px, calc(100% - 32px));
}
@media (max-width: 850px){
  .mc-greeting__inner { 
    margin-bottom: 15px;
    font-size: 16px;;
  }
}
@media (max-width: 650px){
  .mc-greeting__inner { 
    font-size: 13px;;
  }
}

/* 色の定義（お好みで調整可） */
:root{
  --mc-pink: #ffd6dc;   /* 参考画像のやさしいピンク */
  --mc-white: #ffffff;
}

/* デスクトップ：白いヘッダー */
.mc-header{
  background: var(--mc-white);
}

/* トップの挨拶ピルは白で保持（背景色変更の影響を受けないように） */
.mc-greeting__inner{
  background: var(--mc-white);
}

/* 850px以下：モバイル/タブレットの背景色とヘッダー色 */
@media (max-width: 850px){
  /* ページ全体の背景をピンクに */
  body{
    background: var(--mc-pink);
  }
  /* ヘッダーもピンク帯に */
  .mc-header{
    background: #ffd6d6;
    box-shadow: none; /* 影が不要なら */
  }
  /* 下部固定メニューの背面も馴染ませたい場合は適宜 */
  .mc-bottomnav{
    background: rgba(255,255,255,.95);
    border-top: 1px solid rgba(0,0,0,.08);
  }
}


/* ====== 全ページ共通の背景色 ====== */
:root{
  --mc-bg: #ffd6dc;  /* お好みで変更可 */
  --mc-ink: #eb6161; /* 文字＆アイコン色 */
}
html, body { background: var(--mc-bg); }



/* ====== ハンバーガー ====== */
.mc-header__inner{ position: relative; }
.mc-hamburger{
  display: none; /* PCでは非表示 */
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  width: 36px; height: 28px; padding: 0; border: 0; background: transparent;
  color: #eb6161;
}
.mc-hamburger span{
  display: block; height: 3px; width: 100%;
  background: var(--mc-ink); border-radius: 2px;
}
@media (max-width:850px){
  .mc-hamburger{ display: inline-flex; flex-direction: column; justify-content: space-between; }
}

/* ドロワー本体は固定配置 */
.mc-drawer{ position: fixed; inset: 0; z-index: 1200; pointer-events: none; }
.mc-drawer.is-open{ pointer-events: auto; }

/* スクリーン（黒半透明） */
.mc-drawer__scrim{ position:absolute; inset:0; opacity:0; transition:opacity .2s; }
.mc-drawer.is-open .mc-drawer__scrim{ opacity:1; }

/* パネル：縦スクロールを許可（iOSも） */
.mc-drawer__panel{
  position:absolute; right:0; top:0; height:100%;
  width:min(88vw,360px);
  background:#fff; box-shadow:-8px 0 24px rgba(0,0,0,.18);
  transform:translateX(100%); transition:transform .25s;
  padding:18px 18px 32px;
  overflow-y:auto;                    /* ← 縦スクロール */
  -webkit-overflow-scrolling: touch;  /* ← iOS慣性スクロール */
  overscroll-behavior: contain;       /* ← バックグラウンドへ伝播させない */
  touch-action: pan-y;                /* ← 縦スクロールを許可 */
}
.mc-drawer.is-open .mc-drawer__panel{ transform:translateX(0); }

/* 背景のスクロールを止める（クラス方式） */
html.mc-lock, body.mc-lock{ overflow:hidden; }

/* 階層トグル（右端の下矢印） */
.mc-menu, .mc-menu ul{ list-style:none; margin:0; padding:0; }
.mc-menu li{ position:relative; }
.mc-menu > li > a{ display:block; padding:14px 44px 14px 4px; font-weight:700; color:#444; text-decoration:none; }
.mc-menu > li{ border-bottom:1px solid #f2e7ea; }

.mc-menu li > ul{ display:none; }
.mc-menu li.is-open > ul{ display:block; }

/* トグルボタン */
.mc-menu__toggle{
  position:absolute; right:0; top:0; width:44px;
  border:0; background:transparent; cursor:pointer;
}
.mc-menu__toggle::before{
  content:""; display:inline-block; width:10px; height:10px;
  border-right:2px solid #888; border-bottom:2px solid #888;
  transform: rotate(45deg); transition: transform .2s;
}
.mc-menu li.is-open > .mc-menu__toggle::before{ transform: rotate(-135deg); }

/* サブ階層のリンク */
.mc-menu > li > ul a{ padding:10px 44px 10px 14px; font-weight:600; color:#6a6a6a; }
.mc-menu > li > ul > li{ border-bottom:1px solid #f7eff1; }

/* さらに深い階層も同じ仕組みでOK */
.mc-menu li ul li{ position:relative; }




/* 閉じるボタン */
.mc-drawer__close{
  position: absolute; right: 10px; top: 8px;
  border: 0; background: transparent; font-size: 28px; line-height: 1; cursor: pointer;
  color: var(--mc-ink);
}

/* メニューリスト */
.mc-menu, .mc-menu ul{ list-style: none; margin: 0; padding: 0; }
.mc-menu > li{ border-bottom: 1px solid #f2e7ea; }
.mc-menu a{
  display: block; padding: 14px 4px; text-decoration: none;
  color: #444; font-weight: 700;
}
.mc-menu > li > ul a{
  padding: 10px 4px 10px 14px; font-weight: 600; color: #6a6a6a;
}
.mc-menu a:hover{ color: var(--mc-ink); }

/* PCではドロワー非表示（保険） */
@media (min-width:851px){
  #mc-drawer{ display: none; }
}

/* ドロワーのレイヤー順を固定 */
.mc-drawer{ z-index: 1200; } /* 背景より前に */
.mc-drawer__panel{ z-index: 2; } /* ← パネルを前面 */
.mc-drawer__scrim{ z-index: 1; } /* ← スクリーンを背面（でもページより前） */


/* ① ドロワー最上部（動画一覧／検索）の上に余白を入れて
      ×（閉じる）ボタンと重ならないようにする */
.mc-drawer__panel .mc-menu{
  margin-top: 45px;    /* ←ご指定どおり */
}

/* ② トグル（mc-menu__toggle）にフォーカスが当たっても
      背景色が変わらないようにする（モバイルの青ハイライトも無効） */
.mc-menu__toggle{
  background: transparent;
  -webkit-tap-highlight-color: transparent; /* モバイルのタップ時ハイライト消し */
}
.mc-menu__toggle:hover,
.mc-menu__toggle:focus,
.mc-menu__toggle:active{
  background: transparent !important;  /* 背景は常に透明 */
  box-shadow: none;
  outline: none;                        /* 既存の輪郭が不要なら */
}
/* アクセシビリティを残したい場合は focus-visible だけ任意の細い輪郭に */
.mc-menu__toggle:focus-visible{
  outline: 2px solid var(--mc-ink);
  outline-offset: 2px;
}


/*ヘッダー終わり*/

/*フッター*/
/* ===== Footer (参考画像テイスト) ===== */
.mc-footer { 
  background: transparent; 
  padding: 28px 16px; 
}
.mc-footer__inner { 
  max-width: 1120px; 
  margin: 0 auto; 
  text-align: center; 
}

.mc-footer-links {
  list-style: none; 
  padding: 0; 
  margin: 0 0 10px;
  display: flex; 
  justify-content: center; 
  gap: 22px; 
  flex-wrap: wrap;
}
.mc-footer-links a {
  color: #333; 
  text-decoration: none; 
  font-weight: 600; 
  font-size: 14px;
}
.mc-footer-links a:hover { 
  text-decoration: underline; 
}

.mc-copy { 
  margin: 6px 0 0; 
  font-size: 14px; 
  color: #333; 
}

/* SP/Tablet (≤850px): 下部固定メニューと重ならない余白を確保 */
@media (max-width: 850px) {
  .mc-footer { 
    padding-bottom: calc(24px + env(safe-area-inset-bottom)); 
  }
  .mc-footer-links { 
    gap: 16px; 
  }
  .mc-copy { 
    font-size: 13px; 
  }
}
/* フッター終わり */


/*追加CSS*/
.ast-container{
		margin-top:10px;
}

@media(max-width:768px){
	.ast-container{
		padding-left: 8px;
		padding-right: 8px;
	}
	.slider-layout{
		padding:10px !important;
	}
	.reward-records-container{
		padding:10px !important;
	}
	.video-provider-form{
		padding:10px !important;
	}
	.page-id-27 .entry-content h2{
		font-weight: 900 !important;
    font-size: 1.2rem !important;
	}
}

.dashboard-header {
    text-align: center;
    margin-top: 40px;
}
.category-title{
	align-items: center !important;
}

.site-primary-footer-wrap{
	padding-top:0px;
	padding-bottom:0px;
}

.swpm-join-us-link{
	display:none;
}
.swpm-forgot-pass-link{
	margin-bottom:20px;
}




.btn-primary{
	background-color:#eb6161 !important;
	border-color:#eb6161 !important;
}

.section-title{
	margin-bottom:0px !important;
}

.ast-builder-footer-grid-columns.site-primary-footer-inner-wrap.ast-builder-grid-row{
	  margin-top: 20px;
    margin-bottom: 10px;
}

/* ───────── ヘッダーに影＋下側に 5px の余白 ───────── */

/* ❶ 影を付ける  ── “masthead” の中に両ヘッダーが入っているのでまとめて指定 */
#masthead,
#ast-desktop-header,
#ast-mobile-header {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);  /* ふんわりした影 */
  z-index: 999;                               /* コンテンツより手前に */
}

/* ❷ 本文とのあいだに 5px の余白を作る */
#masthead {
  margin-bottom: 5px;   /* header タグの直後 (#content) との間隔 */
}

/* ❸ Sticky ヘッダー（固定表示）を使う場合に影を残したいなら */
.site-header.sticky-active {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
}

/* ───────── ヘッダーに影＋下側に 5px の余白 ───────── */

/* ❶ 影を付ける  ── “masthead” の中に両ヘッダーが入っているのでまとめて指定 */
#masthead,
#ast-desktop-header,
#ast-mobile-header {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);  /* ふんわりした影 */
  z-index: 999;                               /* コンテンツより手前に */
}

/* ❷ 本文とのあいだに 5px の余白を作る */
#masthead {
  margin-bottom: 5px;   /* header タグの直後 (#content) との間隔 */
	position: -webkit-sticky; /* iOS Safari 対応 */
  position: sticky;
  top: 0;                   /* 画面最上部に吸着 */
  z-index: 999;
}

.main-header-bar {
  position: inherit; /* #masthead が sticky になるので親継承で問題なし */
}
/* ❸ Sticky ヘッダー（固定表示）を使う場合に影を残したいなら */
.site-header.sticky-active {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
}

.dashboard-header h1{
	background: #eb6161 !important ;
	background-clip: text !important;
}

.section-header {
  position: relative;   /* 疑似要素を絶対配置するための基準 */
}



/* ▼ “すべて見る” ボタンを置く親を基準 (relative) にする */
.dashboard-section {          /* ← 親要素のクラスを確認して適宜変更 */
  position: relative !important;
  padding-bottom: 55px !important;       /* ボタン高さ + 余白。被りが気になる時に調整 */
}

/* ▼ 画面幅 768px 以下：ボタンを右下に固定 */
@media (max-width: 768px) {
  a.section-link {
    position: absolute !important;
    bottom: 16px !important;             /* 下からの距離（お好みで） */
    right: 16px !important;              /* 右からの距離 */
    margin: 0;                /* モバイル用上書き (余計な余白を消す) */
    flex-shrink: 0;           /* つぶれ防止 */
  }
	.page-id-21 .entry-content h2{
		font-weight:900;
		font-size:1.2rem!important
	}
}

.wp-block-button__link,
a.button,                /* .button クラスが付いた a 要素 */
.button,                 /* 旧 WooCommerce など */
.ast-button,
.ast-custom-button,
.ast-custom-button-link,
input[type="button"],
input[type="submit"],
input[type="reset"]{
  background:#eb6161 !important;
	border:1px solid #eb6161 !important;
	  color:#fff !important;
}

.page-id-21 .category-title {
	flex-direction:row !important;
	align-items: center !important;
	margin-bottom:0px !important;
	margin-top:15px !important;
}
.video-count{
	font-family: Times, serif !important;
}
.amazon-layout .video-search-section.compact{
	padding:15px !important;
}
.amazon-layout .video-search-section.compact, .mama-layout .live-search-section.compact{
	padding:15px !important;
}
@media (max-width:600px){
  .amazon-layout .video-search-section.compact, .mama-layout .live-search-section.compact{
    padding:0px !important;
  }
  
}

.live-slider-container, .mama-layout{
	background:white !important;
}
.search-button{
	padding: 14px 10px !important;
}
.grid-layout .video-search-section{
	padding:15px !important;
	background:#fff !important;
}
.forum-thread-item {
    border: 1px solid #eb6161 !important;
	padding: 20px !important;
}
.grid-layout .live-search-section{
	background:white !important;
	padding:15px !important;
}

.category-section, .live-category-section{
	box-shadow: none !important;
  border: none !important;
}
/* ===== ダッシュボード・投稿CTA ===== */
.mc-share-cta{
  max-width: 1120px;
  margin: 40px auto;        /* 上に余白を確保（指示書の項目間 48px に近い間隔） */
  padding: 24px 16px 8px;
  text-align: center;
  color: #EB6161;             /* 指示書のカラー */
  font-family: "Noto Sans JP", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Noto Sans CJK JP", sans-serif;
}

.mc-share-cta__lead{
  margin: 0 0 16px;
  font-weight: 700;
  font-size: 20px;            /* 指示書：フッダー文言 20px */
  letter-spacing: .02em;
}

.mc-share-cta__btn{
  display: inline-block;
  padding: 12px 30px;         /* 指示書：固定ボタン 18px に合わせた見え方 */
  border-radius: 9999px;
  text-decoration: none;
  font-weight: 700;
  font-size: 18px;
  color: #fff;
  background: linear-gradient(135deg, #EB6161, #D64545);
  box-shadow: 0 6px 16px rgba(235, 97, 97, .25);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.mc-share-cta__btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(235, 97, 97, .35);
  filter: brightness(1.03);
}

/* モバイル調整（左右余白 30px を意識） */
@media (max-width: 850px){
  .mc-share-cta{ padding: 16px 12px 0; margin-top: 32px; }
  .mc-share-cta__lead{ font-size: 18px; }
  .mc-share-cta__btn{ font-size: 16px; padding: 12px 24px; }
}


/* ===== トップページ　お知らせ＆イベント情報：ピル型リンク ===== */
.mc-news-banner{
  display:block;
  max-width:1120px;
  margin: 18px auto 0;
  padding: 14px 18px;
  background:#fff;
  color:#EB6161;
  text-decoration:none;
  border:1px solid #fcc1c0;
  border-radius: 9999px;
  box-shadow: 0 4px 16px rgba(235,97,97,.08);
}
.mc-news-banner__inner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
}
.mc-news-badge{
  display:inline-block;
  background:#1f3f7a;         /* 濃いめのネイビー系 */
  color:#fff;
  border-radius:9999px;
  padding: 6px 14px;
  font-weight:700;
  font-size:12px;
  line-height:1;
}
.mc-news-banner__text{
  font-weight:700;
  font-size:20px;              /* 指示書：フッダー 20pxに合わせた雰囲気 */
  letter-spacing:.02em;
  line-height:1.2;
}
.mc-news-banner__icon img{
  display:block;
  width:28px; height:28px;     /* 参考画像のサイズ感 */
  object-fit:contain;
}

/* モバイル／タブレット（<=850px） */
@media (max-width:850px){
  .mc-news-banner{ margin: 14px 12px 0; padding: 12px 14px; }
  .mc-news-badge{ font-size:11px; padding:5px 12px; }
  .mc-news-banner__text{ font-size:18px; }
  .mc-news-banner__icon img{ width:24px; height:24px; }
}


/* ==== セクション見出し（アイコン＋タイトルをピル型に） ==== */
.dashboard-section .section-header{
  padding: 16px 0 10px;
  border-bottom: none;              /* 既存の下線を消す */
  text-align: center;               /* 中央寄せ */
}

.dashboard-section .section-title-area{
  display: inline-flex;
  align-items: center;
  gap: 0px;
  padding: 10px 18px;               /* タグ内の余白 */
  justify-content: center;
}

.dashboard-section .section-icon img{
  width: 28px;
  height: 28px;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.06));
}

.dashboard-section .section-title{
  margin: 0;
  font-weight: 700;
  font-size: 20px;                  /* 指示書のトーンに合わせて */
  line-height: 1;
  color: #EB6161;
  letter-spacing: .02em;
}

/* スマホ/タブレット（<=850px）微調整 */
@media (max-width: 850px){
  .dashboard-section .section-header{ padding: 12px 0 6px; }
  .dashboard-section .section-title-area{
    gap: 0px;
    padding: 8px 14px;
  }
  .dashboard-section .section-icon img{
    width: 24px; height: 24px;
  }
  .dashboard-section .section-title{
    font-size: 18px;
  }
}

/* 参加中のコミュニティ：セクション面を白＆二重囲みで */
.dashboard-section:has(.community-list){
  /* 位置（中央寄せ） */
  margin: 0 auto 28px;

  /* 白い面 */
  position: relative;
  isolation: isolate;
  background: var(--mc-card, #fff) !important;
  border: 1px solid #eb6161;
  border-radius: 50px !important;
  padding: 20px;
  box-shadow: 0 8px 16px rgba(255,153,170,.08);
  overflow: hidden;
}

/* 外側のもう一重（掲示板の雰囲気） */
.dashboard-section:has(.community-list)::before{
  content:"";
  position:absolute;
  inset:-8px;                                /* 外へ少し広げる */
  border:2px solid var(--mc-border-outer, #f1a8b6);
  border-radius:36px;
  pointer-events:none;
  filter: drop-shadow(0 6px 10px rgba(255,153,170,.08));
  z-index:-1;
}

/* 内側のうっすら細線 */
.dashboard-section:has(.community-list)::after{
  content:"";
  position:absolute;
  inset:6px;
  border:1px solid var(--mc-border-inner, #ffe6ec);
  border-radius:45px;
  pointer-events:none;
  z-index:0;
}

/* セクション内のリストを面の内側に余白を確保 */
.dashboard-section:has(.community-list) .community-list{
  display:grid;
  gap:16px;
  margin-top: 12px;
}

/* セクションの背景画像などを無効化したい場合（あれば） */
.dashboard-section:has(.community-list){
  background-image: none !important;
}

/* =========================
   アクションガイド：白い面＋二重の囲み（中央寄せ）
   ========================= */
.action-guide-section{
  /* 位置：中央寄せ */
  max-width: 1080px;
  margin: 0 auto 28px;

  /* 白い面（掲示板カードと同じトーン） */
  position: relative;
  isolation: isolate;                 /* 疑似要素のレイヤー安定 */
  background: var(--mc-card, #fff);
  border: 1px solid #eb6161 !important;
  border-radius: 50px !important;
  padding: 20px;
  box-shadow: 0 8px 16px rgba(255,153,170,.08);
  overflow: hidden;

  /* 以前入っていたグラデ等を無効化 */
  background-image: none !important;
}

/* 外側の“もう一重”リング */
.action-guide-section::before{
  content:"";
  position:absolute;
  inset:-8px;                          /* 外に少し広げて二重枠 */
  border:2px solid var(--mc-border-outer, #f1a8b6);
  border-radius:36px;
  pointer-events:none;
  filter: drop-shadow(0 6px 10px rgba(255,153,170,.08));
  z-index:-1;
}

/* 内側のうっすら細線リング */
.action-guide-section::after{
  content:"";
  position:absolute;
  inset:6px;
  border:1px solid var(--mc-border-inner, #ffe6ec);
  border-radius:45px;
  pointer-events:none;
  z-index:0;
}

/* 見出しは中央寄せのまま（必要なら軽く整える） */
.action-guide-section .action-guide-title{
  text-align:center;
  margin: 12px;
  font-weight: 800;
  color:#f06a83;
  margin-bottom: 20px;
}

/* リストの外側余白だけ整える（中身の文字サイズ等は変更しない） */
.action-guide-section .action-guide-list{
  margin: 8px 0 0;
}
@media (max-width: 480px){
  .action-guide-section{ padding:16px; }
}





/* ============================
   mamacollege 掲示板（page-id-30 専用）
   ============================ */
.page-id-30{
  --mc-card:#fff;
  --mc-bg:#ffe2e8;
  --mc-border:#f6c9d3;
  --mc-accent:#ff6a95;
  --mc-text:#5f4f54;
  --mc-muted:#96898d;
}


/* コンテンツ幅と余白 */
.page-id-30 .forum-container{
  max-width: 960px;
  margin: 28px auto 80px;
  padding: 0 16px;
}

/* タイトル（「掲示板」）をピル風に */
.page-id-30 .entry-title{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  border: 2px solid var(--mc-border);
  border-radius: 999px;
  background: #fff;
  color: var(--mc-text);
  font-weight: 800;
  letter-spacing: .02em;
  position: relative;
}
.page-id-30 .entry-title::after{
  /* うっすら刷毛（ブラシ）っぽい下線 */
  content:"";
  position:absolute;
  left: 56px;
  right: 16px;
  bottom: 6px;
  height: 10px;
  background: linear-gradient(90deg,#ffd1dc, #ffe7ee);
  border-radius: 10px;
  z-index: -1;
  opacity: .8;
}

/* ヘッダー（「+ 新しいスレッドの作成」ボタン） */
.page-id-30 .forum-header{
  display:flex;
  justify-content:center;
  align-items:center;
  margin: 16px 0 18px;
}
.page-id-30 .forum-header a.btn,
.page-id-30 .forum-header .btn{
  display: inline-block;
  padding: 10px 22px;
  border-radius: 999px!important;
  background: var(--mc-accent)!important;
  color: #fff!important;
  font-weight: 700;
  letter-spacing: .02em;
  border: 0!important;
  box-shadow: 0 6px 12px rgba(255,106,149,.25);
  transition: transform .12s ease, filter .12s ease;
}
.page-id-30 .forum-header a.btn:hover,
.page-id-30 .forum-header .btn:hover{
  filter: brightness(1.03);
  transform: translateY(-1px);
}

/* スレッドリスト：ふわっと白カード＋淡いピンク枠 */
.page-id-30 .forum-thread-list{
  display: grid;
  gap: 22px;
}
.page-id-30 .forum-thread-item{
  background: var(--mc-card);
  border: 2px solid var(--mc-border);
  border-radius: 24px;
  box-shadow: 0 8px 16px rgba(255,153,170,.08);
  padding: 16px 18px;
  transition: transform .12s ease, box-shadow .12s ease;
}
.page-id-30 .forum-thread-item:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 20px rgba(255,153,170,.14);
}

/* タイトル行 */
.page-id-30 .forum-thread-item .thread-info h3{
  margin: 0 0 10px 0;
  font-size: 18px;
  line-height: 1.4;
}
.page-id-30 .forum-thread-item .thread-info h3 a{
  color: var(--mc-text);
  text-decoration: none;
  font-weight: 800;
}

/* タイトル下の仕切り線（参考画像の細い線） */
.page-id-30 .forum-thread-item .thread-info h3::after{
  content:"";
  display:block;
  height: 2px;
  background: var(--mc-border);
  border-radius: 999px;
  margin-top: 10px;
}

/* 説明テキスト（2行で省略） */
.page-id-30 .forum-thread-item .thread-description{
  color: var(--mc-text);
  margin: 8px 0 4px 0;
  font-size: 15px;
  line-height: 1.7;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* メタ情報（作成者/投稿日/投稿数/最終投稿）を控えめに */
.page-id-30 .forum-thread-item .thread-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--mc-muted);
}
.page-id-30 .forum-thread-item .thread-meta span{
  white-space: nowrap;
}

/* 「new!」バッジ（必要なら任意の要素に .badge-new を付与して使用） */
.page-id-30 .badge-new{
  font-size: 11px;
  color: #fff;
  background: #3b63ff;
  padding: 2px 8px;
  border-radius: 999px;
  letter-spacing: .02em;
  display: inline-block;
}

/* 余白の調整（フッター付近） */
.page-id-30 .site-main .entry-content > *:last-child{
  margin-bottom: 40px;
}

/* スマホ最適化 */
@media (max-width: 560px){
  .page-id-30 .forum-container{ padding: 0 12px; }
  .page-id-30 .forum-thread-item{ border-radius: 20px; padding: 14px 14px; }
  .page-id-30 .forum-thread-item .thread-info h3{ font-size: 17px; }
}

/* ============================
   スレッドの曲線＆周りの線 を追加
   ============================ */
.page-id-30{
  --mc-card:#fff;
  --mc-border:#f6c9d3;    /* 基本のピンク枠 */
  --mc-border-outer:#f1a8b6; /* 外側リング（少し濃い） */
  --mc-border-inner:#ffe6ec; /* 内側リング（薄い） */
  --mc-text:#5f4f54;
}

/* スレッドカード本体：大きめカーブ＋二重の輪郭線 */
.page-id-30 .forum-thread-item{
  position: relative;
  isolation: isolate;            /* 擬似要素のレイヤーを独立 */
  background: var(--mc-card);
  border: 2px solid var(--mc-border);
  border-radius: 28px;           /* ← 曲線（角丸）を強めに */
  padding: 16px 18px;
  box-shadow: 0 8px 16px rgba(255,153,170,.08);
  overflow: hidden;              /* 内側リングを綺麗に収める */
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.page-id-30 .forum-thread-item:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 20px rgba(255,153,170,.14);
  border-color: #f3b8c4;
}

/* 外側の“もう一重”リング（カードの周りの線） */
.page-id-30 .forum-thread-item::before{
  content: "";
  position: absolute;
  inset: -8px;                   /* 外側に 8px はみ出して配置 */
  border: 2px solid var(--mc-border-outer);
  border-radius: 36px;           /* 外側は更に大きく丸く */
  pointer-events: none;
  z-index: -1;                   /* 背景として見せる */
  filter: drop-shadow(0 6px 10px rgba(255,153,170,.08));
}

/* 内側の“うっすら細線”リング（内側の線） */
.page-id-30 .forum-thread-item::after{
  content: "";
  position: absolute;
  inset: 6px;                    /* 内側に 6px だけ縮めた枠 */
  border: 1px solid var(--mc-border-inner);
  border-radius: 20px;           /* 内側も丸く */
  pointer-events: none;
  z-index: 0;
}

/* タイトルと区切り線（カーブに合うよう細く長く） */
.page-id-30 .forum-thread-item .thread-info h3{
  margin: 0 0 10px 0;
  font-size: 18px;
  line-height: 1.4;
}
.page-id-30 .forum-thread-item .thread-info h3 a{
  color: var(--mc-text);
  text-decoration: none;
  font-weight: 800;
}
.page-id-30 .forum-thread-item .thread-info h3::after{
  content: "";
  display: block;
  height: 2px;
  background: var(--mc-border);
  border-radius: 999px;          /* 丸い仕切り線 */
  margin-top: 10px;
}

/* 説明とメタはそのまま（必要なら前回CSSと併用OK） */
.page-id-30 .forum-thread-item .thread-description{
  color: var(--mc-text);
  margin: 8px 0 4px 0;
  font-size: 15px;
  line-height: 1.7;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.page-id-30 .forum-thread-item .thread-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-top: 6px;
  font-size: 12px;
  color: #96898d;
}

/* 角丸・リングの微調整（モバイル） */
@media (max-width: 560px){
  .page-id-30 .forum-thread-item{
    border-radius: 24px;
    padding: 14px;
  }
  .page-id-30 .forum-thread-item::before{ inset: -6px; border-radius: 30px; }
  .page-id-30 .forum-thread-item::after{ inset: 5px; border-radius: 18px; }
}



/* ===== Avatar Upload: robust button (CSS-only) ===== */
:root{
  --mc-border:#f6c9d3;
  --mc-accent:#ff6a95;
  --mc-text:#5f4f54;
  --mc-muted:#96898d;
}

/* 円形アバター（既に円ならこの塊は任意） */
.profile-avatar-container{ text-align:center; margin: 10px 0 12px; }
.profile-avatar-container .current-avatar-display{
  width:140px; height:140px; margin:0 auto 10px;
  border-radius:50%; overflow:hidden; background:#fff center/cover no-repeat;
  border:2px solid var(--mc-border); outline:6px solid #fff;
  box-shadow:0 10px 18px rgba(255,153,170,.12);
}
.profile-avatar-container .current-avatar-display img{
  width:100%; height:100%; object-fit:cover; display:block;
}

/* スタック配置＆中央寄せ */
#avatar-upload-form .upload-section{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  margin: 25px 0 18px;
}

/* ネイティブ file を視覚的に隠す（アクセシブル） */
#avatar-upload-form .upload-section input[type="file"]{
  position:absolute !important; width:1px; height:1px; margin:-1px; padding:0; border:0;
  clip: rect(0 0 0 0); clip-path: inset(50%); overflow:hidden; white-space:nowrap;
}

/* ラベル＝ピル型ボタン（絶対配置は使わない） */
#avatar-upload-form .upload-section label[for="avatar-file"]{
  appearance:none;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:44px; min-width:280px; padding:0 18px;
  background:var(--mc-accent); color:#fff; border:0; border-radius:9999px;
  font-weight:700; letter-spacing:.02em; cursor:pointer;
  box-shadow:0 8px 16px rgba(255,106,149,.22);
  transition:transform .12s ease, filter .12s ease;
  white-space:nowrap;                     /* 折り返し禁止 */
  writing-mode: horizontal-tb !important; /* 縦書き化の予防 */
  -webkit-writing-mode: horizontal-tb !important;
  font-size:0;                            /* 元テキストだけ消す */
}
#avatar-upload-form .upload-section label[for="avatar-file"]::before{
  content:"＋"; font-size:16px; line-height:1;
}
#avatar-upload-form .upload-section label[for="avatar-file"]::after{
  content:"新しい画像のアップロード"; font-size:14px; line-height:1;
}
#avatar-upload-form .upload-section label[for="avatar-file"]:hover{
  filter:brightness(1.03); transform:translateY(-1px);
}

/* 注意書き */
#avatar-upload-form .upload-section small{
  display:block; text-align:center; font-size:12px; color:var(--mc-muted);
}

/* モバイル微調整 */
@media (max-width:560px){
  .profile-avatar-container .current-avatar-display{ width:120px; height:120px; outline-width:5px; }
  #avatar-upload-form .upload-section label[for="avatar-file"]{ min-width:240px; height:42px; }
}

/* ===== MamaCollege | SWPMプロフィール編集の枠統一 ===== */
#swpm-editprofile-form{
  --mc-card:#fff;
  --mc-border:#f3a8b6;  /* 外枠ピンク */
  --mc-sep:#f6c9d3;     /* 入力枠/仕切り線ピンク */
  --mc-text:#5f4f54;
  --mc-muted:#96898d;
}

/* フォームのカード外観（必要ならそのまま） */
#swpm-editprofile-form{
  max-width: 980px;
  margin: 20px auto 28px;
  background: var(--mc-card);
  border: 2px solid var(--mc-border);
  border-radius: 24px;
  padding: 22px 20px;
  box-shadow: 0 8px 16px rgba(255,153,170,.08);
}

/* テーブルの基本整形 */
#swpm-editprofile-form table{ width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; }
#swpm-editprofile-form tr{ border:0 !important; }
#swpm-editprofile-form td{ vertical-align:middle; padding:12px 16px; box-sizing:border-box; }

/* 左のラベル列＋縦の仕切り線 */
#swpm-editprofile-form td:first-child{
  width: 230px;
  color: var(--mc-text);
  font-weight: 700;
  white-space: nowrap;
  border-right: 2px solid var(--mc-sep);
  padding-left: 10px;
}

/* 右の値列（基本余白） */
#swpm-editprofile-form td:last-child{ padding-left:18px; }

/* 1) 入力系はピンク枠で統一（!importantで勝たせる） */
#swpm-editprofile-form td:last-child
  input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]),
#swpm-editprofile-form td:last-child select,
#swpm-editprofile-form td:last-child textarea{
  width:100%;
  height:44px;
  padding:0 14px;
  border:2px solid var(--mc-sep) !important;
  border-radius:10px;
  background:#fff;
  color:var(--mc-text);
  font-size:14px;
  box-shadow:none !important;
  outline: none;
}
#swpm-editprofile-form td:last-child textarea{
  height:120px; padding-top:10px; padding-bottom:10px;
}
/* 各種 type を念のためカバー */
#swpm-editprofile-form td:last-child input[type="date"],
#swpm-editprofile-form td:last-child input[type="number"],
#swpm-editprofile-form td:last-child input[type="tel"],
#swpm-editprofile-form td:last-child input[type="email"],
#swpm-editprofile-form td:last-child input[type="password"],
#swpm-editprofile-form td:last-child input[type="text"]{
  border:2px solid var(--mc-sep) !important;
  border-radius:10px;
}
/* autofill時の背景色上書き */
#swpm-editprofile-form td:last-child input:-webkit-autofill{
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color: var(--mc-text) !important;
  border:2px solid var(--mc-sep) !important;
}

/* 2) “テキストだけ”のセルにも同じ見た目のボックスを付ける
   （input/select/textarea が無い値セルを検出して装飾）
   ※ :has() は主要ブラウザで利用可 */
#swpm-editprofile-form td:last-child:not(:has(input,select,textarea)){
  min-height:44px;
  display:block;              /* ボックス化して高さを揃える */
}


/* フォーカス表現（優しいグロー） */
#swpm-editprofile-form td:last-child input:focus,
#swpm-editprofile-form td:last-child select:focus,
#swpm-editprofile-form td:last-child textarea:focus{
  border-color:#f09ab0 !important;
  box-shadow:0 0 0 3px rgba(255,106,149,.15);
  outline:none;
}

@media (max-width:760px){
  #swpm-editprofile-form td:first-child{
    width: 195px;
    padding-left: 0px;
  }
  #swpm-editprofile-form{
    padding: 15px 10px;
  }
}

/* スマホは縦積みに */
@media (max-width:640px){
  #swpm-editprofile-form{ border-radius:18px;  }
  #swpm-editprofile-form table, #swpm-editprofile-form tbody, #swpm-editprofile-form tr, #swpm-editprofile-form td{
    display:block; width:100%;
  }
  #swpm-editprofile-form td:first-child{ border-right:0; padding:10px 2px 6px; width:100%; }
  #swpm-editprofile-form td:last-child{ padding:0 2px 12px; }
}

/* ====== 統一変数（高さ/角丸/インセット） ====== */
#swpm-editprofile-form{
  --field-gutter: 16px;   /* 外枠からの左右インセット */
  --field-h: 44px;        /* 入力と値ボックスの高さ */
  --field-radius: 12px;   /* 角丸（有料会員もこれに統一） */
  --mc-sep: #f6c9d3;
  --mc-text:#5f4f54;
  --mc-muted:#96898d;
}

/* 入力系：位置/高さ/角丸を統一 */
#swpm-editprofile-form td:last-child input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]),
#swpm-editprofile-form td:last-child select,
#swpm-editprofile-form td:last-child textarea{
  display:block;
  width: calc(100% - var(--field-gutter) * 2);
  margin: 0 var(--field-gutter);
  height: var(--field-h);
  padding: 0 14px;
  border: 2px solid var(--mc-sep) !important;
  border-radius: var(--field-radius);
  background:#fff;
  color:var(--mc-text);
  font-size:14px;
  box-shadow:none !important;
  outline:none;
}
#swpm-editprofile-form td:last-child textarea{
  padding-top:10px; padding-bottom:10px;
}



/* 中身が空の時は “—” を中央に表示（行は消さない） */
#swpm-editprofile-form td:last-child:empty::before{
  content: "—";
  color: var(--mc-muted);
}

/* 有料会員：小さめのまま角丸を統一（ピル形をやめて違和感解消） */
#swpm-editprofile-form tr.swpm-profile-membership-level-row td:last-child{
  display: inline-flex !important;
  align-items: center; justify-content: center;
  height: var(--field-h);
  padding: 0 14px !important;
  margin: 0 var(--field-gutter);
  min-width: 120px;                  /* 小さめのまま */
  border: 2px solid var(--mc-sep) !important;
  border-radius: var(--field-radius) !important;  /* ← 入力と同じ半径に */
  background:#fff;
  color: var(--mc-text);
  font-size:14px; font-weight:700;
  line-height: normal;
  box-sizing: border-box;
}

#swpm-editprofile-form td:last-child:empty::before{
  content: "—";
  color: var(--mc-muted);
}

/* === SWPM プロフィール：横幅のズレを完全に揃える === */

/* ガター等の共通変数（あなたの値に合わせて） */
#swpm-editprofile-form{
  --field-gutter: 16px;   /* 左右のインセット */
  --field-h: 44px;
  --field-radius: 12px;
}

/* テーブルの余白をリセット（右側セルの 18px を打ち消す） */
#swpm-editprofile-form table{ width:100%; border-collapse:separate; border-spacing:0; }
#swpm-editprofile-form td{ padding:12px 0; box-sizing:border-box; }
#swpm-editprofile-form td:last-child{ padding-left:0 !important; }  /* ←これが一番大事 */

/* 入力系はすべて同じ幅・位置に */
#swpm-editprofile-form td:last-child
  input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]),
#swpm-editprofile-form td:last-child select,
#swpm-editprofile-form td:last-child textarea{
  display:block;
  width: calc(100% - var(--field-gutter) * 2) !important;
  margin: 0 var(--field-gutter) !important;
  height: var(--field-h);
  box-sizing: border-box;
  border-radius: var(--field-radius);
}

/* type 指定の違いでも同じ幅になるよう明示 */
#swpm-editprofile-form td:last-child input[type="text"],
#swpm-editprofile-form td:last-child input[type="email"],
#swpm-editprofile-form td:last-child input[type="password"],
#swpm-editprofile-form td:last-child input[type="tel"],
#swpm-editprofile-form td:last-child input[type="number"],
#swpm-editprofile-form td:last-child input[type="date"]{
  width: calc(100% - var(--field-gutter) * 2) !important;
  margin: 0 var(--field-gutter) !important;
}

/* “テキストだけ”の行（— など）も入力と同じ幅・位置に */
#swpm-editprofile-form td:last-child:not(:has(input,select,textarea)){
  width: calc(100% - var(--field-gutter) * 2);
  margin: 0 var(--field-gutter);
  height: var(--field-h);
  padding: 8px 14px !important; /* 内側の余白も揃える */
  display: flex;
  align-items: center;
  box-sizing: border-box;
  border: 2px solid var(--mc-sep, #f6c9d3);
  border-radius: var(--field-radius);
  background:#fff;
  color: var(--mc-text, #5f4f54);
}
#swpm-editprofile-form td:last-child:empty::before{
  content: "—";
  color: var(--mc-muted, #96898d);
}

/* 備考の <small> や改行 <br> もボックスと同じインセットに揃える */
#swpm-editprofile-form td:last-child small{
  display:block;
  margin: 0px 0 0 var(--field-gutter);
  color: var(--mc-muted, #96898d);
}
#swpm-editprofile-form td:last-child br{ display:none; } /* レイアウトのズレ防止（必要なら） */







/* ===== MamaCollege: 動画検索UI（参考デザイン化） ===== */
.mama-video-gallery .video-search-section{
  --mc-card:#fff;
  --mc-bg:#ffe2e8;
  --mc-border:#f6c9d3;
  --mc-accent:#ff6a95;
  --mc-text:#5f4f54;
  --mc-muted:#96898d;
}

/* 大きな白ピル枠（検索コンテナ） */
.mama-video-gallery .video-search-section .search-container{
  background:#fff;
  border:2px solid var(--mc-border);
  border-radius: 55px;
  padding: 14px 18px 16px;
  box-shadow: 0 10px 18px rgba(255,153,170,.10);
  max-width: 1080px;
  margin: 0 auto 18px;
}

/* 上部の検索方式（ラジオ＆お気に入り） */
.mama-video-gallery .video-search-section .search-type-selector{
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  padding: 2px 2px 8px;
  color: var(--mc-text);
  font-weight:700;
}

/* ラジオ／チェックの共通トークン */
.mama-video-gallery .video-search-section .search-type-option{
  display:inline-flex; align-items:center; gap:8px;
  padding: 6px 10px;
  border-radius: 999px;
}
.mama-video-gallery .video-search-section .search-type-option input{
  accent-color: var(--mc-accent); /* まずは素直に */
  appearance: none;
  width: 16px; height: 16px;
  border: 2px solid var(--mc-accent);
  border-radius: 50%;
  position: relative;
  background:#fff;
}
.mama-video-gallery .video-search-section .search-type-option input[type="radio"]:checked::after{
  content:""; position:absolute; inset:3px; border-radius:50%; background:var(--mc-accent);
}
.mama-video-gallery .video-search-section .search-type-option input[type="checkbox"]{
  border-radius:6px; /* チェックは角丸四角 */
}
.mama-video-gallery .video-search-section .favorites-option{
  background: #ffeef4;
  border: 2px solid var(--mc-border);
}
.mama-video-gallery .video-search-section .favorites-option span::before{
  content:"♡"; margin-right:6px; color: var(--mc-accent); font-weight:900;
}
.mama-video-gallery .video-search-section .favorites-option input:checked + span::before{
  content:"♥";
}

/* 検索ボックス行（セレクト＋ボタン） */
.mama-video-gallery .video-search-section .search-box{
  display:flex; align-items:center; gap:10px;
  margin-top: 2px;
}

/* セレクトを“入力風”に（左に🔍アイコンの余白） */
.mama-video-gallery .video-search-section .video-search-input,
.mama-video-gallery .video-search-section .category-select{
  flex: 1 1 auto;
  height: 48px;
  padding: 0 14px 0 40px;          /* ← アイコン分の左余白 */
  border: 2px solid var(--mc-border);
  border-radius: 14px;
  background:#fff;
  color: var(--mc-text);
  font-size: 14px;
  outline: none;
  box-shadow: none;
  appearance: none;                 /* OSデフォルトを抑える */
  background-image:
    linear-gradient(45deg, transparent 50%, var(--mc-muted) 50%),
    linear-gradient(135deg, var(--mc-muted) 50%, transparent 50%); /* ▼ を自作 */
  background-position:
    calc(100% - 18px) 20px,
    calc(100% - 13px) 20px;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  position: relative;
}

/* 入力左の🔍アイコン（疑似要素で） */
.mama-video-gallery .video-search-section .search-box{ position: relative; }
.mama-video-gallery .video-search-section .search-box::before{
  content:"🔍";
  position:absolute; left:12px; top:50%; transform:translateY(-50%);
  font-size:16px; line-height:1;
  pointer-events:none;
  opacity:.9;
}

/* 検索ボタン（ピンクのピル） */
.mama-video-gallery .video-search-section .search-button{
  height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--mc-accent);
  color: #fff;
  font-weight: 800;
  border: 0;
  display: inline-flex; align-items: center; gap: 6px;
  box-shadow: 0 8px 16px rgba(255,106,149,.22);
  transition: transform .12s ease, filter .12s ease;
}
.mama-video-gallery .video-search-section .search-button:hover{
  filter: brightness(1.03); transform: translateY(-1px);
}
.mama-video-gallery .video-search-section .search-button img{ width:18px; height:18px; }

/* セクション見出し（フォルダアイコン風の余白が合うよう軽く） */
.mama-video-gallery .video-search-section + .video-list-section .section-title{
  color: var(--mc-text);
  font-weight: 800;
}

/* スマホ最適化 */
@media (max-width: 640px){
  .mama-video-gallery .video-search-section .search-container{
    border-radius: 22px; padding: 12px 12px 14px;
  }
  .mama-video-gallery .video-search-section .search-type-selector{
    gap:12px;
  }
  .mama-video-gallery .video-search-section .video-search-input,
  .mama-video-gallery .video-search-section .category-select{
    height: 46px;
  }
  .mama-video-gallery .video-search-section .search-button{ height: 40px; }
}



/* ===== 動画カテゴリ見出し：参考デザイン化 ===== */
.category-section .category-header{
  display:flex;justify-content:space-between;
  gap: 12px; margin: 18px 0 10px;
}
.category-section .category-title{
  position: relative;
  display: inline-flex; align-items:center; gap: 10px;
  font-weight: 800; color: #f06a83;   /* 見出しの赤みピンク */
  line-height: 1.2;
}

/* 共通：カテゴリー見出しアイコンを大きめに */
.category-section .category-title .category-icon{
  display:inline-block;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  margin-right: 8px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  color: transparent !important;   /* 絵文字の残像消し */
  font-size: 0 !important;
  line-height: 0;
}

/* デスクトップはさらに一段大きく */
@media (min-width: 768px){
  .category-section .category-title .category-icon{
    width: 42px;
    height: 42px;
    flex-basis: 42px;
  }
}

/* ▼ slug別の微調整（data-category の値に合わせて調整） */
/* 「NEW」は横長なので高さを低め・幅広に */
.category-section[data-category="new"] .category-title .category-icon{
  width: 56px;
  height: 28px;
  flex-basis: 56px;
}

/* 「お気に入り」は正方形のハート */
.category-section[data-category="favorites"] .category-title .category-icon{
  width: 36px;
  height: 36px;
  flex-basis: 36px;
}

/* モバイルでの微調整（大きすぎたらここで抑える） */
@media (max-width: 480px){
  .category-section[data-category="new"] .category-title .category-icon{
    width: 48px; height: 24px; flex-basis: 48px;
  }
  .category-section[data-category="favorites"] .category-title .category-icon{
    width: 32px; height: 32px; flex-basis: 32px;
  }
}

/* 見出しテキスト（ブラシ下線を足す） */
.category-section .category-title .title-text{
  position: relative; z-index: 0;
  display:inline-block; padding: 4px 6px 6px 4px;
}
.category-section .category-title .title-text::after{
  content:"";
  position:absolute; left: 0; right: 0;
  bottom: -2.0em;
  height: 5em;
  width: auto;
  background: url('assets/img/line-back.png') no-repeat left bottom / 100% 100%;
  z-index: -1; opacity: .95;
}

/* 本数 (○本) は色を控えめに */
.category-section .category-title .video-count{
  margin-left: 6px; 
  font-weight: 700; 
  color:#f090a3; 
  font-size: .9em;
  display: none;
}

/* 「すべて見る」リンク */
.category-section .view-all-link{
  color:#ff6a95; font-weight:700; text-decoration:none;
}
.category-section .view-all-link:hover{ text-decoration:underline; }

/* 余白を少し詰める（セクション間） */
.category-section{ margin-bottom: 0px; }

/* 強いセレクタ + !important で確実に上書き */
.mama-video-gallery .category-section .category-header .category-title .category-icon{
  display:inline-block ;
  width:42px !important;           /* 共通のデフォルトサイズ */
  height:42px !important;
  flex:0 0 42px !important;
  margin-right:-3px;
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  color:transparent !important;    /* 絵文字の残像消し */
  font-size:0 !important;
  line-height:0;
}

/* NEW は横長アイコン */
.category-section[data-category="new"] .category-title .category-icon{
  width:56px !important;
  height:28px !important;
  flex-basis:56px !important;
}

/* お気に入りは正方形 */
.category-section[data-category="favorites"] .category-title .category-icon{
  width:38px !important;
  height:38px !important;
  flex-basis:38px !important;
}

/* モバイルで少しだけ抑えたい場合 */
@media (max-width:480px){
  .category-section[data-category="new"] .category-title .category-icon{
    width:48px !important; height:24px !important; flex-basis:48px !important;
  }
  .category-section[data-category="favorites"] .category-title .category-icon{
    width:32px !important; height:32px !important; flex-basis:32px !important;
  }
}

/* ヘッダー全体 */
.video-sec-header{ position:relative; margin:0 0 10px; }

/* タイトル＋件数（筆はタイトルの背面に） */
.video-sec-title{
  position:relative; z-index:1;
  margin:0; font-size:25px; font-weight:700; line-height:1.2;
  display:inline-flex; align-items:baseline; gap:.5em;
  padding-bottom:6px; /* 筆の分だけ少し下げる */
  color: #EB6161;
}
.video-sec-title::after{
  content:""; position:absolute; left:0; right:0;
  bottom:-0.2em; height:1.0em; /* 筆の太さ */
  background:url('assets/img/line-back2.png') no-repeat left bottom / 100% 100%;
  z-index:-1; pointer-events:none;
}

/* 件数の見た目 */
.video-sec-count{
  color:#eb6161; font-weight:800; font-size:.8em; /* タイトルより少し小さく */
}

/* サブタイトル */
.video-sec-sub{ margin:0; font-size:14px; opacity:.9; }

@media(max-width:450px){
  .swpm-email-value{ font-size:10px; }
  .swpm-email-note{ font-size:7px; margin-left: 4px;}
}

/* ===== Rewards - containerは既存のまま利用 ===== */
/* タイトルの筆（任意） */
.reward-records-title{
  position:relative; text-align:center; margin: 0 0 14px;
  font-weight:800; color:#f06a83;
}
.reward-records-title::after{
  content:""; position:absolute; left:50%; transform:translateX(-50%);
  bottom:-0.5em; width: 240px; height: 16px;
  background: url('assets/img/line-back.png') no-repeat center/100% 100%;
  pointer-events:none;
}

/* 共通ボックス（白面＋ピンク枠＋丸み） */
.reward-box{
  position:relative; isolation:isolate;
  background:#fff; border:2px solid #f3a8b6; border-radius:28px;
  padding: 22px 20px; margin: 18px auto; max-width: 980px;
  box-shadow: 0 8px 16px rgba(255,153,170,.08);
}

/* 内側の淡い内枠（参考画像の“ふち”感） */
.reward-box::after{
  content:""; position:absolute; inset:6px; border:1px solid #ffe6ec;
  border-radius:20px; pointer-events:none;
}

/* ① 合計 */
.reward-total{ text-align:center; }
.reward-total-label{ font-size:14px; color:#8b5e3c; opacity:.9; margin-bottom:4px; }
.reward-total-num{
  font-size:56px; line-height:1; font-weight:800; color:#eb6161; letter-spacing:.02em;
}

/* ② / ③ セクション見出し */
.reward-box-title{
  text-align:center; margin: 0 0 16px;
  color:#f06a83; font-weight:800;
}

/* リスト共通 */
.reward-list{ list-style:none; margin:0; padding:0 10px; }
.reward-list li{
  display:flex; align-items:center; gap:10px;
  padding: 12px 10px; border-bottom:1px solid #f6c9d3;
}
.reward-list li:last-child{ border-bottom:0; }

/* アップロード行 */
.reward-list-label{ color:#8b5e3c; }
.reward-list-value{ text-decoration: underline; text-underline-offset: 2px; }

/* プレゼント行 */
.gift-icon{ font-size:22px; line-height:1; }
.gift-text{ color:#5f4f54; }

/* もっと見るボタン */
.reward-more-btn{
  display:block; margin: 16px auto 0; padding:10px 26px;
  border:0; border-radius:999px; background:#eb6161; color:#fff; font-weight:700;
  box-shadow: 0 6px 14px rgba(235,97,97,.22);
  cursor:pointer;
}
.reward-more-btn:hover{ filter:brightness(1.05); }

/* 折りたたみ（初期は2件だけ表示） */
.upload-list.is-collapsed li:nth-child(n+3){ display:none; }
.upload-list.is-open li{ display:flex; }

/* 空表示 */
.reward-empty{ text-align:center; color:#96898d; margin:8px 0 0; }

/* スマホ微調整 */
@media (max-width: 480px){
  .reward-total-num{ font-size:48px; }
  .reward-list li{ padding:10px 6px; }
}



/* 共通：見出しブロック */

.event-header{
  position: relative;
  margin: 14px 0 30px;
  overflow: visible;                 /* 下にハミ出す筆を見せる */
}
.news-header{
  position: relative;
  margin: 28px 0 35px;
  overflow: visible;                 /* 下にハミ出す筆を見せる */
}

/* 見出しテキスト（テキストを最前面に） */
.news-header h2,
.event-header h2{
  position: relative;
  z-index: 1;                        /* ← テキストが最前面 */
  display: inline-flex;
  align-items: center;
  padding-left: 46px;                /* アイコンぶんのスペース */
  gap: 10px;
  font-weight: 800;
  color: #f06a83 !important;
  line-height: 1.2;
}

/* 左アイコン */
.news-header h2::before,
.event-header h2::before{
  content:"";
  position: absolute;
  left: 0; top: 50%;
  transform: translateY(-50%);
  width: 36px; height: 36px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

/* ニュース（メガホン） */
.news-header h2::before{
  background-image: url('assets/img/news4.png');   /* パスは style.css からの相対 */
}

/* イベント（カレンダー） */
.event-header h2::before{
  background-image: url('assets/img/schedule-icon.png');
}

/* 筆の下線（テキストの背面に） */
.news-header h2::after,
.event-header h2::after{
  content:"";
  position: absolute;
  left: 46px;                       /* アイコン分だけ右から開始 */
  right: 0;
  bottom: -2.4em;
  height: 5em;
  width: auto;                /* 少し下に置いて太めに見せる */                 /* 筆の“太さ”。1.0–1.2em で微調整 */
  background: url('assets/img/line-back.png') no-repeat left bottom / 100% 100%;
  z-index: -1;                       /* ← テキスト(z-index:1)の背面 */
  pointer-events: none;
}

/* スマホで少しだけ縮小 */
@media (max-width: 480px){
  .news-header h2,
  .event-header h2{ padding-left: 40px; }
  .news-header h2::before,
  .event-header h2::before{ width: 30px; height: 30px; }
}





/*functionの中を上書き*/
.dashboard-container{
  background: transparent !important;
}

.dashboard-section {
    background: transparent !important;
}

.section-header{
  margin-top: 0px !important;
}

.action-guide-section{
  background: transparent !important;
}

.profile-avatar-container{
  background: transparent !important;
  border: none !important;
}

.page-id-15 table, td, th {
    border: 0px solid var(--ast-border-color);
}

.search-type-option.favorites-option{
  display: none !important;
}

.search-type-selector{
  margin-bottom: 5px !important;
}

.amazon-layout .video-search-section.compact{
  background: transparent !important;
  box-shadow: none !important;
  margin-bottom: 0px !important;
}
.search-type-option{
  color:#eb6161 !important;
}
.search-type-option input[type="radio"]:checked + span, .search-type-option input[type="checkbox"]:checked + span{
    color: #eb6161 !important;
    font-weight: 500;
    text-shadow: none !important;
}

.video-categories-container{
  gap: 0px !important;
}

.amazon-layout{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.category-section{
  background: transparent !important;
  border: none !important;
}

.video-slider-container{
  background: transparent !important;
}
@media (max-width: 767px){
  .video-slider-container{
    padding: 0px !important;
  }
  
}

.news-container{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.event-tag{
  color: #fff !important;
}

.slider-container{
  padding: 0 10px 10px 10px !important;
}

.action-guide-title{
  color: #eb6161 !important;
}

.page-id-9 .action-guide-section{
  background: #fff !important;
}

.page-id-9 .community-list{
  margin-bottom: 20px !important;
}

.page-id-9 .section-icon{
  margin-right: 0px !important;
}

#thread-category{
  padding: 0px !important;
}
.page-id-15 .slider-layout{
  background: transparent !important; 
  box-shadow: none !important;
  border: none !important;
}

@media (max-width: 768px) {
    .news-item-summary {
        flex-direction: row !important;
        align-items: flex-start;
        gap: 15px !important;
        padding: 20px !important;
        font-size: 12px !important;
    }
}
@media (max-width: 540px) {
    .news-item-summary {
        align-items: flex-start;
        gap: 10px !important;
        padding: 13px !important;
        font-size: 10px !important;
    }
  
}

@media (max-width: 768px) {
    .news-container {
        margin: 20px auto;
        padding: 0px !important;
    }
}

/* お知らせリスト：日付とタイトルを縦方向中央に */
.news-list .news-item-summary{
  align-items: center !important;     /* ← 親行の縦中央 */
}

/* 念のため各要素自体も flex 化して中央寄せに */
.news-list .news-item-summary .news-date,
.news-list .news-item-summary .news-title,
.news-list .news-item-summary .news-category-badge,
.news-list .news-item-summary .toggle-icon{
  display: flex !important;
  align-items: center !important;
}

/* 文字の行高で“上に寄って見える”のを防止（必要なら） */
.news-list .news-item-summary .news-date,
.news-list .news-item-summary .news-title{
  line-height: 1.4;
}

.news-item{
  border: 1px solid #eb6161 !important;
}

/* 見出しの親を横中央寄せ */
.page-id-18 .event-header, .page-id-18 .news-header{
  display: flex !important;
  justify-content: center !important;        /* ← 中央に */
}

/* h2 自体は内容幅にして中央へ */
.page-id-18 .event-header h2, .page-id-18 .news-header h2{
  margin: 0;                      /* 既存と同じ */
  width: fit-content !important;             /* 内容幅ちょうど */
  display: inline-flex !important;           /* 既存の inline-flex を維持 */
  align-items: center !important;
  /* 既存の padding-left:46px; などはそのままでOK */
}

/* Stripeボタンの上書き */
.stripe-button-el {
  background: #eb6161 !important;  /* 登録ボタンと同じ赤 */
  border: 1px solid #eb6161 !important;
  border-radius: 4px !important;     /* 角丸をなくす */
  box-shadow: none !important;
  display: inline-block;
}

.stripe-button-el span {
  display: inline-block !important;
  background: none !important;     /* デフォルトのグラデーションを消す */
  color: #fff !important;
  font-size: 14px !important;
  font-weight: normal !important;
  text-shadow: none !important;
  height: auto !important;
  line-height: 1.4 !important;
  padding: 8px 20px !important;    /* 登録ボタンと同じくらいの余白 */
  border-radius: 4px !important;
  box-shadow: none !important;
}

.page-id-23 #content.site-content{
  --mc-top: 0px !important;  
}