
.banner{padding: 60px 0; background: #0092FF0A;}
.banner-cont{display: flex; align-items: center; justify-content: space-between;}
.banner-text{display: flex; flex-direction: column; gap: 20px; width: 460px;}
.banner-text h1{font-size: 40px; font-weight: 700;}
.banner-text>p{font-size: 24px;}

.features{margin-top: 160px;}
.features-title{text-align: center;}
.features-title h2{font-size: 32px; font-weight: 700;}
.features-title p{font-size: 20px; margin-top: 24px; color: #404040;}
.features-cont{margin-top: 120px; display: flex; justify-content: space-between; gap: 16px;}
.features-text{max-width: 600px;}
.features-text h3{font-size: 24px; font-weight: 700; color: #18191B;}
.features-text p{font-size: 18px; color: #404040; margin-top: 24px;}

.backdown{padding: 60px 0; margin-top: 120px; background: #0092FF0A; text-align: center;}
.backdown h2{font-size: 32px; font-weight: 700; color: #031513;}
.backdown-desc{font-size: 24px; margin: 24px auto;}
.downmode{margin-top: 36px;}
.qrcode{padding-top: 14.5px; width: 160px; height: 160px; margin: auto; background: #fff; border: 1px solid #0092FF; border-radius: 8px; box-sizing: border-box;}
.qrcode p{font-size: 16px;}

@media screen and (max-width: 1200px) {
    .features-text{max-width: 460px;}
}
@media screen and (max-width: 980px) {
    .banner{padding: 48px 0 0; text-align: center;}
    .banner-cont{flex-direction: column;}
    .banner figure{margin-top: 32px; padding: 50px 0;}
    .banner figure img{max-width: 580px; width: 100%;}
    .banner-text{gap: 24px; width: 100%;}
    .banner-text h1{font-size: 28px;}
    .banner-text>p{font-size: 16px;}
    .probtn-desk{width: 148.5px; height: 44px; margin: auto;}
    .features{margin-top: 96px;}
    .features-title h2{font-size: 20px;}
    .features-title p{font-size: 14px; margin-top: 18px;}
    .features-cont{margin-top: 48px; flex-direction: column; text-align: center;}
    .features-text{max-width: 100%; order: 2;}
    .features-text h3{font-size: 16px; color: #242424;}
    .features-text p{font-size: 14px; margin-top: 8px;}
    .backdown{margin-top: 96px;}
    .backdown .pw1200{max-width: 407px;}
    .backdown h2{font-size: 20px; color: #000;}
    .backdown-desc{font-size: 18px; color: #000;}
}

@media screen and (max-width: 568px) {
    .banner-cont{width: 100%;}
    .banner-text{width: 92%; }
    .banner figure{padding: 16px 0;}
    .features-title p{margin-top: 12px;}
    .features-cont{gap: 8px;}
    .backdown-desc{font-size: 16px;}
}