/* =========================================================
   Wacha Matome - base.css
   :root変数 / リセット / 基本タイポグラフィ /
   カード・アーカイブ・記事・固定ページ・404・Q&A・
   お気に入りパネル・ナビゲーション 等の共通コンポーネント。
   assets/css/style.css より前に読み込まれる。
   ========================================================= */

/* ---- カラー変数（functions.php の wacha_dynamic_css() で上書きされる） ---- */
:root{
	--wacha-primary:#FF6FA8;
	--wacha-primary-light:#FFB0CF;
	--wacha-primary-bg:#FFEBF3;
	--wacha-secondary:#B98CD9;
	--wacha-secondary-light:#D3BBE8;
	--wacha-secondary-bg:#F1E9F8;
	--wacha-bg:#FFF5F8;
	--wacha-text:#3D2B4E;
	--wacha-text-light:#9E95A7;
	--wacha-card-bg:#FFFFFF;
	--wacha-header-grad-start:#FFB6D5;
	--wacha-header-grad-end:#F5F0FF;
}

/* ---- リセット ---- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
	margin:0;
	font-family:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
	color:var(--wacha-text);
	background:var(--wacha-bg);
	line-height:1.7;
	font-size:15px;
	-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6,p,figure,dl,dd,blockquote{margin:0;}
ul,ol{margin:0;padding:0;list-style:none;}
a{color:var(--wacha-primary);text-decoration:none;}
img{max-width:100%;height:auto;vertical-align:bottom;}
button{font-family:inherit;cursor:pointer;}
input,textarea,select{font-family:inherit;}

/* ---- アクセシビリティ ---- */
.screen-reader-text{
	border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);
	width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
	position:absolute!important;white-space:nowrap;word-wrap:normal!important;
}
.skip-link{
	position:absolute;left:-9999px;top:0;z-index:9999;
	background:#fff;color:var(--wacha-primary);
	padding:10px 18px;border-radius:0 0 10px 0;font-weight:700;font-size:13px;
	box-shadow:0 2px 8px rgba(0,0,0,.2);
}
.skip-link:focus{left:0;}

/* ---- レイアウト土台 ---- */
.site-main{display:block;min-height:42vh;}

/* =========================================================
   ヘッダー：メニュートグル（ハンバーガー）
   ========================================================= */
.menu-toggle{
	display:flex;align-items:center;justify-content:center;
	flex:0 0 auto;
	width:42px;height:42px;
	background:none;border:0;border-radius:12px;
	color:#111;
}
.menu-toggle:hover{background:rgba(0,0,0,.06);}
.menu-toggle svg{width:24px;height:24px;}

/* ナビゲーション ドロワー */
.main-nav-drawer{
	position:fixed;left:0;top:0;z-index:300;
	width:min(320px,84vw);height:100vh;
	background:#fff;
	box-shadow:2px 0 24px rgba(61,43,78,.22);
	transform:translateX(-100%);
	transition:transform .28s ease;
	display:flex;flex-direction:column;
	overflow:hidden;
}
.main-nav-drawer.is-open{transform:translateX(0);}
/* hidden 属性が付いている間は通常通り display:none で完全に非表示にする
   （要素がフルスクリーンで残っていてクリックを吸わないように） */
.main-nav-drawer__head{
	display:flex;align-items:center;justify-content:space-between;
	padding:16px 18px;
	background:linear-gradient(135deg,var(--wacha-header-grad-start),var(--wacha-header-grad-end));
	flex:0 0 auto;
}
.main-nav-drawer__title{font-size:15px;font-weight:900;color:var(--wacha-text);}
.main-nav-drawer__close{
	width:34px;height:34px;border:0;border-radius:50%;
	background:rgba(255,255,255,.7);color:var(--wacha-text);
	font-size:20px;line-height:1;
	display:flex;align-items:center;justify-content:center;
}
.main-nav-drawer__body{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.main-nav__list{padding:6px 0;}
.main-nav__list li{border-bottom:1px solid var(--wacha-primary-bg);}
.main-nav__list a{
	display:block;
	padding:14px 20px;
	font-size:14px;font-weight:700;
	color:var(--wacha-text);
}
.main-nav__list a:hover{background:var(--wacha-primary-bg);color:var(--wacha-primary);}
.main-nav__list .sub-menu{background:var(--wacha-primary-bg);}
.main-nav__list .sub-menu a{padding-left:36px;font-weight:500;}

/* ドロワー用オーバーレイ */
.main-nav-overlay{
	position:fixed;inset:0;z-index:250;
	background:rgba(61,43,78,.45);
	opacity:0;transition:opacity .28s ease;
}
.main-nav-overlay.is-open{opacity:1;}
/* hidden=true のときは display:none（クリックを透過）。
   開く瞬間に JS が hidden=false にして直後 is-open を付ける → opacity が遷移する。 */

/* ヘッダーのツールボタン（お気に入り・閲覧履歴） */
.tool-btn{
	position:relative;
	background:none;border:0;
	text-decoration:none;
}
.tool-btn__badge{
	position:absolute;top:-4px;right:-2px;
	min-width:17px;height:17px;padding:0 4px;
	background:var(--wacha-primary);color:#fff;
	font-size:10px;font-weight:700;line-height:17px;
	border-radius:9px;text-align:center;
	box-shadow:0 1px 3px rgba(61,43,78,.3);
}

/* =========================================================
   汎用ボタン
   ========================================================= */
.wacha-btn{
	display:inline-flex;align-items:center;justify-content:center;gap:6px;
	padding:13px 28px;
	background:var(--wacha-primary);color:#fff;
	border:0;border-radius:30px;
	font-size:14px;font-weight:900;
	box-shadow:0 6px 16px rgba(255,111,168,.32);
}
.wacha-btn:hover{filter:brightness(1.04);}

/* =========================================================
   カードグリッド（アーカイブ・検索・一覧）
   ========================================================= */
.archive-section{
	max-width:1180px;margin:0 auto;
	padding:24px 14px 44px;
}
.archive-section__head{margin-bottom:20px;}
.archive-title{
	font-size:20px;font-weight:900;color:var(--wacha-text);
	line-height:1.4;
}
.archive-desc{font-size:13px;color:var(--wacha-text-light);margin-top:6px;}

.card-grid{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:14px;
}
@media(min-width:768px){
	.card-grid--3{grid-template-columns:repeat(3,1fr);}
}
@media(min-width:640px){
	.archive-section{padding-left:20px;padding-right:20px;}
}
@media(min-width:1200px){
	.archive-section{padding-left:48px;padding-right:48px;}
}

.card{
	position:relative;
	display:flex;flex-direction:column;
	background:var(--wacha-card-bg);
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 2px 12px rgba(185,140,217,.12);
	transition:transform .15s,box-shadow .15s;
}
.card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(185,140,217,.2);}
.card__media{
	position:relative;display:block;
	aspect-ratio:3/2;
	background:var(--wacha-primary-bg);
	overflow:hidden;line-height:0;
}
.card__media img{width:100%;height:100%;object-fit:cover;display:block;}
.card__tag{
	position:absolute;left:8px;top:8px;
	background:var(--wacha-primary);color:#fff;
	font-size:10px;font-weight:700;
	padding:3px 9px;border-radius:8px;
}
.card__body{padding:12px 12px 14px;display:flex;flex-direction:column;gap:8px;flex:1 1 auto;}
.card__title{font-size:13px;font-weight:700;line-height:1.5;}
.card__title a{color:var(--wacha-text);}
.card__title a:hover{color:var(--wacha-primary);}
.card__meta{
	display:flex;align-items:center;gap:8px;
	margin-top:auto;
	font-size:11px;color:var(--wacha-text-light);
}

/* カードのお気に入りハート（JSで注入） */
.wacha-fav{
	position:absolute;right:8px;top:8px;z-index:3;
	width:34px;height:34px;
	display:flex;align-items:center;justify-content:center;
	background:rgba(255,255,255,.92);
	border:0;border-radius:50%;
	box-shadow:0 2px 6px rgba(61,43,78,.2);
	color:#d9c7d6;
	transition:transform .12s,color .12s;
}
.wacha-fav:hover{transform:scale(1.1);}
.wacha-fav svg{width:18px;height:18px;}
.wacha-fav.is-active{color:var(--wacha-primary);}

/* 記事ページのお気に入りボタン（JSで注入） */
.wacha-fav-single{
	display:inline-flex;align-items:center;gap:7px;
	margin-top:14px;
	padding:9px 18px;
	background:#fff;
	border:1.6px solid var(--wacha-primary-light);
	border-radius:30px;
	color:var(--wacha-primary);
	font-size:13px;font-weight:700;
}
.wacha-fav-single svg{width:18px;height:18px;color:#d9c7d6;transition:color .12s;}
.wacha-fav-single.is-active{background:var(--wacha-primary-bg);border-color:var(--wacha-primary);}
.wacha-fav-single.is-active svg{color:var(--wacha-primary);}

/* =========================================================
   ページネーション
   ========================================================= */
.archive-section .pagination,
.navigation.pagination{margin:32px 0 0;}
.pagination .nav-links{
	display:flex;flex-wrap:wrap;justify-content:center;gap:7px;
}
.page-numbers{
	display:inline-flex;align-items:center;justify-content:center;
	min-width:42px;height:42px;padding:0 12px;
	background:#fff;color:var(--wacha-text);
	border-radius:12px;
	font-size:14px;font-weight:700;
	box-shadow:0 1px 5px rgba(185,140,217,.14);
}
a.page-numbers:hover{background:var(--wacha-primary-bg);color:var(--wacha-primary);}
.page-numbers.current{background:var(--wacha-primary);color:#fff;}
.page-numbers.dots{background:none;box-shadow:none;}

/* =========================================================
   個別記事（single.php）
   ========================================================= */
.single-article{
	max-width:760px;margin:0 auto;
	padding:0 0 44px;
}
.single-article__thumb{margin:0;line-height:0;}
.single-article__thumb img{width:100%;height:auto;display:block;}
.single-article__header{padding:22px 16px 0;}
.single-article__cat{
	display:inline-block;
	background:var(--wacha-primary-bg);color:var(--wacha-primary);
	font-size:11px;font-weight:700;
	padding:4px 12px;border-radius:20px;margin-bottom:10px;
}
.single-article__title{
	font-size:23px;font-weight:900;line-height:1.45;
	color:var(--wacha-text);
}
.single-article__meta{
	margin-top:10px;
	font-size:12px;color:var(--wacha-text-light);
}
.single-article__body{
	padding:24px 16px 0;
	font-size:15px;line-height:1.95;
}
.single-article__body > *{margin-bottom:1.2em;}
.single-article__body h2{
	font-size:19px;font-weight:900;
	margin:1.6em 0 .8em;padding:8px 14px;
	border-left:5px solid var(--wacha-primary);
	background:var(--wacha-primary-bg);border-radius:0 8px 8px 0;
}
.single-article__body h3{
	font-size:16px;font-weight:900;
	margin:1.4em 0 .6em;
	color:var(--wacha-primary);
}
.single-article__body img{border-radius:12px;}
.single-article__body a{text-decoration:underline;}
.single-article__body ul,.single-article__body ol{
	padding-left:1.4em;margin-bottom:1.2em;
}
.single-article__body ul li{list-style:disc;}
.single-article__body ol li{list-style:decimal;}
.single-article__body blockquote{
	padding:12px 16px;margin:1.2em 0;
	background:var(--wacha-secondary-bg);
	border-radius:10px;
}
.single-article__footer{padding:20px 16px 0;}
.single-article__tags{display:flex;flex-wrap:wrap;gap:8px;}
.single-article__tags a{
	background:var(--wacha-primary-bg);color:var(--wacha-text);
	font-size:12px;font-weight:700;
	padding:6px 13px;border-radius:20px;
}
.single-article__tags a:hover{background:var(--wacha-primary);color:#fff;}

/* =========================================================
   固定ページ（page.php）
   ========================================================= */
.single-page{
	max-width:760px;margin:0 auto;
	padding:28px 16px 48px;
}
.single-page__title{
	font-size:24px;font-weight:900;line-height:1.4;
	color:var(--wacha-text);
	padding-bottom:14px;margin-bottom:20px;
	border-bottom:3px solid var(--wacha-primary-bg);
}
.single-page__body{font-size:15px;line-height:1.95;}
.single-page__body > *{margin-bottom:1.2em;}
.single-page__body h2{
	font-size:19px;font-weight:900;
	margin:1.6em 0 .8em;padding:8px 14px;
	border-left:5px solid var(--wacha-primary);
	background:var(--wacha-primary-bg);border-radius:0 8px 8px 0;
}
.single-page__body h3{font-size:16px;font-weight:900;margin:1.3em 0 .5em;color:var(--wacha-primary);}
.single-page__body a{text-decoration:underline;}
.single-page__body ul li{list-style:disc;margin-left:1.4em;}
.single-page__body ol li{list-style:decimal;margin-left:1.4em;}

/* =========================================================
   404
   ========================================================= */
.error-404{
	max-width:560px;margin:0 auto;
	padding:60px 20px;text-align:center;
}
.error-404 h1{
	font-size:24px;font-weight:900;color:var(--wacha-text);
	margin-bottom:14px;
}
.error-404 p{font-size:14px;color:var(--wacha-text-light);margin-bottom:24px;}

/* =========================================================
   セクション共通（Q&A 等）
   ========================================================= */
.section{
	max-width:880px;margin:0 auto;
	padding:24px 14px 44px;
}
.section__head{margin-bottom:18px;}
.section__title{
	display:flex;align-items:center;gap:8px;
	font-size:20px;font-weight:900;color:var(--wacha-text);
}
.section__icon{font-size:22px;}

/* =========================================================
   Q&A（みんなのお悩み相談）
   ========================================================= */
.qa-notice{
	padding:13px 16px;margin-bottom:18px;
	border-radius:12px;
	font-size:13px;font-weight:700;
}
.qa-notice--success{background:#e7f7ee;color:#1f8a4c;border:1.4px solid #9bdcb6;}
.qa-notice--error{background:#fff0f3;color:#d6336c;border:1.4px solid var(--wacha-primary-light);}

.qa-intro{
	background:var(--wacha-secondary-bg);
	border-radius:14px;padding:16px 18px;margin-bottom:20px;
	font-size:13px;line-height:1.8;
}

.qa-panel{
	background:#fff;border-radius:18px;
	padding:20px 16px;margin-bottom:24px;
	box-shadow:0 3px 14px rgba(185,140,217,.12);
}
.qa-panel__title{
	font-size:16px;font-weight:900;color:var(--wacha-text);
	margin-bottom:14px;
}

/* 投稿フォーム */
.qa-form__field{margin:0 0 14px;}
.qa-form__label{
	display:block;
	font-size:13px;font-weight:700;color:var(--wacha-text);
	margin-bottom:6px;
}
.qa-form__input,.qa-form__textarea{
	width:100%;
	border:1.5px solid var(--wacha-primary-bg);
	border-radius:12px;
	padding:12px 14px;
	font-size:14px;color:var(--wacha-text);
	background:#fff;outline:none;
	transition:border-color .15s;
}
.qa-form__input:focus,.qa-form__textarea:focus{border-color:var(--wacha-primary);}
.qa-form__textarea{resize:vertical;min-height:96px;}
.qa-form__actions{margin:0;text-align:right;}
.qa-form__submit{
	display:inline-flex;align-items:center;justify-content:center;
	background:var(--wacha-primary);color:#fff;
	border:0;border-radius:30px;
	padding:13px 30px;
	font-size:14px;font-weight:900;
	box-shadow:0 5px 14px rgba(255,111,168,.3);
}
.qa-form__submit:hover{filter:brightness(1.04);}
/* ハニーポット（人間には見せない） */
.qa-hp{
	position:absolute!important;left:-9999px!important;
	width:1px;height:1px;overflow:hidden;
}

/* お悩み一覧 */
.qa-list{display:flex;flex-direction:column;gap:12px;}
.qa-item{
	background:#fff;border-radius:14px;
	box-shadow:0 2px 10px rgba(185,140,217,.1);
	overflow:hidden;
}
.qa-item__link{display:block;padding:16px 16px 14px;}
.qa-item__title{
	font-size:15px;font-weight:900;color:var(--wacha-text);
	line-height:1.5;margin-bottom:6px;
}
.qa-item:hover .qa-item__title{color:var(--wacha-primary);}
.qa-item__excerpt{
	font-size:12.5px;color:var(--wacha-text-light);line-height:1.7;
	margin-bottom:10px;
}
.qa-item__meta{
	display:flex;flex-wrap:wrap;align-items:center;gap:10px;
	font-size:11px;color:var(--wacha-text-light);
}
.qa-item__answers{
	background:var(--wacha-primary-bg);color:var(--wacha-primary);
	font-weight:700;padding:2px 9px;border-radius:10px;
}
.qa-empty{
	background:#fff;border-radius:14px;
	padding:28px 16px;text-align:center;
	font-size:13px;color:var(--wacha-text-light);
}

/* お悩み個別 */
.qa-back{margin-bottom:16px;}
.qa-back a{font-size:13px;font-weight:700;color:var(--wacha-primary);}
.qa-question{
	background:#fff;border-radius:18px;
	padding:20px 16px;margin-bottom:24px;
	box-shadow:0 3px 14px rgba(185,140,217,.12);
}
.qa-question__head,.qa-answer__head{
	display:flex;flex-wrap:wrap;align-items:center;gap:8px;
	font-size:11px;color:var(--wacha-text-light);
	margin-bottom:10px;
}
.qa-badge,.qa-question__head .qa-badge{
	background:var(--wacha-primary);color:#fff;
	font-size:10px;font-weight:700;
	padding:3px 10px;border-radius:10px;
}
.qa-question__title{
	font-size:19px;font-weight:900;line-height:1.5;
	color:var(--wacha-text);margin-bottom:12px;
}
.qa-question__body,.qa-answer__body{
	font-size:14px;line-height:1.9;color:var(--wacha-text);
}
.qa-answers{margin-bottom:24px;}
.qa-answers__title{
	font-size:16px;font-weight:900;color:var(--wacha-text);
	margin-bottom:14px;
}
.qa-answers__title span{color:var(--wacha-primary);}
.qa-answer{
	background:#fff;border-radius:14px;
	padding:16px;margin-bottom:12px;
	border:1.4px solid var(--wacha-secondary-bg);
}
.qa-answer__author{font-weight:700;color:var(--wacha-secondary);}

/* =========================================================
   お気に入り / 閲覧履歴 スライドパネル（main.js で生成）
   ========================================================= */
.wacha-panel{position:fixed;inset:0;z-index:400;}
.wacha-panel[hidden]{display:none;}
.wacha-panel__overlay{
	position:absolute;inset:0;
	background:rgba(61,43,78,.45);
	opacity:0;transition:opacity .26s;
}
.wacha-panel.is-open .wacha-panel__overlay{opacity:1;}
.wacha-panel__inner{
	position:absolute;top:0;right:0;
	width:min(380px,90vw);height:100%;
	background:#fff;
	display:flex;flex-direction:column;
	box-shadow:-2px 0 24px rgba(61,43,78,.22);
	transform:translateX(100%);
	transition:transform .26s ease;
}
.wacha-panel.is-open .wacha-panel__inner{transform:translateX(0);}
.wacha-panel__head{
	display:flex;align-items:center;justify-content:space-between;
	padding:16px 18px;flex:0 0 auto;
	background:linear-gradient(135deg,var(--wacha-header-grad-start),var(--wacha-header-grad-end));
}
.wacha-panel__head h2{font-size:16px;font-weight:900;color:var(--wacha-text);}
.wacha-panel__close{
	width:34px;height:34px;border:0;border-radius:50%;
	background:rgba(255,255,255,.7);color:var(--wacha-text);
	font-size:20px;line-height:1;
}
.wacha-panel__body{
	flex:1 1 auto;overflow-y:auto;
	padding:14px;display:flex;flex-direction:column;gap:10px;
}
.wacha-panel__empty{
	padding:36px 14px;text-align:center;
	font-size:13px;color:var(--wacha-text-light);line-height:1.8;
}
.wacha-citem{
	display:flex;align-items:stretch;gap:8px;
	background:#fff;border-radius:12px;
	border:1.4px solid var(--wacha-primary-bg);
	overflow:hidden;
}
.wacha-citem__link{display:flex;align-items:center;gap:10px;flex:1 1 auto;padding:8px;}
.wacha-citem__thumb{
	width:64px;height:64px;flex:0 0 auto;
	border-radius:9px;
	background-size:cover;background-position:center;
}
.wacha-citem__thumb--ph{background:var(--wacha-primary-bg);}
.wacha-citem__text{display:flex;flex-direction:column;gap:3px;min-width:0;}
.wacha-citem__cat{
	font-size:10px;font-weight:700;color:var(--wacha-primary);
}
.wacha-citem__title{
	font-size:12.5px;font-weight:700;color:var(--wacha-text);
	line-height:1.5;
	display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.wacha-citem__date{font-size:10px;color:var(--wacha-text-light);}
.wacha-citem__del{
	flex:0 0 auto;width:36px;border:0;
	background:var(--wacha-primary-bg);color:var(--wacha-primary);
	font-size:18px;line-height:1;
}
.wacha-citem__del:hover{background:var(--wacha-primary);color:#fff;}

/* =========================================================
   フロントページ：記事ミニカード（dynamic 化対応）
   ========================================================= */
.lp-article{display:block;color:inherit;}
.lp-article__thumb img{
	position:absolute;inset:0;
	width:100%;height:100%;object-fit:cover;display:block;
}
.lp-article__ph{
	position:absolute;inset:0;
	display:flex;align-items:center;justify-content:center;
	background:linear-gradient(135deg,var(--wacha-primary-light),var(--wacha-secondary-light));
	color:#fff;font-size:11px;font-weight:700;
}
.lp-article:hover .lp-article__title{color:var(--wacha-primary);}

/* =========================================================
   フロントページ：カテゴリアイコン
   ========================================================= */
.lp-cats{padding:26px 14px 0;max-width:100%;}
.lp-cats__grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:12px 6px;
}
.lp-cat{
	display:flex;flex-direction:column;align-items:center;gap:7px;
	text-align:center;
}
.lp-cat__icon{
	display:flex;align-items:center;justify-content:center;
	width:58px;height:58px;
	background:#fff;
	border-radius:50%;
	font-size:25px;line-height:1;
	box-shadow:0 3px 10px rgba(185,140,217,.16);
	transition:transform .14s;
}
.lp-cat:hover .lp-cat__icon{transform:translateY(-3px);}
.lp-cat__label{
	font-size:11px;font-weight:700;color:var(--wacha-text);
	line-height:1.3;
}
@media(min-width:640px){
	.lp-cats{padding-left:20px;padding-right:20px;}
	.lp-cats__grid{grid-template-columns:repeat(9,1fr);}
}
@media(min-width:1200px){
	.lp-cats{padding-left:48px;padding-right:48px;}
}

/* =========================================================
   フロントページ：サイドバナー（始め方ガイド 等）
   ========================================================= */
.lp-banners{
	display:grid;grid-template-columns:1fr;gap:12px;
	padding:30px 14px 0;max-width:100%;
}
.lp-banner{
	position:relative;display:flex;
	min-height:130px;
	border-radius:18px;overflow:hidden;
	padding:20px 18px;
	color:#fff;
}
.lp-banner--banner1{background:linear-gradient(135deg,#FF8FBE,#F5468B);}
.lp-banner--banner2{background:linear-gradient(135deg,#C39BE6,#8E63C9);}
.lp-banner__bg{
	position:absolute;inset:0;
	background-size:cover;background-position:center;
	opacity:.32;
}
.lp-banner__body{position:relative;display:flex;flex-direction:column;gap:5px;}
.lp-banner__tag{
	align-self:flex-start;
	background:rgba(255,255,255,.92);color:var(--wacha-primary);
	font-size:10px;font-weight:700;
	padding:3px 10px;border-radius:10px;
}
.lp-banner__main{font-size:18px;font-weight:900;line-height:1.4;}
.lp-banner__sub{font-size:12px;font-weight:700;opacity:.95;line-height:1.5;}
@media(min-width:640px){
	.lp-banners{grid-template-columns:1fr 1fr;padding-left:20px;padding-right:20px;}
}
@media(min-width:1200px){
	.lp-banners{padding-left:48px;padding-right:48px;}
}

/* =========================================================
   フロントページ：今日のひとこと
   ========================================================= */
.lp-quote{padding:30px 14px 0;max-width:100%;}
.lp-quote__inner{
	position:relative;
	background:linear-gradient(135deg,var(--wacha-primary-bg),var(--wacha-secondary-bg));
	border-radius:18px;
	padding:26px 22px;
	text-align:center;
}
.lp-quote__lead{
	font-size:12px;font-weight:900;color:var(--wacha-primary);
	letter-spacing:.06em;margin-bottom:8px;
}
.lp-quote__text{
	font-size:15px;font-weight:700;line-height:1.85;
	color:var(--wacha-text);
}
@media(min-width:640px){.lp-quote{padding-left:20px;padding-right:20px;}}
@media(min-width:1200px){.lp-quote{padding-left:48px;padding-right:48px;}}

/* =========================================================
   フロントページ：公式SNS
   ========================================================= */
.lp-sns{padding:30px 14px 0;max-width:100%;text-align:center;}
.lp-sns__title{
	font-size:15px;font-weight:900;color:var(--wacha-text);
	margin-bottom:14px;
}
.lp-sns__row{display:flex;justify-content:center;gap:14px;}
.lp-sns__btn{
	display:flex;align-items:center;justify-content:center;
	width:48px;height:48px;border-radius:50%;
	color:#fff;
	box-shadow:0 4px 12px rgba(61,43,78,.18);
	transition:transform .14s;
}
.lp-sns__btn:hover{transform:translateY(-3px);}
.lp-sns__btn svg{width:24px;height:24px;fill:currentColor;}
.lp-sns__btn--x{background:#111;}
.lp-sns__btn--tiktok{background:#010101;}
.lp-sns__btn--instagram{background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF);}
@media(min-width:640px){.lp-sns{padding-left:20px;padding-right:20px;}}
@media(min-width:1200px){.lp-sns{padding-left:48px;padding-right:48px;}}