.banner {
    background: url("/assets/images/backgrounds/bg_recommend-reward.jpg") no-repeat center;
    background-size: cover;
}
.banner .container{
    padding-top: 115px;
    padding-bottom: 170px;
    position: relative;
}
.banner .f-48{
    font-family:'Myriad Pro', Helvetica, Arial, sans-serif;
    font-size: 48px;
    font-weight: bold;
    line-height: 70px;
    color: #ffffff;
    max-width: 55%;
}
.banner .f-18{
    font-size: 18px;
    color: #ffffff;
    line-height:25px;
    max-width: 50%;
}
.banner img{
    position: absolute;
    bottom: 0;
    right: -50px;
}
.two .container{
    padding-top: 90px;
    padding-bottom: 90px;
}
 h2{
    max-width: 450px;
    font-size: 36px;
    font-weight: bold;
    color: #fff;
    margin: auto;
    background-color: #091871;
    border-radius: 20px;
    text-align: center;
    line-height: 78px;
    position: relative;
    z-index:10;
    box-shadow: 10px 10px 5px #d5ebff;
}
.two .f-16{
    margin-top: 48px;
    margin-bottom: 70px;
    text-align: center;
    color: #2f2f2f;
    line-height: 24px;
}
.two .f-16 strong{
    color: #50adfe;
    font-weight: bold;
}
.two .toggle-btn {
    max-width: 600px;
    margin: auto;
    position: relative;
}
.two hr{
    content: '';
    display: block;
    position: relative;
    border: none;
    height: 1px;
    background:  #091871;;
    margin: 0;
}
.toggle-btn li{
    width: 45%;
    margin: 0 15px;
    background-color: #d5ebff;
    border-radius: 10px 10px 0px 0px;
 }
.two .toggle-btn li:last-child{
    margin-right: 0;
}
.two .toggle-box .nav-tabs li.active a::after {
    bottom: -20px;
}
.two .toggle-box .nav-tabs li.active a::before {
    bottom: 2px;
}
.two .tab-content{
    margin-top: 40px;
}
.tab-content .f-16{
    max-width: 90%;
    margin:0  auto 65px;

}
.two  #one strong{
    color: #2f2f2f;
}
.two .tab-content h3{
    background-color: #091871;
    border-radius: 20px;
    max-width: 470px;
    margin: auto;
    text-align: center;
    font-size: 36px;
    font-weight: bold;
    line-height: 78px;
    color: #ffffff;
    box-shadow: 10px 10px 5px #d5ebff;
}
.icon1-3{
    margin-top: 75px;
}
.icon1-3 ul{
    margin-top: 55px;
    text-align: center;
}
.icon1-3 ul li{
    display: inline-block;
    vertical-align: middle;
    margin:0 27px;
    font-size: 22px;
    text-align: center;
    color: #2f2f2f;
}
.icon1-3 ul li p{
    padding-top: 50px;
}
.icon1-3 ul li:nth-of-type(even){
    margin-top: -50px;
}
.detail{
    max-width: 980px;
    margin: auto;
    padding-top: 100px;
}
.detail h5{
    font-size: 22px;
    font-weight: bold;
    color: #091871;

}
.detail ul li{
    font-size: 16px;
    color: #2f2f2f;
    line-height: 26px;
    margin-top: 15px;
}
.benefit{
    background-color: #f2f2f2;
}
.benefit .container{
    padding-top: 85px;
    padding-bottom: 85px;

}
.benefit h2{
    max-width: 600px;
}
.benefit .f-16 {
    color: #2f2f2f;
    text-align: center;
    max-width: 870px;
    margin: 45px auto 75px;
    line-height: 24px;
}

.benefit .combination-box{
    background-color: #ffffff;
    box-shadow: 0px 3px 18px 0px
    rgba(87, 108, 234, 0.35);
    border-radius: 20px;
    max-width: 1050px;
    margin: 0 auto 50px;
}
.benefit .combination-box .cnt{
    padding: 12px 60px;
}
.benefit .combination-box h4{
    padding-top: 15px;
    font-size: 22px;
    font-weight: bold;
    color: #000000;
}
.benefit .combination-box ul li{
    font-size: 14px;
    color: #000000;
    margin-bottom: 15px;
}
.benefit .combination-box .img,.combination-box .right{
    vertical-align: middle;
}
.benefit .combination-box .right{
    width: auto;
    max-width: 670px;
    margin-left: 50px;
}
.benefit .example{
    max-width: 1050px;
    margin: auto;
}
.benefit  .example h5{
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    line-height: 26px;
    color: #2f2f2f;
    margin-bottom: 20px;
}
.benefit .example p{
    font-size: 16px;
    line-height: 26px;
    color: #2f2f2f;
}
.benefit .notes{
    margin-top: 50px;
    background-color: #091871;
    border-radius: 20px;
    padding: 35px 60px;
}
.benefit .notes .left{
    max-width: 710px;
}
.benefit .notes .left b{
    font-size: 22px;
    font-weight: bold;
    line-height: 26px;
    color: #ffffff;
}
.benefit .notes .left li{
    padding-left: 35px;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
    margin-top: 15px;
}
.benefit .notes .left li a{
    color: #fff;
    text-decoration: underline;
}
.benefit .notes .left , .benefit .notes img{
    display: inline-block;
    vertical-align: middle;

}
.icon-left[class*='dots'] li::before, .icon-left[class*='dots'] p::before {
    border: 3px solid #091871;
    border-radius: 50%;
    top: 8px;
}
@media (max-width: 1198px){
    .icon1-3 ul li{
        max-width: 21.5%;
    }
    .icon1-3 ul li:nth-of-type(even){
        max-width: 5%;
    }
}
@media (max-width: 991px) {
    .banner img{
        display: none;
    }
    .benefit .combination-box .right{
        margin-left: auto;
    }

    .banner .f-48,.banner .f-18{
        max-width: 100%;
    }
    .icon1-3 ul li:nth-of-type(even){
        display: none;
    }
    .icon1-3 ul li{
        max-width: 100%;
    }
    .benefit .combination-box .cnt{
        padding: 12px 15px;
        text-align: center;
    }
    .benefit .combination-box ul li {
        text-align: left;
    }
    .benefit .notes{
        padding: 35px 15px;
    }
    .toggle-btn li{
        width: 100%;
        margin-bottom: 20px;
    }
}