body{
    margin:0;
    font-family:"san note jp", sans-serif;
    background:url("img/bg.jpg") no-repeat center center fixed;
    background-size:cover;
    color:#fff;
}

/* 背景を暗くする */
.overlay{
    background:rgba(0,0,0,0.7);
    min-height:100vh;
    padding-top:100px;
    padding-bottom:100px;
}

/* 中央パネル */
.panel{
    width:700px;
    margin:0 auto;
    padding:60px;
    background:rgba(0,0,0,0.8);
    border:1px solid rgba(255,255,255,0.1);
}

/* タイトル */
h1{
    text-align:center;
    font-size:36px;
    margin-bottom:10px;
}

.sub{
    text-align:center;
    font-size:12px;
    letter-spacing:3px;
    color:#bbb;
    margin-bottom:50px;
}

/* リスト */
.game-list{
    list-style:none;
    padding:0;
    margin:0;
}

.game-list li{
    margin-bottom:20px;
}

.game-list a{
    display:block;
    padding:15px 20px;
    text-decoration:none;
    color:#fff;
    font-size:18px;
    background:#1a1a1a;
    border:1px solid #333;
}

.game-list a:hover{
    border-left:6px solid #c6a75e;
    background:#222;
    padding-left:30px;
}

/* フッター */
.footersign{
    text-align:center;
    margin-top:40px;
    font-size:12px;
    color:#aaa;
}
body{
    margin:0;
    font-family:"Yu Gothic", sans-serif;
    background:url("img/bg.jpg") no-repeat center center fixed;
    background-size:cover;
    color:#fff;
}

/* 背景を暗くする */
.overlay{
    background:rgba(0,0,0,0.7);
    min-height:100vh;
    padding-top:100px;
    padding-bottom:100px;
}

/* 中央パネル */
.panel{
    width:700px;
    margin:0 auto;
    padding:60px;
    background:rgba(0,0,0,0.8);
    border:1px solid rgba(255,255,255,0.1);
}

/* タイトル */
h1{
    text-align:center;
    font-size:36px;
    margin-bottom:10px;
}

.sub{
    text-align:center;
    font-size:12px;
    letter-spacing:3px;
    color:#bbb;
    margin-bottom:50px;
}

/* リスト */
.game-list{
    list-style:none;
    padding:0;
    margin:0;
}

.game-list li{
    margin-bottom:20px;
}

.game-list a{
    display:block;
    padding:15px 20px;
    text-decoration:none;
    color:#fff;
    font-size:18px;
    background:#1a1a1a;
    border:1px solid #333;
}

.game-list a:hover{
    border-left:6px solid #c6a75e;
    background:#222;
    padding-left:30px;
}

/* フッター */
.footersign{
    text-align:center;
    margin-top:40px;
    font-size:12px;
    color:#aaa;
}
/* Official style Follow Button */
.follow-btn{
    position:fixed;
    top:25px;
    right:35px;
    padding:10px 26px;
    text-decoration:none;
    font-size:13px;
    letter-spacing:2px;
    font-weight:600;
    color:#fff;
    background:#000;
    border:1px solid #fff;
    transition:0.3s;
}

/* Official style Follow Button */

/* Follow Button */
.follow-btn{
    position:absolute;   /* ← fixedじゃなくabsolute */
    top:25px;
    right:35px;
    padding:10px 26px;
    text-decoration:none;
    font-size:13px;
    letter-spacing:2px;
    font-weight:bold;
    color:#ffffff;
    background:#000000;
    border:1px solid #ffffff;
    transition:0.3s;
}

/* Hover */
.follow-btn:hover{
    background:#ffffff;
    color:#000000;
}
.overlay{
    position:relative;
}


}

}

}
/* =========================
   FULL MOBILE OPTIMIZED
========================= */

@media screen and (max-width: 768px){

    body{
        background-position:center;
        background-size:cover;
    }

    .overlay{
        padding:40px 0;
    }

    .panel{
        width:92%;
        margin:0 auto;
        padding:40px 25px;
        background:rgba(0,0,0,0.75);
        border:1px solid rgba(255,255,255,0.15);
    }

    h1{
        font-size:22px;
        letter-spacing:3px;
        margin-bottom:10px;
    }

    .sub{
        font-size:11px;
        letter-spacing:4px;
        margin-bottom:40px;
        color:#888;
    }

    /* ゲームリストをカード化 */
    .game-list{
        padding:0;
    }

    .game-list li{
        list-style:none;
        margin:20px 0;
    }

    .game-list a{
        display:block;
        padding:18px 20px;
        background:rgba(255,255,255,0.05);
        border:1px solid rgba(255,255,255,0.1);
        text-decoration:none;
        color:#ffffff;
        font-size:14px;
        letter-spacing:2px;
        transition:0.3s;
    }

    .game-list a:active{
        background:rgba(255,255,255,0.15);
    }

    /* FOLLOWボタン下固定 */
    .follow-btn{
        position:fixed;
        bottom:20px;
        left:50%;
        transform:translateX(-50%);
        width:80%;
        text-align:center;
        padding:14px 0;
        background:#000;
        border:1px solid #fff;
        font-size:13px;
        letter-spacing:3px;
    }

    .follow-btn:hover{
        background:#fff;
        color:#000;
    }

    .footersign{
        margin-top:80px;
        font-size:10px;
        color:#666;
    }

}