/* ≤ 1399.98px (xl ลงมา) */
@media (max-width: 1399.98px) {}

/* ≤ 1199.98px (lg ลงมา) */
@media (max-width: 1199.98px) {

    .bpRewardFrameObject.left {
        top: 0px;
        left: 0px;
    }

    .bpRewardFrameObject.right {
        top: 0px;
        right: 0px;
    }

    .rewardItemContentMainLayout.higher {
        height: 750px;
        min-height: 750px;
    }
}

@media (max-width: 997px) {
    .rewardItemContentMainLayout.high03 {
        height: 210px;
        min-height: 210px;
    }
}

/* ≤ 991.98px (md ลงมา) */
@media (max-width: 991.98px) {
    .bpMainLayout {
        padding: 50px 20px;
    }

    .bpRewardLogo {
        width: 100%;
        max-width: 600px;
    }
}

/* ≤ 767.98px (sm ลงมา) */
@media (max-width: 767.98px) {
    .bpBgObject {
        display: none;
    }

    .bpBgCharacter {
        width: 1400px;
    }

    .bpBtnMainWeb {
        width: 200px;
        height: 40px;
        padding: 5px 14px;
    }

    .bpBtnMainWeb span {
        font-size: 25px;
        line-height: 15px;
    }

    .bpBtnSubWeb {
        width: 150px;
        height: 30px;
        padding: 0px 11px;
        padding-bottom: 7px;
    }

    .bpBtnSubWeb span {
        font-size: 18px;
    }

    .rewardItemContentMainLayout.higher {
        height: 1320px;
        min-height: 1320px;
        gap: 5px;
    }

    .rewardItemContent {
        width: 100%;
        min-height: 100%;
        align-items: center;
        justify-content: start;
        gap: 10px;
        flex-wrap: nowrap;
        flex-direction: column;
    }

    .rewardItemTitle {
        font-size: 25px;
        line-height: 30px;
    }

    .rewardItemContent {
        width: 100%;
        min-height: auto;
        height: 100%;
    }

    .rewardItemNoLayout {
        width: 100%;
        min-width: 100%;
        height: fit-content;
    }

    .rewardItemContentMainLayout {
        flex-direction: column;
    }

    .bpContentMainLayout {
        justify-content: center;
        padding: 0px;
    }

    .bpRewardContentFrame {
        padding: 20px 10px;
    }

    .bpRewardLogoMainLayout {
        height: 300px;
        padding: 20px 10px;
        margin-bottom: 10px;
    }

    .rewardItemContentMainLayout {
        min-height: 145px;
    }

    .rewardItemContentMainLayout.high {
        height: 300px;
        min-height: auto;
    }

    .rewardItemContentMainLayout.high .rewardItemContent {
        justify-content: center;
    }

    .bprewardLayoutItemSpecial {
        height: 480px;
        align-items: start;
    }

    .reward_noteLayout {
        font-size: 13px;
    }

    .bprewardLayoutItemSpecial02 {
        width: 100%;
        height: 595px;
        justify-content: start;
    }

    .rewardNoteItem.special2 {
        height: 548px;
    }

    #Lv_2500_Baphomet,
    #title_2500 {
        border-radius: 0px 0px 0px 0px
    }

    #Lv_2500_Moonlight,
    #item_2500 {
        border-radius: 0px 0px 30px 30px
    }

    .rewardItemContentMainLayout.high02 {
        height: 410px;
        min-height: auto;
    }

    .rewardItemContentMainLayout.high03 {
        height: 350px;
        min-height: 350px;
    }
}

/* ≤ 575.98px (xs / mobile เล็กสุด) */
@media (max-width: 575.98px) {
    .bpRewardObjectTitle {
        display: none;
    }

    .rewardItemTitle {
        font-size: 20px;
        line-height: 22px;

        width: 100%;
        height: 80px;
        padding: 10px;
    }

    .rewardItem {
        flex-direction: column;
        gap: 5px;
    }

    .rewardItemContentMainLayout {
        min-height: auto;
        height: 200px;
    }

    .rewardItemContentMainLayout .rewardItemContent {
        justify-content: center;
    }

}


@media (max-width: 360px) {

    .bpRewardLogoMainLayout {
        height: 200px;
        padding: 20px 10px;
        margin-bottom: 10px;
    }

    .bpBtnSubWeb {
        width: 100px;
    }

    .reward_noteLayout {
        font-size: 11px;
        line-height: 15px;
    }
}