/* --- 固定3ボタン（WEB予約・LINE事前相談・目次） --- */
.ringo-floating-buttons {
position: fixed;
bottom: 120px;
right: 20px;
display: flex;
flex-direction: column;
gap: 10px;
z-index: 9999;
}
.ringo-btn {
color: #fff;
font-size: 14px;
border: none;
border-radius: 35px;
padding: 12px 16px;
cursor: pointer;
box-shadow: 0 3px 10px rgba(0,0,0,0.2);
transition: background-color 0.3s ease, transform 0.2s ease;
}
/* -------------------------
1. WEB予約（青系）
-------------------------- */
.ringo-btn:nth-child(1) {
background-color: #007BFF;
}
.ringo-btn:nth-child(1):hover {
background-color: #0069d9;
}
/* -------------------------
2. LINE事前相談（現行の緑）
-------------------------- */
.ringo-btn:nth-child(2) {
background-color: #06C755;
}
.ringo-btn:nth-child(2):hover {
background-color: #05b34c;
}
/* -------------------------
3. 目次（オレンジ・現行のまま）
-------------------------- */
.ringo-btn:nth-child(3) {
background-color: #FFA500;
}
.ringo-btn:nth-child(3):hover {
background-color: #E69500;
}
/* 目次ポップアップ */
.ringo-toc-popup {
position: fixed;
bottom: 120px;
right: 100px;
width: 85%;
max-width: 340px;
max-height: 70%;
overflow-y: auto;
background: #fff;
border: 2px solid #ff7f50;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0,0,0,0.2);
padding: 15px;
display: none;
z-index: 9998;
}
.ringo-toc-popup a {
color: #333;
text-decoration: none;
}
.ringo-toc-popup a:hover {
text-decoration: underline;
}
.ringo-toc-popup-close {
text-align: right;
cursor: pointer;
margin-bottom: 10px;
font-weight: bold;
color: #666;
}
通いやすい理由 