.riderBanner {
    background-image: url("../webp_img/riderBackground.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.riderBanner.customPadding {
    padding-top: clamp(52.34375px, 13.958333333333334vw, 268.0px);
}

.riderBanner .left {
    width: clamp(69.921875px, 18.645833333333336vw, 358.0px);
    margin-top: clamp(8.203125px, 2.1875vw, 42.0px);
    margin-right: clamp(23.2421875px, 6.197916666666667vw, 119.0px);
}

.riderBanner .left .titleGroup h1 {
    font-family: 'PingFang-Bold';
    font-size: clamp(7.03125px, 1.875vw, 36.0px);
    font-weight: bold;
    line-height: normal;
    letter-spacing: 0em;
    color: #fff;
    margin-bottom: clamp(7.8125px, 2.0833333333333335vw, 40.0px)
}

.riderBanner .left .titleGroup img{
    width: 100%;
}

.riderBanner .left .titleGroup p {
    font-family: 'PingFang-Light';
    font-size: clamp(3.515625px, 0.9375vw, 18.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0px;
    /* 纯黑 */
    color: #fff;
}

.riderBanner .contentGroup {
    border-radius: clamp(4.6875px, 1.25vw, 24.0px);
    opacity: 1;
    background: rgb(255 255 255 / 8%);
    backdrop-filter: blur(20px);
    padding: clamp(9.9609375px, 2.65625vw, 51.0px) clamp(14.0625px, 3.75vw, 72.0px);
    width: clamp(100.0px, 26.666666666666668vw, 512.0px);
    height: clamp(132.8125px, 35.41666666666667vw, 680.0px);
}

.riderBanner .contentGroup h2 {
    font-family: PingFang-Light;
    font-size: clamp(3.90625px, 1.0416666666666667vw, 20.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0px;
    color: #FFFFFF;
    margin-bottom: clamp(9.765625px, 2.604166666666667vw, 50.0px);
}

.riderBanner .contentGroup input {
    background-color: unset;
    border: 0;
    border-radius: 0;
    border-bottom: 1px rgba(255, 255, 255, 0.1) solid;
    color: #fff;
    font-family: PingFang-Regular;
    font-size: clamp(3.515625px, 0.9375vw, 18.0px);
    padding: clamp(3.125px, 0.8333333333333334vw, 16.0px) 0;
    margin-bottom: clamp(3.90625px, 1.0416666666666667vw, 20.0px);
}

.riderBanner .contentGroup input::placeholder {
    font-family: PingFang-Regular;
    font-size: clamp(3.515625px, 0.9375vw, 18.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: normal;
    color: rgba(255, 255, 255, 0.6);
}

.riderBanner .contentGroup input:focus {
    color: #fff;
    box-shadow: none;
}

.riderBanner .contentGroup input:focus~label {
    color: #fff !important;
}

.riderBanner .contentGroup input:focus~label::after {
    background: unset;
    border: 0;
    border-radius: 0;
}

.riderBanner form {
    text-align: center;
}

.riderBanner button {
    width: clamp(33.203125px, 8.854166666666668vw, 170.0px);
    border-radius: clamp(5.859375px, 1.5625vw, 30.0px);
    border: 0;
    font-family: PingFang-Light;
    font-size: clamp(3.515625px, 0.9375vw, 18.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0px;
    color: #FFFFFF;
    background: linear-gradient(177deg, #FF346D -5%, #FF081F 129%), #FF3535;
}


.form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label{
    background: unset;
    border: 0;
    border-radius: 0;
    color: #fff !important;
}

.form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after{
    background: unset;
    border: 0;
    border-radius: 0;
    color: #fff !important;
}

.btn:hover {
    color: #fff;
    background: linear-gradient(177deg, #FF346D -5%, #FF081F 129%), #FF3535;
    border: 0;
}


.whyJoin .left {
    width: clamp(75.5859375px, 20.15625vw, 387.0px);
    margin-right: clamp(12.5px, 3.3333333333333335vw, 64.0px);
}

.whyJoin .right {
    width: clamp(133.203125px, 35.520833333333336vw, 682.0px);
}

.whyJoin .right .contentGroup svg {
    width: clamp(8.59375px, 2.291666666666667vw, 44.0px);
    height: clamp(8.59375px, 2.291666666666667vw, 44.0px);
    margin-right: clamp(5.078125px, 1.3541666666666667vw, 26.0px);
}

.whyJoin .right .title {
    margin-bottom: clamp(1.953125px, 0.5208333333333334vw, 10.0px);
}

.whyJoin .right h3 {
    font-family: PingFang-Medium;
    font-size: clamp(14px, 1.45833333vw, 28px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0.04em;
    color: #0D133B;
    margin-bottom: 0;
}

.whyJoin .right p {
    font-family: PingFang-Light;
    font-size: clamp(4.296875px, 1.1458333333333335vw, 22.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #0D133B;
    margin-left: calc(clamp(8.59375px, 2.291666666666667vw, 44.0px) + clamp(5.078125px, 1.3541666666666667vw, 26.0px));
    margin-bottom: 0;
}

.whyJoin .left h2{
    font-family: PingFang-Bold;
    font-size: clamp(8.59375px, 2.291666666666667vw, 44.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0.04em;
    color: #0D133B;
}

.whyJoin .left p{
    font-family: PingFang-Light;
    font-size: clamp(4.296875px, 1.1458333333333335vw, 22.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #0D133B;
}

.whyJoin .right .item {
    margin-bottom: clamp(20.703125px, 5.520833333333334vw, 106.0px);
}

.whyJoin .right .item:last-child {
    margin-bottom:  0;
}

.requirement .titleGroup{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin-bottom: clamp(14.6484375px, 3.90625vw, 75.0px);
}

.requirement .titleGroup h2 {
    font-family: PingFang-Bold;
    font-size: clamp(8.59375px, 2.291666666666667vw, 44.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0.04em;
    color: #0D133B;
    margin: 0;
}

.requirement .titleGroup p {
    font-family: PingFang-Light;
    font-size: clamp(4.296875px, 1.1458333333333335vw, 22.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #0D133B;
    margin: 0;
    width: clamp(73.6328125px, 19.635416666666668vw, 377.0px);
}

.requirement .contentGroup {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
}

.requirement .contentGroup .card {
    width: 100%;
    text-align: center;
    border: 0;
}

.requirement .contentGroup .card .card-img img{
    width: clamp(29.296875px, 7.8125vw, 150.0px);
    height: clamp(29.296875px, 7.8125vw, 150.0px);
}

.requirement .contentGroup .card .card-body{
    padding: 0;
}

.requirement .contentGroup .card h3 {
    font-family: PingFang-MediumU;
    font-size: clamp(5.46875px, 1.4583333333333335vw, 28.0px);
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.04em;
    color: #0D133B;
}

.requirement .contentGroup .card p {
    font-family: PingFang-Light;
    font-size: clamp(3.515625px, 0.9375vw, 18.0px);
    font-weight: normal;
    line-height: normal;
    text-align: center;
    letter-spacing: normal;
    color: #0D133B;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* 限制显示 3 行 */
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.requirement .contentGroup .item {
    justify-content: flex-start;
    align-items: center;
    width: clamp(64.453125px, 17.1875vw, 330.0px);
}


.requirement .contentGroup .item:nth-child(1),
.requirement .contentGroup .item:nth-child(2),
.requirement .contentGroup .item:nth-child(3){
    margin-bottom: clamp(24.4140625px, 6.510416666666667vw, 125.0px);
}


.requirement .contentGroup .item:nth-child(2){
    margin: 0 clamp(7.8125px, 2.0833333333333335vw, 40.0px);
}

.requirement .contentGroup .item:nth-child(4) {
    margin-right: clamp(7.8125px, 2.0833333333333335vw, 40.0px);
}

.incentive .titleGroup {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    margin-bottom: clamp(16.015625px, 4.270833333333334vw, 82.0px);
}

.incentive .titleGroup h2 {
    font-family: PingFang-Bold;
    font-size: clamp(8.59375px, 2.291666666666667vw, 44.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0.04em;
    color: #0D133B;
    margin: 0;
}

.incentive .titleGroup p {
    font-family: PingFang-Light;
    font-size: clamp(4.296875px, 1.1458333333333335vw, 22.0px);
    font-weight: normal;
    line-height: normal;
    text-align: left;
    letter-spacing: normal;
    color: #0D133B;
    width: clamp(96.87500000000001px, 25.833333333333336vw, 496.0px);
}

.incentive .contentGroup img {
    width: 100%;
}

.section4 .titleGroup {
    margin-bottom: clamp(13.0859375px, 3.4895833333333335vw, 67.0px);
}

.section4 .titleGroup h2{
    font-family: PingFang-Bold;
    font-size: clamp(8.59375px, 2.291666666666667vw, 44.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0.04em;
    color: #000000;
}

.section4 .contentGroup .item h3{
    font-family: PingFang-Medium;
    font-size: clamp(3.515625px, 0.9375vw, 18.0px);
    font-weight: normal;
    line-height: clamp(13.671875px, 3.6458333333333335vw, 70.0px);
    letter-spacing: 0px;
    color: #000000;
    position: relative;
}

.section4 .contentGroup .item h3 i{
    position: absolute;
    right: 0;
    opacity: 0;
}

.section4 .contentGroup .item h3 .bi-chevron-up{
    opacity: 1;
}

.section4 .contentGroup .item h3.collapsed .bi-chevron-down{
    opacity: 1;
}

.section4 .contentGroup .item h3.collapsed .bi-chevron-up{
    opacity: 0;
}

.section4 .contentGroup .item .card{
    border: 0px;
    padding: 0;
    font-family: PingFang-Light;
    font-size: clamp(3.515625px, 0.9375vw, 18.0px);
    font-weight: normal;
    line-height: normal;
    letter-spacing: 0px;
    color: #000000;
    margin-bottom: 1rem;
    width: 85%;
}

.section4 .contentGroup .item .card p {
    margin-bottom: 0;
}

.line {
    opacity: 0.6;
    border-top: 1px solid #D8D8D8;
    margin-bottom: 1rem;
}

#chooseYourVehicle, #chooseYourCountry {
    background-color: unset;
    border: 0;
    color: rgba(255, 255, 255, 0.6);
    border-radius: 0;
    border-bottom: 1px rgba(255, 255, 255, 0.1) solid;
    font-family: PingFang-Regular;
    font-size: clamp(3.125px, 0.8333333333333334vw, 16.0px);
    padding: clamp(3.125px, 0.8333333333333334vw, 16.0px) 0;
    -webkit-appearance: none;  /* 去除Webkit浏览器（如Chrome, Safari）的默认样式 */
    -moz-appearance: none;     /* 去除Firefox的默认样式 */
    appearance: none;          /* 标准化样式 */
    background-image: none;
}

#chooseYourVehicle:focus, #chooseYourCountry:focus {
    box-shadow: unset;
}

.chooseYourVehicle {
    margin-bottom: clamp(3.90625px, 1.0416666666666667vw, 20.0px);
}

.chooseYourCountry input{
    margin-bottom: 0 !important;
}

.chooseYourCountry {
    margin-bottom: clamp(9.765625px, 2.604166666666667vw, 50.0px);
    display: flex;
    align-items: flex-end;
    justify-content: center;
}