/* banner */
.distributors-banner {
    position: relative;
    background-color: #ffffff;
    padding-bottom: 10rem;
    padding-top: 13rem;
}
.distributors-banner .img {
    width: 108rem;
    height: 80rem;
}
.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: 100rem;
    height: 80rem;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
}
.distributors-info .info-card .img-box {
    position: absolute;
    width: 66.1rem;
    height: 39.7rem;
    transform: translate(0,-15rem); 
    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: 100rem;
    font-family: Rany-Bold;
    font-size: 4.8rem;
    color: #ffb300;
    transform: translate(18rem, 12rem);
}
.distributors-info .info-card .text h2 {
    width: 80rem;
    font-family: Rany-Light;
    font-size: 3rem;
    color: #000000;
    transform: translate(18rem, 15rem);
    margin-bottom: 1.5rem;
}
.distributors-info .info-card .text h2 strong {
    font-family: Rany-Bold;
    font-weight: normal;
}