* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    background-color: rgb(1,1,1);
    line-height: 1.6;
    font-size: 16px;
    overflow-x: hidden;
    width: 100%;
    padding-top: 60px; 
}
html { scroll-padding-top: 60px;}
a { text-decoration: none; color: inherit; transition: 0.3s; }
a:hover { opacity: 0.8; }
img { max-width: 100%; height: auto; display: block; }

/* --- Header  --- */
.header{background-color:#111;position:fixed;top:0;left:0;width:100%;height:60px;z-index:1000;box-shadow:0 2px 5px rgba(0,0,0,.5)}.header-inner{max-width:1320px;width:100%;height:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 20px}.logo{font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;font-weight:600;font-size:1.4rem;color:#fff;white-space:nowrap}.header-actions{display:flex;align-items:center;height:100%;gap:15px}.instagram{height:36px;width:36px;display:block}.instagram img{height:100%;width:100%;object-fit:contain}.header-btn{background-color:transparent;color:#fff;font-size:1.8rem;padding:0;line-height:1;border:none;cursor:pointer;display:flex;align-items:center}.admission{width:70px;height:60px;text-align:center;background-color:#e80000;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-right:-20px;color:#fff}.admission img{width:24px;height:24px;margin-bottom:4px}.admission p{margin:0;font-size:10px;line-height:1;font-weight:700}.menu{background:#000;position:fixed;top:0;right:-250px;width:250px;height:100%;z-index:2000;transition:.3s;padding-top:60px;box-shadow:-2px 0 5px rgba(0,0,0,.5);overflow-y:auto}.menu a{display:flex;align-items:center;padding:15px 20px;font-size:16px;color:#fff;border-bottom:1px solid #333;transition:background .3s}.menu a:hover{background:#0b43dc}.overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:1500;backdrop-filter:blur(2px)}

/*ヒーローセクション*/
.hero{position:relative;width:100%;height:500px;overflow:hidden;background:#000;}
.hero-slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;animation:slideAnimation 24s infinite;z-index:1}
.hero-slide img{width:100%;height:100%;object-fit:cover;display:block}
.hero-slide::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.3)}
.slide-1{animation-delay:0s}
.slide-2{animation-delay:6s}
.slide-3{animation-delay:12s}
.slide-4{animation-delay:18s}
@keyframes slideAnimation {0%{opacity: 0;transform: scale(1);}4%{opacity: 1;}25% {opacity: 1;}29% {opacity: 0;transform: scale(1.1);}100% {opacity: 0;}}
.hero-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10;text-align:center;color:#fff;width:90%}
.hero-subtitle{font-size:2rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;text-shadow:2px 2px 10px rgba(0,0,0,.5);margin-bottom:15px}
.hero-title{font-size:1rem;text-shadow:1px 1px 5px rgba(0,0,0,.5)}
@media(min-width:768px){
.hero{height:600px}
.hero-subtitle{font-size:3rem;margin-bottom:20px}
.hero-title{font-size:1.2rem}
}

/* --- Personal Training Page Styles --- */

:root {
    /* アクセントカラー（サイト全体と統一した赤色） */
    --pt-accent: #e80000; 
    /* 背景色より少し明るいグレー（カード用） */
    --pt-card-bg: #1a1a1a;
    /* テキストカラー（白系） */
    --pt-text: #f4f4f4;
    --pt-text-sub: #aaaaaa;
}

/* 共通コンテナ（もし既存になければ使用） */
.container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

/* セクション共通 */
.pt-section {
    padding: 40px 0;
    color: var(--pt-text);
}

.pt-bg-dark {
    /* 背景を少しだけ明るくして区切りをつける */
    background-color: #0d0d0d; 
}

.pt-header-center {
    text-align: center;
    margin-bottom: 50px;
}

.pt-title {
    font-size: 2.2rem;
    margin-bottom: 15px;
    color: var(--pt-accent);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.pt-desc {
    color: var(--pt-text-sub);
    font-size: 1rem;
    max-width: 700px;
    margin: 0 auto;
}

/* Concept Grid */
.pt-concept-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
}

.pt-concept-item {
    background: var(--pt-card-bg);
    padding: 30px;
    border-radius: 8px;
    border: 1px solid #333;
}

.pt-concept-num {
    font-size: 2.5rem;
    font-weight: bold;
    color: #333; /* 文字裏の透かしのように */
    line-height: 1;
    margin-bottom: 10px;
}

.pt-concept-item h3 {
    margin-bottom: 15px;
    font-size: 1.3rem;
    color: #fff;
}

.pt-concept-item p {
    color: #ccc;
    font-size: 0.95rem;
}

/* Programs Grid */
.pt-program-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 25px;
}

.pt-card {
    background: var(--pt-card-bg);
    border-radius: 10px;
    overflow: hidden;
    transition: transform 0.3s;
    border: 1px solid #222;
}

.pt-card:hover {
    transform: translateY(-5px);
    border-color: var(--pt-accent);
}

.pt-card-img {
    height: 200px;
    background-color: #333; /* 画像読み込み前の色 */
    background-size: cover;
    background-position: center;
    /* グラデーションでそれっぽく見せる（画像がない場合用） */
    background-image: linear-gradient(45deg, #222, #444);
}

.pt-card-body {
    padding: 20px;
}

.pt-tag {
    background-color: var(--pt-accent);
    color: #000;
    padding: 3px 10px;
    font-size: 0.75rem;
    border-radius: 4px;
    font-weight: bold;
    display: inline-block;
    margin-bottom: 12px;
}

.pt-card-body h3 {
    margin-bottom: 10px;
    font-size: 1.4rem;
    color: #fff;
}

.pt-card-body p {
    font-size: 0.9rem;
    color: #ccc;
    line-height: 1.5;
}

/* Pricing Table */
.pt-pricing-wrapper {
    max-width: 800px;
    margin: 0 auto;
}

.pt-pricing-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--pt-card-bg);
    border-radius: 8px;
    overflow: hidden;
}

.pt-pricing-table th, 
.pt-pricing-table td {
    padding: 20px;
    border-bottom: 1px solid #333;
    text-align: left;
}

.pt-pricing-table th {
    color: #fff;
    width: 40%;
    font-weight: bold;
}

.pt-pricing-table .pt-price {
    font-size: 1.2rem;
    font-weight: bold;
    color: var(--pt-accent);
}

.pt-sub {
    font-size: 0.8rem;
    color: #888;
    font-weight: normal;
    margin-left: 5px;
}

.pt-note {
    margin-top: 15px;
    font-size: 0.85rem;
    color: #888;
    text-align: right;
}

/* ---------- Pricing Card (index.html と同デザイン) ---------- */
.plan-card-container{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
}
.plan-card{
    position: relative;
    background: linear-gradient(135deg, #202020, #111);
    border-radius: 18px;
    padding: 30px 16px 20px;
    width: 100%;
    max-width: 320px;
    box-shadow: 0 14px 30px rgba(0,0,0,0.7);
    border: 1px solid rgba(255,255,255,0.05);
    overflow: hidden;
}
.plan-card.recommended {
    border-color: #e80000;
    box-shadow: 0 0 0 1px rgba(232,0,0,0.4), 0 18px 35px rgba(0,0,0,0.9);
}
.plan-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    font-size: 0.7rem;
    letter-spacing: 0.05em;
    padding: 3px 10px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.4);
    color: #fff;
    background: rgba(0,0,0,0.5);
}
.plan-badge-main {
    background: linear-gradient(135deg, #ff3b3b, #e80000);
    border-color: transparent;
}
.p-1{
    text-align: left;
    font-size: 0.8rem;
    color: #bbb;
    margin-top: 32px;
}
.p-2{
    font-size: 1rem;
    font-weight: 700;
    text-align: left;
    margin-top: 4px;
    color: #fff;
}
.line{
    border-top: 1px solid rgba(255,255,255,0.1);
    width: 100%;
    margin: 12px 0;
}
.plan-card ul{
    background-color: transparent;
    list-style: none;
    margin: 0;
    padding: 0;
}
.plan-card li{
    color: #eee;
    text-align: left;
    font-size: 0.85rem;
    padding: 4px 0;
}
.plan-card li::before{
    content: "・";
    margin-right: 4px;
}
.highlight-price{
    color: #ff4b4b;
    font-weight: 700;
}

/* FAQ Accordion */
.pt-faq-list {
    max-width: 800px;
    margin: 0 auto;
}

.pt-faq-item {
    border-bottom: 1px solid #333;
    margin-bottom: 10px;
}

.pt-faq-question {
    padding: 20px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: bold;
    color: #fff;
    transition: color 0.3s;
}

.pt-faq-question:hover {
    color: var(--pt-accent);
}

.pt-faq-question::after {
    content: '+';
    font-size: 1.5rem;
    color: var(--pt-accent);
    margin-left: 15px;
}

.pt-faq-item.active .pt-faq-question::after {
    content: '-';
}

.pt-faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    padding: 0 20px;
    color: #ccc;
    border-left: 2px solid var(--pt-accent);
}

.pt-faq-answer p {
    padding-bottom: 20px;
    font-size: 0.95rem;
}

/* CTA */
.pt-cta-box {
    background: linear-gradient(45deg, #1a1a1a, #2a2a2a);
    text-align: center;
    padding: 60px 20px;
    border-radius: 12px;
    border: 1px solid #333;
}

.pt-cta-box h2 {
    color: #fff;
    font-size: 2rem;
    margin-bottom: 15px;
}

.pt-cta-box p {
    color: #ccc;
    margin-bottom: 30px;
}

.pt-btn {
    display: inline-block;
    background-color: var(--pt-accent);
    color: #000;
    padding: 15px 50px;
    font-weight: bold;
    border-radius: 50px;
    font-size: 1.1rem;
    transition: transform 0.3s, box-shadow 0.3s;
}

.pt-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(212, 175, 55, 0.3);
    opacity: 1; /* a:hover opacity:0.8 上書き回避 */
}

/* SP Responsive */
@media (max-width: 768px) {
    .pt-title { font-size: 1.8rem; }
    .pt-pricing-table th, .pt-pricing-table td {
        display: block;
        width: 100%;
        border-bottom: none;
        padding: 10px 15px;
    }
    .pt-pricing-table th { padding-top: 20px; }
    .pt-pricing-table td { padding-bottom: 20px; border-bottom: 1px solid #333; }
}




/* --------------------
Footer Styles (Mobile First Optimized)
-------------------- */
.footer{background-color:#111;color:#ccc;padding:50px 0 20px;margin-top:60px;font-size:.9rem;border-top:3px solid #222}.footer-inner{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:40px}.footer-col{flex:1;min-width:280px}.footer-title{color:#fff;font-size:1.1rem;font-weight:700;margin-bottom:20px;border-left:4px solid #e80000;padding-left:12px;letter-spacing:.05em}.footer-logo{font-family:Impact,sans-serif;color:#fff;font-size:1.8rem;margin-bottom:15px;line-height:1}.footer-desc{margin-bottom:20px;font-size:.85rem;color:#aaa}.footer-sns{display:flex;gap:15px}.footer-sns a{width:44px;height:44px;transition:opacity .3s}.footer-nav{list-style:none;padding:0;columns:2;column-gap:20px}.footer-nav li{margin-bottom:12px}.footer-nav a{color:#ccc;text-decoration:none;display:block;transition:color .3s;font-size:.9rem}.footer-nav a:hover{color:#e80000}.shop-details{margin-bottom:20px}.address{color:#fff;margin-bottom:15px;line-height:1.6}.hours-box{display:inline-block;background:#222;padding:8px 15px;border-radius:4px;margin-bottom:15px;border:1px solid #333}.hours-box .label{color:#e80000;font-weight:700;font-size:.8rem;margin-right:8px}.hours-box .time{color:#fff;font-weight:700}.tel-btn{display:flex;align-items:center;justify-content:center;background-color:#fff;color:#000;font-weight:700;text-decoration:none;padding:12px;border-radius:50px;margin-top:10px;max-width:260px;transition:background .3s;box-shadow:0 4px 6px rgba(0,0,0,.3)}.tel-btn:hover{background-color:#ddd;opacity:1}.tel-btn .icon{margin-right:10px;font-size:1.2rem}.map-container{width:100%;margin:20px 0;border-radius:8px;overflow:hidden;box-shadow:0 4px 10px rgba(0,0,0,.5);background:#222}.map-container iframe{vertical-align:bottom;filter:grayscale(20%) contrast(1.1)}.access-text{margin-top:15px;font-size:.85rem}.access-item{margin-bottom:12px;border-bottom:1px dashed #333;padding-bottom:12px}.access-item:last-child{border-bottom:none}.access-item strong{color:#fff;display:block;margin-bottom:4px}.access-item p{color:#aaa;margin:0;line-height:1.5}.footer-bottom{margin-top:40px;padding-top:20px;border-top:1px solid #222;text-align:center}.copyright{color:#555;font-size:.75rem;margin:0}@media(min-width:768px){.footer-col.info-col{flex:1.3}.footer-nav{columns:1}.tel-btn{display:inline-flex;width:auto;padding:10px 25px}}