/* マシュマロセレクト 基本スタイル(色はここの変数で調整できます) */
:root {
	--mm-pink: #f27ba0;
	--mm-pink-soft: #fdeef3;
	--mm-cream: #fffaf6;
	--mm-text: #3d3438;
	--mm-muted: #8a7f84;
	--mm-sale: #e2445c;
	--mm-down: #2b8a5a;
	--mm-radius: 14px;
	--mm-lv1: #fbd3df;
	--mm-lv2: #f7a9c0;
	--mm-lv3: #ee7fa1;
	--mm-lv4: #d9577f;
}

/* ---- セクション見出し ---- */
.mm-section { margin: 2.5em 0; }
.mm-section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1em; margin-bottom: 1em; }
.mm-section__title { margin: 0 !important; font-size: 1.25em; }
.mm-section__more { font-size: .9em; color: var(--mm-pink); white-space: nowrap; }
.mm-section__more::after { content: " ›"; }
.mm-empty { color: var(--mm-muted); }

/* ---- 作品カード ---- */
.mm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 16px; }
.mm-card { display: flex; flex-direction: column; background: #fff; border-radius: var(--mm-radius); box-shadow: 0 2px 10px rgba(217, 87, 127, .1); overflow: hidden; }
.mm-card__thumb { position: relative; display: block; aspect-ratio: 800 / 538; background: var(--mm-pink-soft); overflow: hidden; }
.mm-card__thumb img { width: 100%; height: 100%; object-fit: cover; object-position: right center; display: block; }
.mm-card__badges { position: absolute; left: 6px; top: 6px; display: flex; flex-wrap: wrap; gap: 4px; }
.mm-card__body { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px 12px; flex: 1; }
.mm-card__title { margin: 0 !important; padding: 0 !important; font-size: .85em !important; line-height: 1.45; font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; border: 0 !important; background: none !important; }
.mm-card__title::before, .mm-card__title::after { display: none !important; }
.mm-card__title a { color: var(--mm-text); text-decoration: none; }
.mm-card__comment { margin: 0; font-size: .78em; color: var(--mm-muted); }
.mm-card__meta { display: flex; justify-content: space-between; gap: 6px; font-size: .75em; color: var(--mm-muted); }
.mm-card__end { color: var(--mm-sale); }
.mm-card__buy { margin-top: auto; display: block; text-align: center; padding: 7px; border-radius: 999px; background: var(--mm-pink-soft); color: var(--mm-pink); font-size: .8em; font-weight: 700; text-decoration: none; }
.mm-card__buy:hover { background: var(--mm-pink); color: #fff; }

/* ---- バッジ ---- */
.mm-badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; line-height: 1.6; color: #fff; }
.mm-badge--off { background: var(--mm-sale); }
.mm-badge--level { color: var(--mm-text); }
.mm-lv-1.mm-badge--level { background: var(--mm-lv1); }
.mm-lv-2.mm-badge--level { background: var(--mm-lv2); }
.mm-lv-3.mm-badge--level { background: var(--mm-lv3); color: #fff; }
.mm-lv-4.mm-badge--level { background: var(--mm-lv4); color: #fff; }

/* ---- 価格 ---- */
.mm-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; }
.mm-price__list { color: var(--mm-muted); font-size: .8em; }
.mm-price__now { font-weight: 800; color: var(--mm-text); }
.mm-price__now.is-sale { color: var(--mm-sale); }
.mm-price__diff { font-size: .75em; font-weight: 700; }
.mm-price__diff.is-down { color: var(--mm-down); }
.mm-price__diff.is-up { color: var(--mm-muted); }
.mm-price--large .mm-price__now { font-size: 1.8em; }
.mm-stars { color: #e8a317; }
.mm-stars small { color: var(--mm-muted); }

/* ---- トップの数字 ---- */
.mm-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 1.5em 0; }
.mm-stats__item { background: #fff; border-radius: var(--mm-radius); padding: 14px 8px; text-align: center; box-shadow: 0 2px 10px rgba(217, 87, 127, .1); }
.mm-stats__num { display: block; font-size: 1.6em; font-weight: 800; color: var(--mm-pink); line-height: 1.2; }
.mm-stats__num--small { font-size: 1.1em; padding: .25em 0; }
.mm-stats__label { font-size: .75em; color: var(--mm-muted); }
@media (max-width: 600px) { .mm-stats { grid-template-columns: repeat(2, 1fr); } }

/* ---- マシュマロ度ボタン ---- */
.mm-levels { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 1.5em 0; }
.mm-levels__btn { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 16px 8px; border-radius: 24px; text-decoration: none; color: var(--mm-text); transition: transform .15s; }
.mm-levels__btn:hover { transform: translateY(-2px); }
.mm-levels__btn.mm-lv-1 { background: var(--mm-lv1); }
.mm-levels__btn.mm-lv-2 { background: var(--mm-lv2); }
.mm-levels__btn.mm-lv-3 { background: var(--mm-lv3); color: #fff; }
.mm-levels__btn.mm-lv-4 { background: var(--mm-lv4); color: #fff; }
.mm-levels__num { font-size: 1.8em; font-weight: 800; line-height: 1; }
.mm-levels__name { font-weight: 700; }
.mm-levels__guide, .mm-levels__count { font-size: .75em; opacity: .85; }
@media (max-width: 600px) { .mm-levels { grid-template-columns: repeat(2, 1fr); } }

/* ---- 作品ページ ---- */
.mm-pr { display: inline-block; margin: 0 0 1em; padding: 2px 10px; border-radius: 4px; background: #f3f0f1; color: var(--mm-muted); font-size: .75em; }
.mm-item__hero { display: grid; grid-template-columns: 3fr 2fr; gap: 20px; align-items: start; margin-bottom: 1.5em; }
.mm-item__image img { width: 100%; height: auto; border-radius: var(--mm-radius); }
@media (max-width: 760px) { .mm-item__hero { grid-template-columns: 1fr; } }
.mm-item__level { display: flex; flex-direction: column; margin: 0 0 .8em; padding: 10px 14px; border-radius: var(--mm-radius); }
.mm-item__level.mm-lv-1 { background: var(--mm-lv1); }
.mm-item__level.mm-lv-2 { background: var(--mm-lv2); }
.mm-item__level.mm-lv-3 { background: var(--mm-lv3); color: #fff; }
.mm-item__level.mm-lv-4 { background: var(--mm-lv4); color: #fff; }
.mm-item__level-num { font-weight: 800; font-size: 1.1em; }
.mm-item__level-name { font-size: .85em; }
.mm-item__comment { font-weight: 700; margin: 0 0 .8em; }

.mm-buy { padding: 14px; border-radius: var(--mm-radius); background: var(--mm-cream); border: 1px solid var(--mm-pink-soft); margin: 1em 0; }
.mm-buy__end { margin: .4em 0; font-size: .85em; color: var(--mm-sale); font-weight: 700; }
.mm-buy__btn { display: block; margin: .6em 0 .4em; padding: 14px; border-radius: 999px; background: var(--mm-pink); color: #fff !important; text-align: center; font-weight: 800; text-decoration: none; box-shadow: 0 4px 0 #d9577f; }
.mm-buy__btn:hover { opacity: .9; }
.mm-buy__note, .mm-buy__off { margin: 0; font-size: .75em; color: var(--mm-muted); }

.mm-review { padding: 16px 18px; border-radius: var(--mm-radius); background: var(--mm-pink-soft); margin: 1.5em 0; }
.mm-review__title { margin: 0 0 .5em !important; font-size: 1.1em !important; }
.mm-review__points { margin: 0 0 .6em; }
.mm-review__for { margin: 0; }

.mm-h { font-size: 1.15em !important; }
.mm-samples { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; }
.mm-samples img { width: 100%; height: auto; border-radius: 8px; display: block; }
.mm-chart { margin: 1em 0; color: var(--mm-pink); }
.mm-chart svg { width: 100%; height: auto; background: #fff; border-radius: var(--mm-radius); }
.mm-chart text { fill: var(--mm-muted); }
.mm-chart figcaption { font-size: .75em; color: var(--mm-muted); }
.mm-spec { width: 100%; font-size: .9em; }
.mm-spec th { width: 7em; white-space: nowrap; }

/* ---- 一覧ページ ---- */
.mm-archive__lead { color: var(--mm-muted); }
.mm-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin: 1em 0 1.5em; }
.mm-toolbar__item { padding: 5px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--mm-pink-soft); color: var(--mm-text); font-size: .85em; text-decoration: none; }
.mm-toolbar__item.is-active { background: var(--mm-pink); border-color: var(--mm-pink); color: #fff; }
.mm-toolbar__sale { margin-left: auto; }

/* ---- 表記・年齢確認 ---- */
.mm-disclaimer { max-width: 960px; margin: 0 auto; padding: 16px; font-size: 11px; color: var(--mm-muted); text-align: center; }
html.mm-age-open, html.mm-age-open body { overflow: hidden; }
.mm-age { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(255, 238, 243, .97); backdrop-filter: blur(8px); }
.mm-age[hidden] { display: none; }
.mm-age__box { max-width: 420px; width: 100%; padding: 32px 24px; border-radius: 24px; background: #fff; text-align: center; box-shadow: 0 10px 40px rgba(217, 87, 127, .2); }
.mm-age__logo { margin: 0; color: var(--mm-pink); font-weight: 800; }
.mm-age__title { margin: .3em 0 .6em !important; font-size: 1.3em !important; }
.mm-age__btns { display: flex; flex-direction: column; gap: 10px; margin-top: 1.2em; }
.mm-age__yes { padding: 14px; border: 0; border-radius: 999px; background: var(--mm-pink); color: #fff; font-weight: 800; font-size: 1em; cursor: pointer; }
.mm-age__no { color: var(--mm-muted); font-size: .85em; }

/* ---- 0.1.2：SWELLとの調整 ---- */
/* サンプル画像は同じ比率に切りそろえる */
.mm-samples a { display: block; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 8px; background: var(--mm-pink-soft); }
.mm-samples img { width: 100%; height: 100%; object-fit: cover; object-position: center top; border-radius: 0; }

/* 作品ページの見出しは、テーマの帯デザインを打ち消してピンクの線にする */
.post_content h2.mm-h,
.mm-item h2.mm-h,
.mm-review h2.mm-review__title {
	background: none !important;
	color: var(--mm-text) !important;
	border: 0 !important;
	border-left: 6px solid var(--mm-pink) !important;
	border-radius: 0 !important;
	padding: .2em 0 .2em .7em !important;
	margin: 2.2em 0 1em !important;
	font-size: 1.2em !important;
	box-shadow: none !important;
}
.mm-review h2.mm-review__title { margin-top: 0 !important; border-left-width: 5px !important; font-size: 1.1em !important; }
.post_content h2.mm-h::before, .post_content h2.mm-h::after,
.mm-item h2.mm-h::before, .mm-item h2.mm-h::after,
.mm-review h2.mm-review__title::before, .mm-review h2.mm-review__title::after { display: none !important; content: none !important; }

/* 作品データの表 */
.mm-spec th { background: var(--mm-pink-soft); }
.mm-spec a { color: var(--mm-pink); }

/* ---- 0.1.3：サイドバーではマシュマロ度ボタンを縦に並べる ---- */
.mm-levels__btn.is-current { outline: 3px solid var(--mm-text); outline-offset: 2px; }
.l-sidebar .mm-levels,
#sidebar .mm-levels,
.widget .mm-levels,
.l-footer .mm-levels { grid-template-columns: 1fr; gap: 8px; margin: 0; }
.l-sidebar .mm-levels__btn,
#sidebar .mm-levels__btn,
.widget .mm-levels__btn,
.l-footer .mm-levels__btn {
	display: grid;
	grid-template-columns: 2.2em 1fr auto;
	grid-template-areas: "num name count" "num guide count";
	align-items: center;
	column-gap: 10px;
	row-gap: 0;
	padding: 10px 16px;
	border-radius: 999px;
	text-align: left;
}
.l-sidebar .mm-levels__btn:hover, #sidebar .mm-levels__btn:hover, .widget .mm-levels__btn:hover { transform: translateX(3px); }
.l-sidebar .mm-levels__num, #sidebar .mm-levels__num, .widget .mm-levels__num, .l-footer .mm-levels__num { grid-area: num; font-size: 1.5em; text-align: center; }
.l-sidebar .mm-levels__name, #sidebar .mm-levels__name, .widget .mm-levels__name, .l-footer .mm-levels__name { grid-area: name; }
.l-sidebar .mm-levels__guide, #sidebar .mm-levels__guide, .widget .mm-levels__guide, .l-footer .mm-levels__guide { grid-area: guide; }
.l-sidebar .mm-levels__count, #sidebar .mm-levels__count, .widget .mm-levels__count, .l-footer .mm-levels__count { grid-area: count; white-space: nowrap; }

/* ---- 0.1.5：一覧の見出しもテーマの帯デザインを打ち消してピンクの線にする ---- */
.post_content h2.mm-section__title,
h2.mm-section__title {
	flex: 1;
	background: none !important;
	color: var(--mm-text) !important;
	border: 0 !important;
	border-left: 6px solid var(--mm-pink) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: .15em 0 .15em .7em !important;
	margin: 0 !important;
	font-size: 1.3em !important;
	line-height: 1.4 !important;
}
.post_content h2.mm-section__title::before, .post_content h2.mm-section__title::after,
h2.mm-section__title::before, h2.mm-section__title::after { display: none !important; content: none !important; }
/* 一覧の外に単独で置いた見出し(「マシュマロ度から選ぶ」など)の余白 */
.post_content > h2.mm-section__title, .mm-guide h2.mm-section__title { margin: 2.5em 0 1em !important; }
.mm-section__head { align-items: center; }

/* トップの見出し部分 */
.mm-top-hero { padding: 2.2em 2em; margin-bottom: 1.5em; border-radius: 24px; background: linear-gradient(135deg, var(--mm-pink-soft), #fff7ef); text-align: center; }
.post_content h1.mm-top-hero__title, h1.mm-top-hero__title { margin: 0 0 .5em !important; padding: 0 !important; background: none !important; border: 0 !important; font-size: 1.9em !important; line-height: 1.5 !important; color: var(--mm-text) !important; }
.mm-top-hero__title::before, .mm-top-hero__title::after { display: none !important; }
.mm-top-hero__lead { margin: 0 auto !important; max-width: 36em; color: var(--mm-muted); }
@media (max-width: 600px) {
	.mm-top-hero { padding: 1.6em 1.1em; }
	.post_content h1.mm-top-hero__title, h1.mm-top-hero__title { font-size: 1.35em !important; }
}
/* 「はじめての方へ」 */
.mm-guide { margin-top: 3em; padding: 0 1.5em 1.5em; border-radius: var(--mm-radius); background: var(--mm-cream); border: 1px solid var(--mm-pink-soft); }
.mm-guide h2.mm-section__title { margin-top: 1.5em !important; }

/* ---- 0.1.7：トップページ上部の余白を詰める ---- */
body.home .l-content { padding-top: 1.5em !important; }
body.home .post_content > .mm-top-hero:first-child,
body.home .post_content > *:first-child { margin-top: 0 !important; }
body.home .p-articleHead, body.home .c-pageTitle { display: none; }

/* ---- 0.1.8：DMM Webサービスのクレジット(画像は改変しない) ---- */
.mm-credit { margin: 8px 0 0; line-height: 1; }
.mm-credit img { display: inline-block; width: 135px; height: 17px; max-width: none; border: 0; border-radius: 0; box-shadow: none; filter: none; opacity: 1; }
