body { font-family: sans-serif; margin: 0; padding-top: 60px; } /* タブの高さ分だけ下にずらす */

/* タブメニュー（最前面・最上部） */
.tab-menu {
    display: flex; justify-content: center; background: #fff;
    position: fixed; top: 0; width: 100%; z-index: 101;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.tab-btn { padding: 15px 20px; border: none; background: none; cursor: pointer; }
.tab-btn.active { color: #000f73; border-bottom: 3px solid #000f73; font-weight: bold; }

/* メンバールール固定 */
.member-controls {
    position: sticky; top: 53px; z-index: 100;
    background: rgba(255, 255, 255, 0.98);
    padding: 10px; border-bottom: 1px solid #eee;
}

/* 一覧カード（シンプル） */
.grid-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 15px; padding: 15px; }
.member-card { text-align: center; border: 1px solid #eee; padding: 10px; border-radius: 8px; }
.member-card img { width: 100%; aspect-ratio: 1/1; object-fit: cover; border-radius: 50%; }

.trial-container { max-width: 800px; margin: 0 auto; padding: 20px; }

/* LINEボタン */
.line-btn {
    display: flex; align-items: center; justify-content: center;
    background: #06C755; color: white; padding: 15px;
    border-radius: 30px; text-decoration: none; font-weight: bold; margin: 20px 0;
}
.line-icon { font-size: 1.5rem; margin-right: 10px; }

/* タイムライン */
.timeline { border-left: 3px solid #000f73; margin: 20px 0 20px 20px; padding-left: 20px; }
.time-item { position: relative; margin-bottom: 30px; }
.time-point {
    position: absolute; left: -43px; top: 0;
    background: #000f73; color: white; padding: 2px 8px;
    border-radius: 4px; font-size: 0.8rem; font-weight: bold;
}

/* 通知・警告カード */
.notice-card { background: #fffcf0; border: 1px solid #f1c40f; padding: 10px; border-radius: 8px; margin-top: 10px; font-size: 0.9rem; }
.location-card { background: #f8f9fa; padding: 20px; border-radius: 12px; border: 1px solid #ddd; }
.warning { color: #e74c3c; font-weight: bold; font-size: 0.8rem; margin-top: 10px; }

/* 規約カード */
.terms-card { border: 2px dashed #e74c3c; padding: 20px; border-radius: 12px; text-align: center; }
.terms-btn { background: #e74c3c; color: white; border: none; padding: 10px 20px; border-radius: 20px; cursor: pointer; font-weight: bold; margin-top: 10px; }