/* RODEO はじめてのお客様へ 1.2 — 本文は右端までそろえる（Satoshi 決定 2026-11-06）。文字の大きさ・行間・字間・フォント・色は RODEO Base の変数だけを使う */
.rg{position:relative;max-width:1050px;margin:0 auto;padding-top:26px;box-sizing:border-box}
.rg *,.rg *::before,.rg *::after{box-sizing:border-box}
.rg p{margin:0 0 1em}
.rg p:last-child{margin-bottom:0}
/* 本文は行の端まで詰めて流す（pretty は行を早めに折って右が空くので使わない）。カタカナ語・熟語・英数字は PHP 側で nowrap にしている */
.rg p,.rg li,.rg .rg-ex{word-break:normal;text-wrap:wrap;text-align:justify;text-justify:inter-character}
.rg .rg-shop p,.rg .rg-credit p{text-align:center}
.rg a{color:var(--rodeo-c-orange-dark)}
.rg img{max-width:100%;height:auto}

/* 冒頭：写真は原寸より大きくしない */
.rg .rg-lead{margin:0 0 32px}
.rg .rg-hero{display:block;margin:0 0 16px;text-align:center}
.rg .rg-hero img{display:inline-block;width:auto;max-width:100%;border-radius:12px}

/* 各項目 */
.rg .rg-sec{margin:0 0 40px;scroll-margin-top:80px}
.rg .rg-h{display:flex;align-items:center;gap:12px;position:relative;margin:0 0 16px!important;padding:0 0 8px!important;border:0!important;border-bottom:2px solid var(--rodeo-c-text)!important;background:none!important;color:var(--rodeo-c-text)}
.rg .rg-h::before{content:none!important}
.rg .rg-h::after{content:""!important;position:absolute;left:0;bottom:-2px;width:80px;height:2px;background:var(--rodeo-c-orange)}
.rg .rg-h .rg-ic{flex:0 0 56px;width:56px;height:56px;margin:0;border-radius:10px}
.rg .rg-h3{margin:24px 0 8px}
.rg .rg-pt{padding:8px 12px;background:var(--rodeo-c-bg-soft);border-left:4px solid var(--rodeo-c-orange);border-radius:6px;font-weight:700}
.rg .rg-ex{margin:0 0 1em;padding:12px 16px;background:var(--rodeo-c-btn-text);border:1px dashed var(--rodeo-c-orange);border-radius:8px;font-style:normal}
.rg .rg-ul,.rg .rg-ol{margin:0 0 1em;padding:0 0 0 1.5em}
.rg .rg-ul li,.rg .rg-ol li{margin:0 0 6px}
.rg .rg-ol li::marker{font-weight:700;color:var(--rodeo-c-orange-dark)}

/* 目次（項目名は語のまとまりで折る） */
.rg .rg-toc li,.rg .rg-toc a,.rg .rg-btn{word-break:auto-phrase}
.rg .rg-toc ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.rg .rg-toc li{margin:0;padding:0}
.rg .rg-toc a{display:flex;align-items:center;height:100%;min-height:44px;padding:6px 10px 6px 26px;position:relative;background:var(--rodeo-c-btn-text);border:1px solid var(--rodeo-c-border);border-radius:8px;color:var(--rodeo-c-text);font-weight:700;text-decoration:none;text-wrap:balance;line-height:var(--rodeo-lh-head)}
.rg .rg-toc a::before{content:"";position:absolute;left:11px;top:50%;width:6px;height:6px;border-right:2px solid var(--rodeo-c-orange);border-bottom:2px solid var(--rodeo-c-orange);transform:translateY(-70%) rotate(45deg)}
.rg .rg-toc a:hover{background:var(--rodeo-c-bg-soft)}

/* ボタン */
.rg .rg-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:16px 0 0}
.rg .rg-btns:not(:last-child){margin-bottom:16px}
.rg .rg-btn{min-width:14em;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:6px 16px;border-radius:6px;text-decoration:none!important;text-wrap:balance;color:var(--rodeo-c-btn-text)!important}
.rg .rodeo-btn-sub.rg-btn{color:var(--rodeo-c-btn-sub-text)!important}
.rg .rodeo-btn-line.rg-btn{color:var(--rodeo-c-line-text)!important}

/* 店舗情報 */
.rg .rg-shop{margin:0 0 40px;padding:16px;border:1px solid var(--rodeo-c-border);border-radius:12px;text-align:center}
.rg .rg-shop p{text-align:center;margin:0}
.rg .rg-shop p>span{display:block}
.rg .rg-shop p i{font-style:normal;display:inline-block}
.rg .rg-shop p>span>.rodeo-nowrap{display:inline}

/* クレジット */
.rg .rg-credit{margin:0 0 24px;text-align:center}
.rg .rg-credit p{text-align:center}
.rg .rg-logo{display:block;width:89px!important;height:89px!important;max-width:none!important;margin:0 auto 8px}

@media (max-width:767px){
	.rg .rg-lead{margin-bottom:24px}
	.rg .rg-sec,.rg .rg-shop{margin-bottom:32px}
	.rg .rg-h{gap:10px}
	.rg .rg-h .rg-ic{flex-basis:44px;width:44px;height:44px}
	.rg .rg-toc ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
	.rg .rg-toc a{padding:6px 6px 6px 22px;min-height:44px}
	.rg .rg-toc a::before{left:9px}
	.rg .rg-btns{flex-direction:column;align-items:center}
	.rg .rg-btn{width:100%;max-width:300px;min-width:0}
	.rg .rg-shop{padding:12px}
}
