body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
}

#bgVideo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    padding-bottom: 30vh; /* 中央より少し下の位置 */
    background-color: rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
}

/* メインボタン：6秒後にフェードイン */
.main-content {
    opacity: 0;
    animation: fadeInBtn 1.5s ease-in forwards;
    animation-delay: 6s; /* ここを6秒に変更しました */
    margin-bottom: 25px;
}

@keyframes fadeInBtn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.cta-button {
    display: inline-block;
    padding: 15px 40px; /* 上下を少し詰め、横を広げる */
    background: rgba(255, 255, 255, 0.6); /* 半透明の薄い白 */
    color: #000000; /* 文字は黒 */
    text-decoration: none;
    font-size: 20px; /* メイン文字サイズを少し調整 */
    font-weight: 700;
    border-radius: 15px; /* 角丸を少し抑えると2行でも綺麗です */
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    transition: all 0.3s ease;
    text-align: center; /* テキストを中央揃えに */
    line-height: 1.2; /* 行間を詰め気味にする */
}

.sub-text {
    display: inline-block; /* ブロック化して制御しやすく */
    font-size: 12px; /* 下の文字を小さく */
    font-weight: 400;
    margin-top: 5px; /* 上の文字との隙間 */
    opacity: 0.8; /* 少し薄くして情報の優先度を下げる */
}

.cta-button:hover {
    background: rgba(255, 255, 255, 0.8);
    transform: scale(1.03);
}

/* 音声ボタン：最初から表示 */
.sound-button {
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: white;
    padding: 10px 22px;
    border-radius: 30px;
    cursor: pointer;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s;
}