/* START product */

.product .uniformSpacing{
    display: flex;
    flex-direction: column;
    gap: 4em;
}

.product .uniformSpacing .introText img{
    width: 100%;
    height: auto;
    aspect-ratio: 21/9;
    object-fit: cover;
}

.product .uniformSpacing .tech h2,
.product .uniformSpacing .pointFort h2{
    width: 100%;
    border-bottom: 1px solid var(--basicColor2);
}

.product .uniformSpacing .tech,
.product .uniformSpacing .pointFort{
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}

.product .uniformSpacing .tech .container .text,
.product .uniformSpacing .pointFort .container .text{
    display: flex;
    flex-direction: column;
    gap: .5em;
}

.product .uniformSpacing .tech .container .text p,
.product .uniformSpacing .pointFort .container .text p{
    display: flex;
    flex-direction: column;
    gap: .5em;
}


.product .uniformSpacing .tech .container{
    display: flex;
    gap: 3em;
}

.product .uniformSpacing .tech .container > img,
.product .uniformSpacing .tech .container > div{
    width: 50%;
}

.product .uniformSpacing .tech .container img{
    background: #F5F5F5 0% 0% no-repeat padding-box;
    object-fit: cover;
}

@media screen and (max-width: 1400px) {
    .product .uniformSpacing .tech .container{
        flex-direction: column;
        gap: 1.5em;
    }

    .product .uniformSpacing .tech .container img{
        width: 100%;
    }
    .product .uniformSpacing .tech .container .text,
    .product .uniformSpacing .pointFort .container .text{
        width: 100%;
    }
}

@media screen and (max-width: 1200px) {
    .product .uniformSpacing .tech .container .text * {
        font-size: 18px;
    }
}

@media screen and (max-width: 800px) {
    .product .uniformSpacing .tech .container .text {
        font-size: 18px;
    }
}

@media screen and (max-width: 700px) {
    .product .uniformSpacing .tech .container .text {
        font-size: 16px;
    }
}

/* END product */