.bdVert {
width: 100%;
margin: 100px 0 150px 0;
}
.bdVert__inner {
position: relative;
width: 100%;
max-width: 1353px;
justify-content: flex-end;
background-color: var(--green);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}
.bdVert__inner figure {
position: absolute;
top: 50%;
left: 5%;
width: 30%;
height: calc(100% + 40px);
transform: translateY(-50%);
background-color: #fff;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}
.bdVert__inner figure img {
position: absolute;
top: 50%;
left: 50%;
width: 50%;
height: 50%;
object-fit: contain;
transform: translate(-50%, -50%);
}
.bdVert__content {
width: calc(60% - 70px);
padding: 120px 70px 110px 0;
align-items: flex-start;
}
.bdVert__content * {
color: var(--white);
}
.bdVert__content h2 {
font-size: var(--fontSizeH3);
font-weight: 800;
text-transform: none;
margin: 0;
}
.bdVert__content p {
font-weight: 500;
}
@media (max-width: 1280px) {
.bdVert {
margin: 30px 0 50px 0;
}
}
@media (max-width: 550px) {
.bdVert__inner {
flex-direction: column;
}
.bdVert__content {
width: calc(100% - 80px);
padding: 220px 40px 40px 40px
}
.bdVert__inner figure {
top: 80px;
width: 50%;
min-width: 200px;
height: 200px;
}
}