/* ========================================================================== */


/* ============= RESPONSIVE CODE FOR PORTRAIT MOBILE ========================= */


/* ========================================================================== */

@media only screen and (min-width: 100px) and (max-width: 479px) {
    /***
    * Responsive section banner
    */
    .section-banner {
        margin-top: 55px;
    }
    .section-banner .item-caption {
        display: none;
    }
    /***
    * Responsive Section Introduce reward
    */
    .section-introduce-reward {
        margin-top: 56px;
    }
    .caption-intro .special-item-caption p {
        top: 20px;
        line-height: 17px;
    }
    .caption-intro .special-item-caption img {
        max-width: 152px;
    }
    .caption-intro .special-item-caption p .special-text-style-1,
    .caption-intro .special-item-caption p .special-text-style-2,
    .caption-intro .special-item-caption p .special-text-style-3,
    .caption-intro .special-item-caption p .special-text-style-5,
    .caption-intro .special-item-caption p .special-text-style-6 {
        font-size: 12px;
    }
    .caption-intro .special-item-caption p .super-special-text-style {
        font-size: 18px;
        line-height: 24px;
    }
    .caption-intro .special-item-caption p .special-text-style-4 {
        font-size: 19px;
    }
    .caption-intro .special-item-caption p .special-text-style-5 {
        font-size: 9px;
    }
    .caption-intro .special-item-caption .special-text-style-5::before,
    .caption-intro .special-item-caption .special-text-style-5::after {
        bottom: 25px;
        width: 39px;
    }
    .caption-intro .special-item-caption p .special-text-style-6 {
        font-size: 12px;
    }
    .detail-commission p {
        padding: 0 15px;
        text-align: center;
    }
    .detail-commission p:last-child {
        padding-right: 15px;
    }
    /***
    * Responsive section benefits
    */
    .pc-tablet {
        display: none;
    }
    .benefit-for-mobile {
        display: block;
    }
    /***
    * Responsive section commission
    */
    .title-commission {
        font-size: 20px;
    }
    .title-commission span {
        font-size: 26px;
    }
    .commission-for-mobile {
        display: block;
    }
    .commission-for-pc {
        display: none;
    }
    /***
    * Responsive section rewards
    */
    .table-detail-rewards {
        width: 100%;
    }
    .table-detail-rewards th {
        text-align: center;
    }
    .table-detail-rewards td {
        font-size: 13px;
        text-align: center;
    }
    .table-detail-rewards .reward-status img {
        display: block;
        margin: auto;
    }
    /***
    * Responsive section sign up
    */
    .section-sign-up .banner-text {
        margin-left: 0;
    }
    .section-sign-up .banner-text h2 {
        text-align: center;
    }
    .section-sign-up .btn-sign-up-now {
        display: block;
        margin: 18px 15px 0 15px;
        padding: 12px 50px 10px 50px;
    }
}