.bannerHero {
    padding: 0;
}

@media only screen and (min-width: 768px) {
    .bannerHero {
        padding: 0 16px;
    }
}

.contactBox {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contactBox .callBox {
    padding: 16px;
    border: 2px solid #A3DEFF;
    border-radius: 8px;
    width: 100%;
}

@media only screen and (min-width: 768px) {
    .contactBox .callBox {
        max-width: 685px;
    }
}

@media only screen and (min-width: 1200px) {
    .contactBox .callBox {
        padding: 32px;
    }
}

.callBox {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.callBox p {
    display: flex;
    align-items: center;
}

.callBox a {
    text-decoration: none;
}

.callBox .icoPhone {
    background-image: url("../images/icons/ico-phone.svg");
}

.storeWrapper {
    display: flex;
    width: 100%;
    align-items: center;
    flex-wrap: wrap;
}

.storeWrapper .buttonControl {
    display: flex;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
}

.storeWrapper .btnStore {
    display: flex;
    width: 104px;
    padding: 0;
    height: auto;
}

.storeWrapper .btnStore+.btnStore {
    margin-left: 8px;
}

.buttonLinks {
    display: flex;
    align-items: center;
    justify-content: center;
}

.buttonLinks .btn {
    height: 40px;
    border-radius: 8px;
    border: 1px solid #19AAF8;
    padding: 0;
    align-items: center;
    justify-content: center;
    display: flex;
    min-width: 156px;
    margin-right: 16px;
    background-color: #FFFFFF;
}

.buttonLinks .img-svg.android {
    height: 22px;
    width: auto;
}

.buttonLinks .btn:last-child {
    margin-right: 0;
}

.buttonLinks .btn .img-svg path {
    fill: #000000;
}

.buttonLinks .btn.active {
    border-color: #007AD0;
    background-color: #007AD0;
}

.buttonLinks .btn.active .img-svg path {
    fill: #FFFFFF;
}

.stepWrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.stepWrapper .stepBox {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.stepWrapper .stepBox .headStep {
    display: flex;
    align-items: flex-start;
    width: 100%;
    flex-wrap: wrap;
}

.stepWrapper .stepBox .headStep .imgBox {
    display: flex;
    width: 60px;
}

.stepWrapper .stepBox .headStep .imgBox .icons {
    display: flex;
    width: 100%;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    width: 100%;
    background: #E7EEF4;
    align-items: center;
    justify-content: center;
}

.stepWrapper .stepBox .headStep .imgBox .icons img {
    width: 32px;
    height: auto;
}

.stepWrapper .stepBox .headStep .contentBox {
    display: flex;
    width: calc(100% - 60px);
    padding-left: 8px;
    flex-direction: column;
}

.stepWrapper .contactBox {
    border-radius: 8px;
    background: rgba(231, 238, 244, 0.4);
}

.stepWrapper .howToBox {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.stepWrapper .howToBox .cardStep {
    display: flex;
    margin-bottom: 16px;
}

.stepWrapper .howToBox .imgBox {
    display: flex;
    width: 48px;
    height: 48px;
}

.stepWrapper .howToBox .imgBox img {
    align-self: center;
    width: 100%;
    height: auto;
}

.stepWrapper .howToBox .contentBox {
    display: flex;
    width: calc(100% - 80px);
    padding-left: 8px;
    flex-direction: column;
    padding-left: 16px;
    justify-content: center;
}

.cardVertical .cardStep {
    flex-direction: column;
}

.cardVertical .cardStep .btnLink {
    text-decoration: none;
}

.cardVertical .cardStep .imgBox {
    width: 100%;
    height: auto;
    width: auto;
}

.cardVertical .cardStep .imgBox img {
    max-width: 150px;
    width: 100%;
}

.cardVertical .cardStep .contentBox {
    flex-direction: column;
    width: 100%;
    padding: 0;
    margin-top: 8px;
}

.cardVertical .cardStep .contentBox ul {
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.cardVertical .cardStep .contentBox ul li {
    display: flex;
    width: 100%;
    padding-left: 15px;
    position: relative;
}

.cardVertical .cardStep .contentBox ul li::before {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #1A1A1A;
    position: absolute;
    left: 5px;
    top: 8px;
}

.giftWrapper .row {
    margin: 0 -4px;
}

.giftWrapper .row [class^=col-] {
    padding: 0 4px;
}

.giftWrapper .giftCard {
    margin-bottom: 14px;
}

@media only screen and (min-width: 768px) {
    .storeWrapper {
        max-width: max-content;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
    }
    .cardVertical .cardStep .imgBox img {
        max-width: 230px;
    }
    .stepWrapper .howToBox:not(.cardVertical) {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        justify-content: center;
    }
    .stepWrapper .howToBox:not(.cardVertical)>p {
        width: 100%;
    }
    .stepWrapper .howToBox:not(.cardVertical) .cardStep {
        width: 20%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    .stepWrapper .howToBox:not(.cardVertical) .cardStep .contentBox {
        width: 100%;
        margin-top: 8px;
        padding: 0;
    }
    .stepWrapper .stepBox .headStep .imgBox {
        width: 80px;
        margin-bottom: 16px;
    }
    .stepWrapper .stepBox .headStep .imgBox .icons {
        height: 80px;
        width: 100%;
    }
    .stepWrapper .stepBox .headStep .imgBox .icons img {
        width: 42px;
    }
    .stepWrapper .stepBox .headStep {
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .stepWrapper .stepBox .headStep .contentBox {
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }
    .stepWrapper .contactBox>p {
        margin-bottom: 0 !important;
        margin-right: 16px;
    }
    .stepWrapper .stepBox.firstStep {
        // max-width: 736px;
        max-width: 100%;
        margin: 0 auto;
    }
    .stepWrapper .stepBox .headStep .contentBox {
        width: 100%;
        align-items: center;
        justify-content: center;
    }
    .stepWrapper .stepBox .headStep .contentBox>p {
        line-height: 1.4 !important;
    }
    .stepWrapper .contactBox {
        max-width: 600px;
        width: 100%;
        margin: 0 auto;
    }
    .giftWrapper .row {
        margin: 0 -8px;
        justify-content: center;
    }
    .giftWrapper .giftCard {
        width: 80px;
        max-width: 80px;
        padding: 0 8px;
    }
    .cardVertical .cardStep .contentBox ul {
        flex-direction: row;
        justify-content: flex-start;
        margin-top: 8px;
    }
    .cardVertical .cardStep .contentBox ul li {
        width: auto;
        margin-right: 16px;
    }
    .mg-b-0D {
        margin-bottom: 0 !important;
    }
}

@media only screen and (min-width: 992px) {
    .storeWrapper {
        max-width: 685px;
    }
    .contactBox {
        justify-content: center;
        flex-direction: row;
        max-width: 685px;
        margin: 0 auto;
    }
    .cardVertical .cardStep .contentBox {
        margin-top: 16px;
    }
    .stepWrapper .cardVertical .cardStep {
        margin-bottom: 28px;
    }
    .stepWrapper .contactBox {
        max-width: 736px;
    }
    .stepWrapper .howToBox.cardVertical {
        max-width: 850px;
        margin: 0 auto;
    }
    .cardVertical .cardStep .imgBox {
        max-width: 260px;
        justify-content: center;
    }
    .wrapTc {
        max-width: 736px;
        margin: 0 auto;
    }
    .stepWrapper .firstStep .howToBox .imgBox {
        width: 60px;
        height: 60px;
    }
}

body {
    color: #1a1a1a;
}

.tabsWrapper .buttonLinks {
    border-bottom: none;
}

.tabsWrapper .nav-tabs .nav-link:focus,
.tabsWrapper .nav-tabs .nav-link:hover {
    border-color: #19AAF8;
}

.tabsWrapper .nav-tabs .nav-item {
    margin-bottom: 0;
}

.tabsWrapper .nav-tabs .nav-item+.nav-item {
    margin-left: 16px;
}

.howToBox>p>img {
    max-width: 160px;
    width: 100%;
    margin-bottom: 6px;
}

@media only screen and (min-width: 992px) {
    .howToBox>p>img {
        max-width: 200px;
    }
}

@media only screen and (min-width: 992px) {
    .howToBox {
        justify-content: center;
    }
}

.howToBox.buttonControl {
    display: flex;
    justify-content: center;
    width: 100%;
    // border-bottom: 1px solid #E5E5E5;
}

@media only screen and (max-width: 767px) {
    .howToBox.buttonControl {
        // border-top: 1px solid #E5E5E5;
        flex-direction: column;
        padding: 0 12px;
    }
    .howToBox.buttonControl .btn {
        width: 100%;
        max-width: 100%;
    }
}

.headTitle p>img {
    max-width: 138px;
    width: 100%;
    align-items: center;
}

@media only screen and (min-width: 992px) {
    .headTitle p>img {
        max-width: 200px;
    }
}

@media only screen and (min-width: 992px) {
    .th .headTitle p>img {
        max-width: 250px;
    }
}

@media only screen and (min-width: 992px) {
    .cardVertical .cardStep .imgBox {
        max-width: 260px;
        justify-content: center;
        margin: 0 auto;
    }
    .cardVertical .cardStep .imgBox img {
        max-width: 230px;
    }
}

/* Add member*/
[class*="logoMember"] {
    display: inline-block !important;
    vertical-align: middle;
}

.logoMemberM {
    max-width: 100px;
}

.logoMemberS {
    max-width: 60px;
}

@media only screen and (max-width: 767px) {
    .logoMemberM {
        max-width: 80px;
    }
}
/* End */