#qrcode .qrcode_button{font-size: 16px;color: #fff;background: #2b69ff;padding: 14px 30px;border-radius: 999px;cursor: pointer;font-weight: bold;display: inline-block;}
@media (max-width: 1024px) {
    #qrcode .qrcode_button{font-size: 14px;padding: 2.5vw 5vw;}
}

#qrcode #header{position: absolute;top: 0;left: 0;background-color: unset;}
#qrcode .banner{height: 649px;background: url(../../images/platform/qr_code_generator/banner.jpg) no-repeat center;display: flex;align-items: center;justify-content: center;}
#qrcode .banner .title{font-size: 60px;font-weight: bold;color: #fff;text-align: center;}
#qrcode .banner .desc{font-size: 20px;color: #fff;text-align: center;margin-top: 30px;}
#qrcode .banner .box{display: flex;gap: 30px;margin-top: 50px;overflow: hidden;justify-content: center;}
#qrcode .banner .box img{max-width: calc((100% - 120px) / 5);}
@media (max-width: 1024px) {
    #qrcode .banner .title{font-size: 6vw;}
    #qrcode .banner .desc{font-size: 4vw;margin-top: 20px;}
    #qrcode .banner .box{gap: 20px;margin-top: 25px;}
}
@media (max-width: 500px) {
    #qrcode .banner .box{flex-wrap: wrap;}
    #qrcode .banner .box img{max-width: none;max-width: calc((100% - 40px) /  3);}
}

#qrcode .trusted{padding-top: 70px;padding-bottom: 50px;}
#qrcode .trusted .top_title{font-size: 40px;font-weight: bold;text-align: center;}
#qrcode .trusted .trusted_box{display: flex;gap: 30px;margin-top: 35px;flex-wrap: wrap;}
#qrcode .trusted .trusted_box .item{width: calc((100% - 90px) / 4);height: 110px;box-shadow: 0 0 18px #20199510;display: flex;justify-content: center;align-items: center;border-radius: 10px;padding: 10px;box-sizing: border-box;}
@media (max-width: 1024px) {
    #qrcode .trusted{padding: 10vw 0;}
    #qrcode .trusted .top_title{font-size: 6vw;}
    #qrcode .trusted .trusted_box{gap: 15px;}
    #qrcode .trusted .trusted_box .item{width: calc((100% - 15px) / 2);height: 80px;padding: 20px;}
}

#qrcode .inone{padding-top: 50px;padding-bottom: 100px;}
#qrcode .inone .top_title{font-size: 40px;font-weight: bold;text-align: center;}
#qrcode .inone .top_desc{font-size: 20px;text-align: center;margin-top: 10px;}
#qrcode .inone .inone_box{margin-top: 60px;}
#qrcode .inone .inone_box .image_text{display: flex;gap: 50px;align-items: center;margin-top: 70px;}
#qrcode .inone .inone_box .image_text.right .image{order: 2;}
#qrcode .inone .inone_box .image_text:first-child {margin-top: 0;}
#qrcode .inone .inone_box .image_text .text{flex: 1;}
#qrcode .inone .inone_box .image_text .text .title{font-size: 30px;font-weight: bold;}
#qrcode .inone .inone_box .image_text .text .desc{font-size: 18px;line-height: 1.6;margin-top: 15px;}
#qrcode .inone .inone_box .image_text .text .list{margin-top: 15px;}
#qrcode .inone .inone_box .image_text .text .list p{font-size: 16px;padding: 10px 0;background: url(../../images/platform/qr_code_generator/icon_check.png) left center no-repeat;padding-left: 35px;}
#qrcode .inone .inone_box .image_text .text .qrcode_button{margin-top: 25px;}
@media (max-width: 1024px) {
    #qrcode .inone{padding: 10vw 0;}
    #qrcode .inone .top_title{font-size: 6vw;}
    #qrcode .inone .top_desc{font-size: 4vw;}
    #qrcode .inone .inone_box{margin-top: 30px;}
    #qrcode .inone .inone_box .image_text{flex-wrap: wrap;gap: 20px;margin-top: 30px;}
    #qrcode .inone .inone_box .image_text .image{width: 100%;text-align: center;}
    #qrcode .inone .inone_box .image_text.right .image{order: inherit;}
    #qrcode .inone .inone_box .image_text .text .title{font-size: 5vw;}
    #qrcode .inone .inone_box .image_text .text .desc{font-size: 4vw;}
    #qrcode .inone .inone_box .image_text .text .qrcode_button{margin-top: 10px;}
    #qrcode .inone .inone_box .image_text .text .list p{font-size: 3.5vw;}
}

#qrcode .features{background-color: #4f46e5;padding-top: 65px;padding-bottom: 80px;}
#qrcode .features .top_title{font-size: 40px;font-weight: bold;text-align: center;color: #fff;}
#qrcode .features .features_box{margin-top: 35px;display: flex;gap: 30px;}
#qrcode .features .features_box .item{width: calc((100% - 90px) / 4);background-color: #fff;border-radius: 10px;padding: 30px;box-sizing: border-box;}
#qrcode .features .features_box .item .icon{width: 70px;height: 70px;background-color: #4f46e5;border-radius: 20px;display: flex;justify-content: center;align-items: center;}
#qrcode .features .features_box .item .title{font-size: 20px;font-weight: bold;color: #160042;margin-top: 15px;}
#qrcode .features .features_box .item .desc{font-size: 14px;color: #4f4b78;line-height: 1.8;margin-top: 10px;}
#qrcode .features .button{text-align: center;margin-top: 40px;}
#qrcode .features .button a{background-color: #ff9726;}
@media (max-width: 1024px) {
    #qrcode .features{padding: 10vw 0;}
    #qrcode .features .top_title{font-size: 6vw;}
    #qrcode .features .features_box{flex-wrap: wrap;gap: 20px;margin-top: 25px;}
    #qrcode .features .features_box .item{width: 100%;padding: 20px;}
    #qrcode .features .features_box .item .icon{width: 50px;height: 50px;border-radius: 10px;}
    #qrcode .features .features_box .item .icon img{width: 50%;}
    #qrcode .features .features_box .item .title{font-size: 4.5vw;}
    #qrcode .features .features_box .item .desc{font-size: 3.5vw;}
}

#qrcode .maker{padding-top: 85px;padding-bottom: 100px;background-color: #f7faff;}
#qrcode .maker .top_title{font-size: 40px;font-weight: bold;text-align: center;}
#qrcode .maker .maker_box{margin-top: 60px;position: relative;}
#qrcode .maker .maker_box .button{width: 40px;height: 40px;background-color: #000;border-radius: 40px;position: absolute;top: 50%;left: 0;z-index: 2;transform: translateY(-50%);cursor: pointer;}
#qrcode .maker .maker_box .button::after{width: 10px;height: 10px;border-color: #fff;border-style: solid;border-width: 2px 2px 0 0;position: absolute;left: 16px;top: 14px;transform: rotate(-135deg);content: '';}
#qrcode .maker .maker_box .button.next{right: 0;left: auto;}
#qrcode .maker .maker_box .button.next::after{transform: rotate(45deg);left: 12px;}
#qrcode .maker .maker_box .swiper-container{width: 1040px;max-width: calc(100% - 100px);margin: 0 auto;}
#qrcode .maker .maker_box .swiper-slide{display: flex;align-items: center;}
#qrcode .maker .maker_box .swiper-slide .img{width: 390px;height: 390px;border-radius: 20px;overflow: hidden;}
#qrcode .maker .maker_box .swiper-slide .info{flex: 1;margin-left: 50px;}
#qrcode .maker .maker_box .swiper-slide .info .title{font-size: 30px;font-weight: bold;}
#qrcode .maker .maker_box .swiper-slide .info .desc{font-size: 18px;line-height: 1.8;margin-top: 15px;}
@media (max-width: 1024px) {
    #qrcode .maker{padding: 10vw 0;}
    #qrcode .maker .top_title{font-size: 6vw;}
    #qrcode .maker .maker_box{margin-top: 20px;}
    #qrcode .maker .maker_box .swiper-slide{flex-wrap: wrap;}
    #qrcode .maker .maker_box .swiper-slide .img{width: 100%;height: auto;text-align: center;}
    #qrcode .maker .maker_box .swiper-slide .info{margin-left: 0;margin-top: 10px;}
    #qrcode .maker .maker_box .swiper-slide .info .title{font-size: 5vw;}
    #qrcode .maker .maker_box .swiper-slide .info .desc{font-size: 3.5vw;line-height: 1.6;margin-top: 5px;}
}