@charset "UTF-8";
/* ==========================================================
   会場別ページ（/user_data/hall/〇〇）共通CSS
   ・4会場（大阪城ホール・オリックス劇場・心斎橋VARON・Zepp Namba）で共用
   ・すべて .page_hall の中に閉じる（他ページへ影響させない）
   ・見出し（.oshikatsu_common_ttl）は推し活ページの既存スタイルをそのまま使う
   ========================================================== */

/* 行末に1〜2文字だけ残る改行を減らす（対応ブラウザのみ） */
.page_hall {
    text-wrap: pretty;
}

/* ---------- H1＋結論 ---------- */
.page_hall .hall_head {
    padding: 40px 0 70px;
}

.page_hall .hall_head .hall_bread {
    font-size: 13px;
    color: #777;
    margin-bottom: 30px;
}

.page_hall .hall_head .hall_bread a {
    color: #777;
    text-decoration: underline;
}

.page_hall .hall_head .hall_title {
    font-size: 34px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .04em;
    color: var(--main-color);
    margin-bottom: 8px;
}

.page_hall .hall_head .hall_updated {
    font-size: 13px;
    color: #777;
    margin-bottom: 24px;
}

.page_hall .hall_head .hall_badge_list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px;
}

.page_hall .hall_head .hall_badge_list li {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    background-color: var(--main-color);
    border-radius: 999px;
    padding: .4em 1.2em;
}

.page_hall .hall_head .hall_answer {
    background-color: #f5f9f7;
    border: 1px solid #cfdfd7;
    border-radius: 9px;
    padding: 28px 32px;
}

.page_hall .hall_head .hall_answer p {
    font-size: 16px;
    line-height: 1.9;
}

.page_hall .hall_head .hall_answer p+p {
    margin-top: .8em;
}

.page_hall .hall_head .hall_answer strong {
    color: var(--main-color);
}

/* ---------- セクション共通 ---------- */
.page_hall .hall_sec {
    padding: 80px 0;
}

.page_hall .hall_sec--soft {
    background-color: #f5f9f7;
}

.page_hall .hall_sec .hall_sub_title {
    font-size: 20px;
    font-weight: 700;
    color: var(--main-color);
    margin: 50px 0 16px;
}

.page_hall .hall_sec .hall_text {
    font-size: 16px;
    line-height: 1.9;
}

.page_hall .hall_sec .hall_text--center {
    text-align: center;
}

.page_hall .hall_sec .hall_text+.hall_check_list,
.page_hall .hall_sec .hall_check_list+.hall_text,
.page_hall .hall_sec .hall_table_wrap+.hall_text {
    margin-top: 24px;
}

.page_hall .hall_sec .hall_text a,
.page_hall .hall_sec .hall_note a {
    color: var(--main-color);
    text-decoration: underline;
}

.page_hall .hall_sec .hall_text a:hover,
.page_hall .hall_sec .hall_note a:hover {
    color: var(--main-color);
    text-decoration: none;
}

.page_hall .hall_sec .hall_note {
    font-size: 13px;
    line-height: 1.7;
    color: #666;
    margin-top: 12px;
}

/* ---------- 表 ---------- */
.page_hall .hall_sec .hall_table_wrap .hall_table {
    width: 100%;
}

.page_hall .hall_sec .hall_table_wrap .hall_table,
.page_hall .hall_sec .hall_table_wrap .hall_table th,
.page_hall .hall_sec .hall_table_wrap .hall_table td {
    border: 1px solid #cfdfd7;
    border-collapse: collapse;
}

.page_hall .hall_sec .hall_table_wrap .hall_table th,
.page_hall .hall_sec .hall_table_wrap .hall_table td {
    font-size: 15px;
    line-height: 1.7;
    text-align: left;
    vertical-align: top;
    padding: 14px 18px;
}

.page_hall .hall_sec .hall_table_wrap .hall_table th {
    font-weight: 700;
    color: var(--main-color);
    background-color: #eef4f1;
}

.page_hall .hall_sec .hall_table_wrap .hall_table td {
    background-color: #fff;
}

.page_hall .hall_sec .hall_table_wrap .hall_table--info tbody th,
.page_hall .hall_sec .hall_table_wrap .hall_table--flow tbody th {
    width: 240px;
}

.page_hall .hall_sec .hall_table_wrap .hall_table--col3 thead th {
    color: #fff;
    background-color: var(--main-color);
}

.page_hall .hall_sec .hall_table_wrap .hall_table--col3 tbody th {
    width: 240px;
}

.page_hall .hall_sec .hall_table_wrap .hall_table .hall_num {
    font-weight: 700;
    white-space: nowrap;
}

/* ---------- 番号付きリスト ---------- */
.page_hall .hall_sec .hall_check_list {
    display: grid;
    gap: 12px;
    counter-reset: hall_check;
}

.page_hall .hall_sec .hall_check_list li {
    font-size: 16px;
    line-height: 1.8;
    background-color: #fff;
    border-radius: 9px;
    position: relative;
    padding: 18px 24px 18px 64px;
    counter-increment: hall_check;
}

.page_hall .hall_sec .hall_check_list li::before {
    content: counter(hall_check);
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    background-color: var(--main-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    position: absolute;
    top: 19px;
    left: 22px;
}

.page_hall .hall_sec .hall_check_list li strong {
    color: var(--main-color);
}

.page_hall .hall_sec .hall_number_list {
    padding-left: 24px;
}

/* サイト共通のリセットで li の list-style が none になるため、li 側で番号を出す */
.page_hall .hall_sec .hall_number_list li {
    font-size: 16px;
    line-height: 1.9;
    list-style: decimal;
}

/* ---------- 納品実績 ---------- */
.page_hall .hall_sec .hall_works_list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 24px;
}

.page_hall .hall_sec .hall_works_list .item {
    width: 100%;
    background-color: #fff;
    border: 1px solid #cfdfd7;
    border-radius: 9px;
    overflow: hidden;
}

.page_hall .hall_sec .hall_works_list .item_img {
    aspect-ratio: 3 / 4;
}

.page_hall .hall_sec .hall_works_list .item_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page_hall .hall_sec .hall_works_list .item_img--dummy {
    font-size: 13px;
    color: #999;
    background-color: #eee;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page_hall .hall_sec .hall_works_list .item_cap {
    font-size: 14px;
    line-height: 1.7;
    padding: 14px 16px;
}

.page_hall .hall_sec .hall_works_list .item_cap strong {
    color: var(--main-color);
    display: block;
}

/* ---------- よくある質問 ---------- */
.page_hall .hall_sec .hall_faq dt {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.7;
    color: var(--main-color);
    position: relative;
    padding-left: 2em;
}

.page_hall .hall_sec .hall_faq dt::before,
.page_hall .hall_sec .hall_faq dd::before {
    font-weight: 700;
    position: absolute;
    top: 0;
    left: 0;
}

.page_hall .hall_sec .hall_faq dt::before {
    content: "Q.";
}

.page_hall .hall_sec .hall_faq dd {
    font-size: 16px;
    line-height: 1.9;
    position: relative;
    margin: 8px 0 0;
    padding: 0 0 22px 2em;
    border-bottom: 1px dashed #b9cec4;
}

.page_hall .hall_sec .hall_faq dd::before {
    content: "A.";
    color: #af0603;
}

.page_hall .hall_sec .hall_faq dd+dt {
    margin-top: 22px;
}

/* ---------- CTA ---------- */
.page_hall .hall_sec .hall_cta {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.page_hall .hall_sec .hall_cta--contact {
    grid-template-columns: repeat(2, 1fr);
    margin-top: 16px;
}

.page_hall .hall_sec .hall_cta .hall_cta_btn {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .02em;
    color: #fff;
    text-align: center;
    background-color: var(--main-color);
    border: 2px solid var(--main-color);
    display: block;
    width: 100%;
    padding: 1em;
    transition: .3s;
}

.page_hall .hall_sec .hall_cta .hall_cta_btn:hover {
    color: var(--main-color);
    background-color: #fff;
}

.page_hall .hall_sec .hall_cta .hall_cta_btn--line {
    background-color: #06c755;
    border-color: #06c755;
}

.page_hall .hall_sec .hall_cta .hall_cta_btn--line:hover {
    color: #06c755;
}

.page_hall .hall_sec .hall_cta .hall_cta_btn--tel {
    background-color: #af0603;
    border-color: #af0603;
}

.page_hall .hall_sec .hall_cta .hall_cta_btn--tel:hover {
    color: #af0603;
}

@media (max-width: 750px) {

    /* ---------- H1＋結論 ---------- */
    .page_hall .hall_head {
        padding: 12vw 0 10.67vw;
    }

    .page_hall .hall_head .hall_bread {
        font-size: 3.2vw;
        margin-bottom: 4vw;
    }

    .page_hall .hall_head .hall_title {
        font-size: 5.6vw;
        margin-bottom: 1.33vw;
    }

    .page_hall .hall_head .hall_updated {
        font-size: 3.2vw;
        margin-bottom: 4vw;
    }

    .page_hall .hall_head .hall_badge_list {
        gap: 2vw;
        margin-bottom: 4vw;
    }

    .page_hall .hall_head .hall_badge_list li {
        font-size: 3.2vw;
    }

    .page_hall .hall_head .hall_answer {
        padding: 4.8vw;
    }

    .page_hall .hall_head .hall_answer p {
        font-size: 3.6vw;
        line-height: 1.8;
    }

    /* ---------- セクション共通 ---------- */
    .page_hall .hall_sec {
        padding: 13.33vw 0;
    }

    .page_hall .hall_sec .hall_sub_title {
        font-size: 4.27vw;
        margin: 8vw 0 2.67vw;
    }

    .page_hall .hall_sec .hall_text {
        font-size: 3.6vw;
        line-height: 1.8;
    }

    /* SPは行数が増えるため左揃えに戻す */
    .page_hall .hall_sec .hall_text--center {
        text-align: left;
    }

    .page_hall .hall_sec .hall_text+.hall_check_list,
    .page_hall .hall_sec .hall_check_list+.hall_text,
    .page_hall .hall_sec .hall_table_wrap+.hall_text {
        margin-top: 4vw;
    }

    .page_hall .hall_sec .hall_note {
        font-size: 3.07vw;
        margin-top: 2vw;
    }

    /* ---------- 表（SPは見出し列を上に積む） ---------- */
    .page_hall .hall_sec .hall_table_wrap .hall_table th,
    .page_hall .hall_sec .hall_table_wrap .hall_table td {
        font-size: 3.47vw;
        padding: 2.67vw 3.2vw;
    }

    .page_hall .hall_sec .hall_table_wrap .hall_table--info tr,
    .page_hall .hall_sec .hall_table_wrap .hall_table--flow tr,
    .page_hall .hall_sec .hall_table_wrap .hall_table--info th,
    .page_hall .hall_sec .hall_table_wrap .hall_table--flow th,
    .page_hall .hall_sec .hall_table_wrap .hall_table--info td,
    .page_hall .hall_sec .hall_table_wrap .hall_table--flow td {
        display: block;
        width: 100%;
    }

    .page_hall .hall_sec .hall_table_wrap .hall_table--info tbody th,
    .page_hall .hall_sec .hall_table_wrap .hall_table--flow tbody th {
        width: 100%;
        border-bottom: none;
    }

    .page_hall .hall_sec .hall_table_wrap .hall_table--info tr+tr th,
    .page_hall .hall_sec .hall_table_wrap .hall_table--flow tr+tr th {
        border-top: none;
    }

    .page_hall .hall_sec .hall_table_wrap .hall_table--col3 thead th,
    .page_hall .hall_sec .hall_table_wrap .hall_table--col3 tbody th,
    .page_hall .hall_sec .hall_table_wrap .hall_table--col3 td {
        font-size: 3.2vw;
        padding: 2.67vw 2vw;
    }

    .page_hall .hall_sec .hall_table_wrap .hall_table--col3 tbody th {
        width: 34%;
    }

    .page_hall .hall_sec .hall_table_wrap {
        overflow-x: auto;
    }

    .page_hall .hall_sec .hall_table_wrap .hall_table--col3 {
        min-width: 149.33vw;
    }

    /* ---------- 番号付きリスト ---------- */
    .page_hall .hall_sec .hall_check_list {
        gap: 2.67vw;
    }

    .page_hall .hall_sec .hall_check_list li {
        font-size: 3.6vw;
        padding: 3.73vw 4vw 3.73vw 12.8vw;
    }

    .page_hall .hall_sec .hall_check_list li::before {
        font-size: 3.2vw;
        width: 5.87vw;
        height: 5.87vw;
        top: 4.27vw;
        left: 4vw;
    }

    .page_hall .hall_sec .hall_number_list {
        padding-left: 5.33vw;
    }

    .page_hall .hall_sec .hall_number_list li {
        font-size: 3.6vw;
        line-height: 1.8;
    }

    /* ---------- 納品実績 ---------- */
    .page_hall .hall_sec .hall_works_list {
        grid-template-columns: repeat(2, 1fr);
        gap: 3.2vw;
        margin-top: 4vw;
    }

    .page_hall .hall_sec .hall_works_list .item_img--dummy {
        font-size: 3.2vw;
        text-align: center;
        padding: 0 2vw;
    }

    .page_hall .hall_sec .hall_works_list .item_cap {
        font-size: 3.07vw;
        padding: 2.67vw 2vw;
    }

    /* ---------- よくある質問 ---------- */
    .page_hall .hall_sec .hall_faq dt {
        font-size: 3.87vw;
    }

    .page_hall .hall_sec .hall_faq dd {
        font-size: 3.6vw;
        line-height: 1.8;
        margin-top: 1.33vw;
        padding-bottom: 4vw;
    }

    .page_hall .hall_sec .hall_faq dd+dt {
        margin-top: 4vw;
    }

    /* ---------- CTA ---------- */
    .page_hall .hall_sec .hall_cta,
    .page_hall .hall_sec .hall_cta--contact {
        grid-template-columns: 1fr;
        gap: 2.67vw;
    }

    .page_hall .hall_sec .hall_cta--contact {
        margin-top: 2.67vw;
    }

    .page_hall .hall_sec .hall_cta .hall_cta_btn {
        font-size: 3.6vw;
    }

    /* SPは既存ボタン（.oshikatsu_common_btn）に合わせてホバーで色を反転させない */
    .page_hall .hall_sec .hall_cta .hall_cta_btn:hover {
        color: #fff;
        background-color: var(--main-color);
    }

    .page_hall .hall_sec .hall_cta .hall_cta_btn--line:hover {
        background-color: #06c755;
    }

    .page_hall .hall_sec .hall_cta .hall_cta_btn--tel:hover {
        background-color: #af0603;
    }
}