/* スマートフォン向けのスタイル（768px以下） */
@media screen and (max-width: 768px) {
    body {
        font-size: 14px;
        padding: 10px;
        min-width: auto;
    }

    .wrapper {
        width: 100%;
        overflow-x: hidden;
    }

    /* ヘッダーナビゲーションの調整 */
    .top_header_bg {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 0;
    }

    .top_header_bg li {
        width: 100%;
        text-align: center;
        margin: 5px 0;
    }

    .top_header_bg img {
        max-width: 80%;
        height: auto;
    }

    /* キャラクター一覧の調整 */
    .chara_list {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .chara_list li {
        width: 45%;
        margin: 5px;
    }

    /* キャラクター顔アイコンの調整 */
    .chara_face {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        position: relative;
    }

    .chara_face li {
        width: 45%;
        margin: 5px;
    }

    /* フッターナビゲーションの調整 */
    .footer_navi {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .footer_navi li {
        margin: 5px 10px;
    }

    /* ページトップボタンの調整 */
    a[href="#top"] img {
        position: fixed !important;
        right: 10px !important;
        bottom: 10px !important;
        top: auto !important;
        margin: 0 !important;
        width: 40px;
        z-index: 100;
    }

    /* 背景画像の調整 */
    .kitajima_bg,
    .kuzuhara_bg,
    .washimi_bg,
    .okano_bg,
    .sub_chara_bg {
        width: 100%;
        background-size: contain;
    }

    /* ニュースセクションの調整 */
    .news {
        width: 100%;
    }

    .news_contents {
        width: 90%;
        margin: 0 auto;
    }

    /* YouTubeとムービーセクションの調整 */
    .youtube iframe {
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
    }

    .movie img {
        width: 100%;
        height: auto;
    }

    /* 言語切り替えの調整 */
    .language-switcher {
        width: 100%;
        text-align: center;
    }

    .language-switcher ul {
        display: flex;
        justify-content: center;
        padding: 0;
    }

    .language-switcher li {
        margin: 0 10px;
    }

    /* スライダーの調整 */
    .flexslider {
        width: 100%;
    }

    .slides img {
        width: 100%;
        height: auto;
    }

    /* 左コンテンツの調整 */
    .left-contents {
        width: 100%;
        padding: 10px;
    }

    .left-contents li {
        width: 100%;
        margin-bottom: 15px;
    }

    /* ダウンロードボタンの調整 */
    .top_ios_download img,
    .top_android_download img {
        width: 100%;
        height: auto;
    }

    /* コンテナの最大幅を設定 */
    .container {
        width: 100%;
        max-width: 100%;
        padding: 0 15px;
    }

    /* 画像のレスポンシブ対応 */
    img {
        max-width: 100%;
        height: auto;
    }

    /* ナビゲーションメニューの調整 */
    nav ul {
        flex-direction: column;
        padding: 0;
    }

    nav li {
        width: 100%;
        text-align: center;
        margin: 5px 0;
    }

    /* テーブルのレスポンシブ対応 */
    table {
        width: 100%;
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    /* フォームの調整 */
    input[type="text"],
    input[type="email"],
    textarea {
        width: 100%;
        box-sizing: border-box;
    }

    /* ボタンのサイズ調整 */
    button {
        width: 100%;
        margin: 10px 0;
    }
}