.component_banner {
display: flex;
position: relative;
display: flex;
align-items: center;
max-height: 1100px;
}
.component_banner > .container {
z-index: 2;
}
.component_banner .component__head {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 50px;
}
.component_banner .component__link {
width: fit-content;
min-width: 220px;
flex-shrink: 0;
}
.component_banner .component__title {
padding-right: 15px;
line-height: 120%;
}
.component_banner .component__title.style_1 {
color: var(--color-dark);
font-family: var(--font-1_Bold);
font-size: 48px;
line-height: 100%;
}
@media (max-width: 1199px) {
.component_banner .component__head {
margin-bottom: calc(0.0227272727 * 100vw + 12.7272727273px);
}
.component_banner .component__title.style_1 {
font-size: calc(0.0181818182 * 100vw + 26.1818181818px);
}
}
@media (max-width: 767px) {
.component_banner .component__title {
text-align: center;
padding-right: 0px;
}
.component_banner .component__head.type_1 {
flex-direction: column;
}
.component_banner .component__head.type_2 {
flex-direction: column;
justify-content: center;
}
.component_banner .component__link {
margin-top: 15px;
}
}
.component_banner .component__background {
position: absolute;
}
.component_banner .component__background.left {
height: 100%;
left: 0;
}
.component_banner .component__background--banner-right,
.component_banner .component__background.right_back {
right: 0;
}
.component_banner .component__background--banner-right {
z-index: 1;
}
.component_banner .component__background.right_back {
width: 50%;
height: 100%;
}
.component_banner .component__background img {
object-fit: cover;
width: 100%;
height: 100%;
}
.component_banner .component__inner {
display: grid;
grid-template-columns: 100%;
grid-row-gap: 50px;
max-width: 830px;
width: 100%;
}
.component_banner .component__text {
display: grid;
grid-row-gap: 20px;
}
.component_banner .component__options {
display: grid;
grid-row-gap: 20px;
max-width: 470px;
width: 100%;
}
.component_banner .component__link {
max-width: 330px;
}
.component_banner .field {
display: grid;
grid-auto-flow: column;
align-items: center;
justify-content: flex-start;
grid-column-gap: 20px;
}
.component_banner .field__image {
filter: var(--color-primary--filter);
}
.component_banner .field__title {
font-family: var(--font-1_Medium);
line-height: 150%;
}
@media (min-width: 3200px) {
.component_banner .component__background--banner-right {
height: 100%;
}
}
@media (min-width: 1200px) {
.component_banner {
min-height: 730px;
height: calc(100vh - 118px);
}
}
@media (max-width: 1199px) {
.component_banner {
padding-top: 90px;
padding-bottom: 60px;
}
.component_banner .component__inner {
border-radius: 15px;
padding: 15px;
background-color: rgba(var(--color-light--rgb), 0.8);
grid-row-gap: calc(0.0340909091 * 100vw + 9.0909090909px);
}
}