/* banner */
.distributors-banner {
    position: relative;
    background-color: #ffffff;
    padding-top: 4rem;
    padding-bottom: 6rem;
}
.distributors-banner .img {
    width: 193.61rem;
    height: 50.42rem;
}
.distributors-banner .text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 75rem;
    text-align: center;
}
.distributors-banner .text p {
    font-family: Rany-Medium;
    font-size: 6rem;
    color: #ffffff;
}

/* info */
.distributors-info {
    background-color: #ffffff;
    padding-bottom: 20rem;
}
.distributors-info .info-card {
    position: relative;
    background-color: #fafafa;
    width: 150rem;
    height: 40rem;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
}
.distributors-info .info-card .img-box {
    position: absolute;
    width: 50rem;
    height: 30rem;
    transform: translateX(-37.5rem); 
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2rem;
}
.distributors-info .info-card .img-box .img {
    width: 35rem;
    height: 20.7rem;
}
.distributors-info .info-card .text {
    position: absolute;
    height: 4rem;
}
.distributors-info .info-card .text h1 {
    width: 80rem;
    font-family: Rany-Bold;
    font-size: 3.6rem;
    color: #ffb300;
    transform: translate(35rem, -7rem);
}
.distributors-info .info-card .text h2 {
    width: 80rem;
    font-family: Rany-Light;
    font-size: 2.4rem;
    color: #000000;
    transform: translate(35rem, -4rem);
    margin-bottom: 1.5rem;
}
.distributors-info .info-card .text h2 strong {
    font-family: Rany-Bold;
    font-weight: normal;
}