@charset "UTF-8";
/*
Template: arkhe
Theme Name: Arkhe Child
Theme URI: https://arkhe-theme.com/ja/
Description: Arkhe用子テーマ
Version: 1.0.0
Text Domain: arkhe
License: GNU General Public License
License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ==========================================================================
   当たる当たらないドットコム デザイン
   - 薄紫基調・本文は濃い紫・口コミを読む部分は白背景
   - 見出しは太めの丸ゴシック（M PLUS Rounded 1c）
   - 星・月の装飾は控えめ（aria-hidden）
   - 角丸カード・影・左ボーダーの多用を避ける
   ========================================================================== */

:root {
	--ark-color--main: #6a35b8;
	--ark-color--text: #2b1b4d;
	--ark-color--link: #5526a0;
	--ark-color--bg: #ffffff;
	--ark-color--gray: #f4effb;
	--ark-color--border: #ddd3ee;
	--ark-container_width: 980px;
	--ark-font_family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;

	--atr-c-text: #2b1b4d;
	--atr-c-text-sub: #574a70;
	--atr-c-main: #6a35b8;
	--atr-c-main-strong: #52249c;
	--atr-c-main-soft: #efe7fb;
	--atr-c-hit: #7a3fd0;
	--atr-c-miss: #3567d6;
	--atr-c-miss-line: #a8c0f2;
	--atr-c-band: #f4effb;
	--atr-c-border: #ddd3ee;
	--atr-c-star: #f2be3d;
	--atr-font-heading: "M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", "Hiragino Sans", sans-serif;
	--atr-radius: 8px;
}

body.atr-site {
	color: var(--atr-c-text);
	background: #fff;
}
.atr-site #wrapper { overflow-x: clip; }
.atr-site a { color: var(--ark-color--link); }

/* ---------- ヘッダー ---------- */
.atr-site .l-header {
	background: linear-gradient(180deg, #f1eafb 0%, #f7f3fd 100%);
	border-bottom: 0;
	box-shadow: none;
}
.atr-site .l-header__body { min-height: 64px; }
.atr-logo { margin: 0; }
.atr-logo .c-headLogo {
	font-family: var(--atr-font-heading);
	font-weight: 800;
	font-size: clamp(1.125rem, 5.2vw, 1.875rem);
	letter-spacing: 0;
	line-height: 1.2;
	white-space: nowrap;
	text-decoration: none;
	color: var(--atr-c-text);
}
.atr-logo__a { color: #7a3fd0; }
.atr-logo__b { color: #3567d6; }
.atr-logo__c { color: var(--atr-c-text); font-size: .62em; margin-left: .1em; }
.atr-site .c-gnav__a { font-weight: 700; color: var(--atr-c-text); }
.atr-site .c-gnav__a:hover { color: var(--atr-c-main); }

/* ---------- 共通 ---------- */
.atr-site .l-content__body { padding-top: 0; }
.atr-site .p-breadcrumb { background: transparent; }
.atr-site .p-breadcrumb__list { font-size: .8125rem; }

.atr-heading,
.atr-pageHead__title,
.atr-tellerHead__name,
.atr-hero__catch,
.atr-cta__title,
.atr-site .c-pageTitle__main {
	font-family: var(--atr-font-heading);
	letter-spacing: .02em;
}
.atr-heading { position: relative; padding-bottom: .5rem; margin-bottom: 1.25rem; }
.atr-heading::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 2.5rem;
	height: 4px;
	border-radius: 2px;
	background: #b996ec;
}
.atr-heading.-center::after { left: 50%; transform: translateX(-50%); }
.atr-pageHead { text-align: center; padding: 1.5rem 0 .5rem; }
.atr-pageHead__lead { margin: 0; }

/* 全幅の薄紫帯（ヒーロー・集計・フォーム・案内） */
.atr-site .atr-band {
	margin-inline: calc(50% - 50vw);
	padding: 2.25rem max(16px, calc(50vw - 50%));
	border-radius: 0;
	background: linear-gradient(180deg, #f3edfc 0%, #f6f2fd 100%);
	position: relative;
	overflow: hidden;
}
.atr-site .atr-band__inner { max-width: 880px; }

/* 星・月の装飾（控えめ） */
.atr-site .atr-deco { display: block; position: absolute; line-height: 1; pointer-events: none; }
.atr-deco--star { color: var(--atr-c-star); font-size: 1.25rem; }
.atr-deco--moon { color: var(--atr-c-star); font-size: 1.75rem; }
.atr-deco--sparkle { color: #9a74dc; font-size: 1rem; }
.atr-deco.-h1 { left: 2%; top: 12%; }
.atr-deco.-h2 { right: 6%; top: 18%; }
.atr-deco.-h3 { right: 2%; top: -2%; }
.atr-deco.-h4 { right: 4%; bottom: 6%; font-size: 1rem; }
.atr-deco.-c1 { left: 3%; top: 30%; }
.atr-deco.-c2 { right: 4%; top: 20%; }
.atr-deco.-c3 { right: 14%; bottom: 14%; }

/* ---------- トップ ---------- */
.atr-home .atr-hero { margin-top: 0; padding-top: 2.5rem; padding-bottom: 2.75rem; }
.atr-hero__site { color: var(--atr-c-main); font-size: .9375rem; letter-spacing: .08em; }
.atr-hero__catch { font-size: clamp(1.375rem, 6.4vw, 3rem); color: var(--atr-c-text); word-break: keep-all; overflow-wrap: anywhere; }
.atr-hero__lead { font-size: clamp(.9375rem, 3.6vw, 1.125rem); color: var(--atr-c-text); }
.atr-hero .atr-search { margin-top: 1.5rem; }
.atr-hero .atr-btn.-outline { min-width: min(100%, 20rem); }
.atr-btn.-pen::before {
	content: "";
	width: 1.1em;
	height: 1.1em;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16v4zm11-13l2 2' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16v4zm11-13l2 2' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.atr-home__body { max-width: 900px; margin: 0 auto; }
.atr-home .atr-reviews .atr-more,
.atr-home .atr-section > .atr-more { text-align: right; }
.atr-home .atr-cta { margin-bottom: 0; text-align: center; }
.atr-cta__title { font-size: clamp(1.125rem, 4.6vw, 1.625rem); color: var(--atr-c-text); }

/* ---------- 口コミ一覧（白背景で読みやすく） ---------- */
.atr-review { background: #fff; padding: 1.25rem .25rem; }
.atr-review__text { font-size: 1rem; line-height: 1.9; }
.atr-review__tellerName { font-family: var(--atr-font-heading); font-size: 1.1875rem; text-decoration: none; }
.atr-review__link { color: var(--atr-c-main); }

/* ---------- 占い師ページ ---------- */
.atr-tellerHead { padding: 1rem 0 .5rem; position: relative; }
.atr-tellerHead__name { color: var(--atr-c-text); font-size: clamp(2rem, 9vw, 3.25rem); }
.atr-tellerHead__meta { font-size: 1rem; }
.atr-tellerHead__label { position: relative; }
.atr-tellerHead__label::after {
	content: "";
	display: block;
	width: 3rem;
	height: 4px;
	margin: .35rem auto 0;
	border-radius: 2px;
	background: #9fb6ee;
}
.atr-summary { margin-top: 1rem; }
.atr-teller > .atr-reviews,
.atr-teller > .atr-related,
.atr-page.-archive .atr-archive,
.atr-page.-term .atr-term { max-width: 880px; margin-inline: auto; }
.atr-summary .atr-heading { text-align: left; }
.atr-legend__item.-hit .atr-legend__label,
.atr-legend__item.-hit .atr-legend__num { color: var(--atr-c-main-strong); }
.atr-legend__item.-miss .atr-legend__label,
.atr-legend__item.-miss .atr-legend__num { color: #24509f; }
.atr-related { text-align: center; }
.atr-related .atr-heading { text-align: left; }
.atr-related .atr-linkList { justify-content: center; }

/* ---------- 投稿フォーム ---------- */
.atr-formWrap { margin-bottom: 0; }
.atr-formWrap .atr-heading { font-size: clamp(1.25rem, 5vw, 1.75rem); }
.atr-form .atr-input, .atr-form .atr-textarea { background: #fff; }
.atr-result__btn { background: #fff; }
.atr-btn.-primary { background: var(--atr-c-main); border-color: var(--atr-c-main); }

/* ---------- 一覧・表 ---------- */
.atr-table thead th { background: #f1eafb; }
.atr-table__name a { font-family: var(--atr-font-heading); text-decoration: none; }
.atr-table tbody tr:hover { background: #fbf9fe; }
.atr-termLinks a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- 固定ページ ---------- */
.atr-site .p-topArea, .atr-site .c-pageTitle { text-align: center; }
.atr-site .post_content h2 { font-family: var(--atr-font-heading); }

/* ---------- フッター ---------- */
.atr-site .l-footer { background: #fff; border-top: 2px solid #e6dcf6; }
.atr-site .l-footer__nav a { color: var(--atr-c-text); font-size: .875rem; }
.atr-site .c-copyright { color: var(--atr-c-text-sub); font-size: .75rem; }

@media (max-width: 767px) {
	.atr-deco.-h4, .atr-deco.-c3 { display: none !important; }
	/* 占い師ページのフッター固定ボタンと、Arkheのページトップボタンが重ならないようにする */
	.atr-has-ctaBar .p-fixBtnWrap { bottom: calc(80px + env(safe-area-inset-bottom)); }
}
@media (min-width: 768px) {
	.atr-home .atr-reviews { position: relative; }
	.atr-home .atr-reviews > .atr-more { position: absolute; right: 0; top: .6rem; margin: 0; }
	.atr-site .atr-band { padding-top: 3rem; padding-bottom: 3rem; }
	.atr-review { padding: 1.5rem .5rem; }
	.atr-summary__body { grid-template-columns: 260px 1fr; gap: 2.5rem; }
	.atr-chart { max-width: 260px; }
	.atr-deco--star { font-size: 1.5rem; }
	.atr-deco--moon { font-size: 2.5rem; }
}