html {color: #424770;}

.text-red{color: #EB001B;}
.affiliate-banner{background: #F0F6D3;padding: 25px 0  50px;}
.affiliate-banner img{display:block;max-width: none;width: 457px;flex-shrink: 0;}
.affiliate-banner .title{font-size: 36px;padding: 24px 0 16px;font-weight: 900;line-height: 1.2;}
.affiliate-banner .tip span{font-size: 18px;font-weight: 700;}
.affiliate-banner ul{margin-top: 24px;}

.affiliate-banner .container{max-width: 1200px;flex-direction: row-reverse;padding: 0 56px;}
.affiliate-banner .join-btn{width: 160px;height: 48px;margin-top: 32px;display: inline-flex;align-items: center;justify-content: center;}
.affiliate-container {max-width: 520px;}
.affiliate-container .tip2 {margin-top: 16px;}


.working{padding: 56px 0 86px;}
.working .title{font-size: 28px;font-weight: 900;max-width: 700px;line-height: 1.2;margin:40px auto 64px auto;}
.working .container{max-width: 1112px;}
.working .cell{background: #fff;box-shadow: 0px 8px 24px rgba(0, 63, 108, 0.08);border-radius: 8px;padding: 28px 25px 30px;width: 340px;margin: 0 12px;transition: all ease-in-out 0.4s;margin-bottom: 30px;min-height: 312px;}
.working .cell:hover{transform: translateY(-5px);}
.working .cell .sub{font-size: 18px;font-weight: 700;margin: 24px 0 16px;}
.working .cont{margin: 0 -12px;margin-top: 32px;}
.working .join-btn{width: 200px;height: 48px;margin: 32px auto 0;display: inline-flex;align-items: center;justify-content: center;}

.online{margin: 60px 0 96px;}
.online .container{max-width: 1080px;background: #DEF7F5;border-radius: 50px;padding: 56px 0;}
.online .title{font-size: 28px;font-weight: 900;margin-bottom: 76px;line-height: 1.2;}
.online .cell{width: 264px;margin: 0 38px;}
.online .cell .pic{height: 140px;}
.online .cell .num{font-size: 22px;display: block;width: 48px;height: 48px;border-radius: 50%;text-align: center;line-height: 48px;background-color: #fff;color: #377DFF;margin: 26px auto 16px;}
.online .join-btn{width: 160px;height: 48px;margin-top: 32px;display: inline-flex;align-items: center;justify-content: center;}
.online .sub{font-size: 16px;padding: 16px 0;font-weight: 700;}


.faq{padding: 96px 0;}
.faq .container{max-width: 1112px;}
.faq .title{font-size: 32px;font-weight: 900;margin-bottom: 40px;line-height: 1.2;}
.faq details{width: 48%;padding-top: 16px;padding-bottom: 16px;border-top: 1px solid #EDEDF2;box-shadow: 0 1px 0 0 #EDEDF2;}
.faq details .txt{margin-top: 16px;}
.faq details summary{position: relative;padding-left: 24px;font-weight: 700;}
.faq details summary::after{content: '';width: 9px;height: 12px;background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 9 12" xmlns="http://www.w3.org/2000/svg"> <path d="M0 0V12L9 6L0 0Z" fill="rgb(47, 103, 246)"/> </svg>') no-repeat center;position: absolute;left: 0;top: 6px;}
.faq details[open] summary::after{transform: rotate(90deg);}

.join-us{padding: 96px 0 86px;}
.join-us .txt{margin-left: 56px;}
.join-us .container{max-width: 1112px;}
.join-us .cont{border: 1px solid #F9FBFD; box-shadow: 0px 24px 40px rgba(0, 58, 112, 0.08); border-radius: 8px; padding: 40px 40px 48px;}
.join-us .title{font-size: 32px;margin-bottom: 16px;font-weight: 800;}
.join-us .btn{width: 140px;height: 48px;margin-top: 24px;display: inline-flex;align-items: center;justify-content: center;}


@media (max-width: 1230px){
}

@media (max-width: 1132px){
}

@media (max-width: 960px){
    .price .title,.how-to .banner .title,.affiliate-banner .title{font-size: calc(18px + 2vw);}
    .how-to .arc h1,.how-to .arc h2,.working .title,.online .title,.join-us .title,.faq .title,.faq-cont .answer-banner .title{font-size: calc(18px + 1.6vw);}
    .working .title{margin-bottom: 30px;}
    .affiliate-banner{padding: 26px 0 60px;}
    .affiliate-banner .container{display:block; padding: 0 56px;}
    .affiliate-banner img{display: none;}
    .affiliate-container{margin:0 auto}
}

@media (max-width: 769px){
    .affiliate-banner .container{padding: 0 16px;}
    .working,.join-us,.faq{padding: 40px 0;}
    .online .cell{margin: 0 0 30px;}
    .online .container{border-radius: 0;}
    .online .title{margin-bottom: 40px;}
    .faq-cont .answer-banner .l{margin-bottom: 30px;}
    .join-us .txt{margin-left: 0;margin-top: 30px;}
}

@media (max-width: 480px){
    .price .switch .cell,.working .cell{width: fit-content;}
}