.map-section {
background: #ffffff;
padding: 80px 0;
width: 100%;
overflow: hidden;
font-family: Montserrat, sans-serif;
}
.map-section__container {
display: flex;
flex-direction: column;
align-items: flex-start;
} .map-section__header {
margin-bottom: 32px;
}
.map-section__title {
line-height: 1.2;
letter-spacing: 0;
color: #113555;
font-size: 34px;
font-weight: 700;
margin: 0;
}
.map-section__subtitle {
margin: 24px 0 0;
line-height: 25px;
letter-spacing: 0;
color: #2f2f2f;
font-size: 18px;
font-weight: 500;
} .map-section__content {
width: 100%;
}
.map-section__map-wrapper {
position: relative;
border: 1px solid #edeef0;
border-radius: 7px;
background: #f6f7f9;
width: 100%;
height: 450px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.map-section__map {
width: 100%;
height: 100%;
} .map-section__cta {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 32px;
width: 100%;
position: relative;
}
.map-section__cta-text {
display: flex;
flex-direction: column;
max-width: 590px;
}
.map-section__cta-title {
line-height: 31px;
color: #113555;
font-size: 24px;
font-weight: 600;
}
.map-section__cta-desc {
line-height: 31px;
color: #113555;
font-size: 24px;
font-weight: 500;
}
.map-section__arrow {
display: none; }
.map-section__arrow--pc {
display: block;
width: 294px;
height: auto;
}
.map-section__button-wrapper {
display: flex;
align-items: center;
}
.map-section__button {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 4px;
background: #ffbd45; background: var(--main_yellow, #ffbd45);
width: 183px;
height: 50px;
text-decoration: none;
color: #113555;
font-family: "Exo 2", sans-serif;
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
transition: opacity 0.3s;
cursor: pointer;
}
.map-section__button:hover {
opacity: 0.9;
}
.map-section__arrow--mobile-left,
.map-section__arrow--mobile-right {
display: none;
} @media (max-width: 1024px) {
.map-section {
padding: 50px 0;
}
.map-section__header {
align-items: center;
text-align: center;
display: flex;
flex-direction: column;
margin-bottom: 24px;
}
.map-section__title {
font-size: 26px;
}
.map-section__subtitle {
font-size: 15px;
line-height: 21px;
max-width: 100%;
margin-top: 12px;
}
.map-section__title br,
.map-section__subtitle br {
display: none;
}
.map-section__cta {
flex-direction: column;
align-items: center;
text-align: center;
margin-top: 24px;
}
.map-section__cta-text {
align-items: center;
}
.map-section__cta-title,
.map-section__cta-desc {
font-size: 20px;
line-height: 26px;
}
.map-section__arrow--pc {
display: none;
}
.map-section__button-wrapper {
width: 100%;
justify-content: space-between;
margin-top: 16px;
}
.map-section__button {
margin-top: 0;
z-index: 1;
}
.map-section__arrow--mobile-left {
display: block;
width: 25%; max-width: 100px;
}
.map-section__arrow--mobile-right {
display: block;
width: 25%;
max-width: 100px;
transform: rotate(0deg); }
}