/**
 * 即日体入ガルバちゃん - トップページ用スタイル
 * モバイルファースト（ベース = スマホ、min-width でタブレット・PC）
 */

/* ---- 変数・ベース ---- */
.garuba-top { background: #fff; }
.garuba-section { width: 100%; padding: 1.5rem 1rem; box-sizing: border-box; }
.garuba-section .garuba-heading { font-size: 1.25rem; margin: 0 0 0.75rem; font-weight: 700; text-align: center; line-height: 1.4; }
.garuba-section-cta { text-align: center; margin-top: 1.25rem; }

/* ボタン：ピンク系 LINE CTA */
.garuba-btn { display: inline-block; padding: 0.75rem 1.25rem; min-height: 44px; box-sizing: border-box; border-radius: 8px; font-weight: 700; text-decoration: none; text-align: center; transition: opacity 0.2s; -webkit-tap-highlight-color: transparent; }
.garuba-btn:active { opacity: 0.9; }
.garuba-btn-primary { background: linear-gradient(150deg, #ed1e79 0%, #9e005d 100%); color: #fff; border: none; }
.garuba-btn-secondary { background: #fff; color: #9e005d; border: 2px solid #9e005d; }
.garuba-btn-outline { background: transparent; color: #998675; border: 2px solid #998675; }
.garuba-btn-large { padding: 1rem 1.5rem; font-size: 1.05rem; width: 100%; max-width: 320px; }

/* ヘッダー用 LINE CTA（全ページ） */
.btn-line-cta { background: linear-gradient(150deg, #ed1e79 0%, #9e005d 100%) !important; color: #fff !important; padding: 0.5rem 0.75rem; border-radius: 6px; }

/* ---- SECTION 1 FV ---- */
.garuba-fv { min-height: 70vh; background-size: cover; background-position: center center; background-color: #f5ebe0; background-attachment: scroll; display: flex; align-items: center; padding: 2rem 1rem; will-change: background-position; }
@media (min-width: 768px) {
    .garuba-fv { background-attachment: fixed; }
}
.garuba-fv-inner { width: 100%; max-width: 480px; margin: 0 auto; }
.garuba-fv-copy-main { font-size: 1.35rem; line-height: 1.5; font-weight: 700; margin: 0 0 0.5rem; color: #333; }
.garuba-fv-copy-sub { font-size: 0.85rem; color: #666; margin: 0 0 1.5rem; letter-spacing: 0.1em; }
.garuba-fv-btns { display: flex; flex-direction: column; gap: 0.75rem; }
.garuba-fv-btns .garuba-btn { width: 100%; }
.garuba-fv-character { margin-top: 1.5rem; text-align: center; }
.garuba-character-img { max-width: 140px; height: auto; }
.garuba-fv-bubble { display: inline-block; margin-top: 0.5rem; padding: 0.4rem 0.8rem; background: #fff; border-radius: 12px; font-size: 0.9rem; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }

/* ---- SECTION 2 信頼バー ---- */
.garuba-trust { background: #f8f5f2; }
.garuba-trust-inner { max-width: 480px; margin: 0 auto; }
.garuba-trust-stats { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0.5rem 0.25rem; margin-bottom: 0.75rem; font-size: 0.9rem; }
.garuba-trust-item { display: flex; flex-direction: column; align-items: center; }
.garuba-trust-value { font-weight: 700; font-size: 1.1rem; color: #9e005d; }
.garuba-trust-label { font-size: 0.7rem; color: #666; }
.garuba-trust-divider { color: #ccc; margin: 0 0.25rem; }
.garuba-trust-quote { font-size: 0.8rem; color: #555; text-align: center; margin: 0; }

/* ---- SECTION 3 今日体入できる店 ---- */
@media (max-width: 767px) {
    .garuba-shop-cards .garuba-shop-card:nth-child(n+4) { display: none; }
}
.garuba-today-shops { background: #fff; }
.garuba-today-shops-inner { max-width: 480px; margin: 0 auto; }
.garuba-live-badge { display: inline-block; margin-right: 0.25rem; font-size: 0.85rem; }
.garuba-today-note { font-size: 0.75rem; color: #888; margin: 0 0 0.25rem; text-align: center; }
.garuba-today-copy { font-size: 0.9rem; text-align: center; margin: 0 0 1rem; color: #555; }
.garuba-area-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.35rem; margin-bottom: 1rem; }
.garuba-tab { padding: 0.4rem 0.75rem; font-size: 0.85rem; border: 1px solid #ccc; background: #fff; border-radius: 20px; cursor: pointer; }
.garuba-tab.is-active { background: #9e005d; color: #fff; border-color: #9e005d; }
.garuba-shop-cards { display: flex; flex-direction: column; gap: 1rem; }
.garuba-shop-card { background: #f8f5f2; border-radius: 10px; overflow: hidden; }
.garuba-shop-card-img { height: 120px; background-size: cover; background-position: center; }
.garuba-shop-card-noimg { background: #e0d8d0; }
.garuba-shop-card-body { padding: 0.75rem; }
.garuba-shop-area { font-size: 0.8rem; color: #9e005d; margin: 0 0 0.2rem; }
.garuba-shop-gyoshu { font-size: 0.85rem; margin: 0 0 0.25rem; }
.garuba-shop-daily { font-size: 0.85rem; margin: 0 0 0.5rem; }
.garuba-shop-card-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.garuba-shop-link { font-size: 0.9rem; color: #9e005d; font-weight: 600; }
.garuba-shop-line { font-size: 0.85rem; color: #00b900; }

/* ---- SECTION 4 ガルバちゃん紹介 ---- */
.garuba-intro { background: #f8f5f2; }
.garuba-intro-inner { max-width: 480px; margin: 0 auto; }
.garuba-intro-content { display: flex; flex-direction: column; gap: 1rem; }
.garuba-intro-visual { text-align: center; }
.garuba-intro-img { max-width: 180px; height: auto; border-radius: 50%; }
.garuba-intro-copy { font-size: 1.1rem; font-weight: 600; line-height: 1.5; margin: 0 0 0.5rem; }
.garuba-intro-sub { font-size: 0.9rem; color: #555; margin: 0 0 0.75rem; white-space: pre-line; }
.garuba-intro-list { list-style: none; margin: 0 0 1rem; padding: 0; font-size: 0.95rem; }
.garuba-intro-list li { margin: 0.35rem 0; }
.garuba-intro-btns { display: flex; flex-direction: column; gap: 0.5rem; }
.garuba-intro-btns .garuba-btn { width: 100%; }

/* ---- SECTION 5 サポート ---- */
.garuba-support { background: #fff; }
.garuba-support-inner { max-width: 480px; margin: 0 auto; }
.garuba-support-cards { display: grid; grid-template-columns: 1fr; gap: 1rem; margin-top: 1rem; }
.garuba-support-card { background: #f8f5f2; padding: 1rem; border-radius: 10px; border-left: 4px solid #9e005d; }
.garuba-support-num { font-size: 0.8rem; color: #9e005d; font-weight: 700; }
.garuba-support-ttl { font-size: 1rem; margin: 0.25rem 0 0.35rem; }
.garuba-support-desc { font-size: 0.85rem; color: #555; margin: 0; line-height: 1.4; }

/* ---- SECTION 6 業種・エリア ---- */
.garuba-index { background: #f0ebe5; }
.garuba-index-inner { max-width: 480px; margin: 0 auto; }
.garuba-index-block { margin-bottom: 1.5rem; }
.garuba-index-block:last-child { margin-bottom: 0; }
.garuba-index-ttl { font-size: 1rem; margin: 0 0 0.5rem; font-weight: 700; }
.garuba-index-grid { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.garuba-index-item { display: block; padding: 0.5rem 0.9rem; background: #fff; border-radius: 8px; font-size: 0.9rem; text-decoration: none; color: #333; border: 1px solid #ddd; }

/* ---- SECTION 7 体験談 ---- */
.garuba-testimonials { background: #fff; }
.garuba-testimonials-inner { max-width: 480px; margin: 0 auto; }
.garuba-testimonial-slider { position: relative; min-height: 120px; }
.garuba-testimonial-card { display: none; padding: 1rem; background: #f8f5f2; border-radius: 10px; }
.garuba-testimonial-card.is-active { display: block; }
.garuba-testimonial-name { font-size: 0.85rem; color: #9e005d; margin: 0 0 0.5rem; }
.garuba-testimonial-comment { font-size: 0.95rem; line-height: 1.6; margin: 0; font-style: normal; }
.garuba-testimonial-nav { display: flex; justify-content: center; align-items: center; gap: 1rem; margin-top: 1rem; }
.garuba-slider-prev, .garuba-slider-next { padding: 0.4rem 0.75rem; font-size: 1.2rem; background: #eee; border: none; border-radius: 6px; cursor: pointer; }

/* ---- SECTION 8 ブログ ---- */
.garuba-blog { background: #f8f5f2; }
.garuba-blog-inner { max-width: 480px; margin: 0 auto; }
.garuba-blog-sub { font-size: 0.85rem; text-align: center; color: #666; margin: 0 0 1rem; }
.garuba-blog-cards { display: flex; flex-direction: column; gap: 1rem; }
.garuba-blog-card { background: #fff; border-radius: 10px; overflow: hidden; }
.garuba-blog-card a { text-decoration: none; color: inherit; display: block; }
.garuba-blog-card-img { height: 140px; background-size: cover; background-position: center; }
.garuba-blog-card-noimg { background: #e0d8d0; }
.garuba-blog-card-body { padding: 0.75rem; }
.garuba-blog-card-ttl { font-size: 0.95rem; margin: 0 0 0.25rem; font-weight: 600; line-height: 1.3; }
.garuba-blog-card-date { font-size: 0.75rem; color: #888; }

/* ---- SECTION 9 FAQ ---- */
.garuba-faq { background: #fff; }
.garuba-faq-inner { max-width: 480px; margin: 0 auto; }
.garuba-accordion { margin: 1rem 0; }
.garuba-accordion-item { border-bottom: 1px solid #eee; }
.garuba-accordion-q { width: 100%; padding: 0.9rem 0.5rem 0.9rem 0; text-align: left; background: none; border: none; font-size: 0.95rem; cursor: pointer; display: flex; align-items: center; }
.garuba-accordion-q::after { content: ''; margin-left: auto; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #666; }
.garuba-accordion-a { max-height: 0; overflow: hidden; transition: max-height 0.25s ease; }
.garuba-accordion-a.is-open { max-height: 300px; }
.garuba-accordion-a p { margin: 0 0 1rem; padding: 0 0.5rem 0; font-size: 0.9rem; line-height: 1.5; color: #555; }
.garuba-faq-line { font-size: 0.85rem; text-align: center; margin: 1rem 0 0; }
.garuba-faq-line a { color: #00b900; font-weight: 600; }

/* ---- SECTION 10 フッターCTA ---- */
.garuba-footer-cta { background: linear-gradient(150deg, #f5e0e8 0%, #f0ebe5 100%); padding: 2rem 1rem; }
.garuba-footer-cta-inner { max-width: 480px; margin: 0 auto; text-align: center; }
.garuba-footer-cta-copy { font-size: 1.05rem; font-weight: 600; margin: 0 0 1.25rem; line-height: 1.5; }
.garuba-footer-cta-note { font-size: 0.75rem; color: #666; margin: 0.75rem 0 0; }

/* トップページ時：メインをフル幅に（従来の #main 内余白を打ち消し） */
.garuba-top.toppage { padding: 0; }
body.toppage #main { padding: 0; max-width: none; }

/* タブレット以上 */
@media (min-width: 600px) {
	.garuba-section { padding: 2rem 1.5rem; }
	.garuba-fv-copy-main { font-size: 1.6rem; }
	.garuba-fv-btns { flex-direction: row; flex-wrap: wrap; justify-content: center; }
	.garuba-fv-btns .garuba-btn { width: auto; min-width: 200px; }
	.garuba-shop-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
	.garuba-support-cards { grid-template-columns: repeat(2, 1fr); }
	.garuba-intro-content { flex-direction: row; align-items: flex-start; }
	.garuba-intro-visual { flex-shrink: 0; }
	.garuba-blog-cards { flex-direction: row; flex-wrap: wrap; justify-content: center; }
	.garuba-blog-card { flex: 1 1  calc(33.333% - 0.67rem); min-width: 140px; max-width: 220px; }
}

@media (min-width: 900px) {
	.garuba-section .garuba-heading { font-size: 1.5rem; }
	.garuba-today-shops-inner,
	.garuba-intro-inner,
	.garuba-support-inner,
	.garuba-index-inner,
	.garuba-testimonials-inner,
	.garuba-blog-inner,
	.garuba-faq-inner { max-width: 720px; }
	.garuba-shop-cards { grid-template-columns: repeat(3, 1fr); }
	.garuba-support-cards { grid-template-columns: repeat(4, 1fr); }
}

/* ===== 店舗詳細：ガルバちゃん内部レポート・CV（モバイルファースト） ===== */
.garuba-shop-report { background: #f8f5f2; margin: 1.5rem 0; }
.garuba-shop-report-inner { max-width: 480px; margin: 0 auto; padding: 0 1rem; }
.garuba-report-sub { font-size: 0.85rem; color: #666; margin: 0 0 1rem; text-align: center; }
.garuba-report-block { margin-bottom: 1.25rem; }
.garuba-report-block h3 { font-size: 0.95rem; margin: 0 0 0.5rem; color: #9e005d; }
.garuba-report-body { font-size: 0.9rem; line-height: 1.6; color: #333; }
.garuba-rating-list { list-style: none; margin: 0; padding: 0; font-size: 0.9rem; }
.garuba-rating-list li { margin: 0.25rem 0; }
.garuba-fit-yes { font-size: 0.9rem; margin: 0.5rem 0; color: #2d7a2d; }
.garuba-fit-no { font-size: 0.9rem; margin: 0.5rem 0; color: #666; }
.garuba-comment-block { background: #fff; padding: 1rem; border-radius: 8px; border-left: 4px solid #9e005d; }
.garuba-comment-text { margin: 0; font-size: 0.95rem; line-height: 1.5; }

.garuba-shop-cta { background: linear-gradient(150deg, #f5e0e8 0%, #f0ebe5 100%); margin: 1.5rem 0; }
.garuba-shop-cta-inner { max-width: 480px; margin: 0 auto; padding: 0 1rem; text-align: center; }
.garuba-shop-cta .garuba-heading { font-size: 1.05rem; }
.garuba-cta-list { list-style: none; margin: 0 0 1rem; padding: 0; text-align: left; font-size: 0.9rem; }
.garuba-cta-list li { margin: 0.35rem 0; }
.garuba-cta-primary { margin: 0 0 1rem; }
.garuba-cta-primary .garuba-btn { width: 100%; max-width: 320px; }
.garuba-cta-sub { font-size: 0.85rem; color: #666; margin: 0 0 0.5rem; }
.garuba-cta-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; font-size: 0.9rem; }
.garuba-cta-links a { color: #9e005d; font-weight: 600; }
@media (min-width: 600px) {
	.garuba-shop-report-inner, .garuba-shop-cta-inner { max-width: 640px; }
}