.contact-us { display: flex; width: 100%; border-radius: 2.5rem; overflow: hidden; .content_left { flex: 1; padding: 4.0625rem 3.5rem; display: flex; flex-direction: column; background-color: var(--color-white); .info-item { padding-top: 1.625rem; padding-bottom: 1.625rem; border-bottom: 1px solid rgba(220, 219, 219, 1); } label { display: flex; align-items: center; gap: .75rem; margin-bottom: .9375rem; .case-icon { width: 1.3125rem; height: 1.3125rem; &.email { width: 1.4375rem; height: 1.0625rem; } } span { color: rgba(149, 149, 149, 1); font-family: "OPPO Sans 4.0"; font-style: Medium; font-size: var(--font-18); font-weight: 500; line-height: var(--font-21); letter-spacing: 0px; text-align: center; } } .info-detail { display: flex; align-items: center; gap: 1.25rem; span { font-family: "OPPO Sans 4.0"; font-style: Medium; font-size: var(--font-24); font-weight: 500; line-height: var(--font-28); letter-spacing: 0px; text-align: left; } small { font-size: var(--font-16); font-weight: normal; } } .qr-group { display: flex; padding: 1.625rem 0; gap: 1.25rem; border-bottom: 1px solid rgba(220, 219, 219, 1); .qr-item { display: flex; align-items: center; gap: 1.25rem; img { width: 6.4375rem; height: 6.4375rem; border-radius: .375rem; object-fit: contain; } span { color: rgba(128, 127, 127, 1); font-family: "OPPO Sans 4.0"; font-style: Medium; font-size: var(--font-18); font-weight: 500; line-height: var(--font-26); letter-spacing: 0px; text-align: left; } } } .office-group { padding-top: 1.625rem; } .office-list { display: flex; flex-wrap: wrap; gap: 10px; .office-item { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-items: center; img { width: 3.5625rem; height: 4.25rem; margin-bottom: 1.0625rem; } span { color: rgba(0, 0, 0, 1); font-family: "OPPO Sans 4.0"; font-style: Regular; font-size: var(--font-18); font-weight: 400; line-height: var(--font-21); letter-spacing: -1px; text-align: left; } } } } .content_right { flex: 1; padding: 4.0625rem 3.3125rem; background-image: url('../../assets/images/case-page/section-2-bg.png'); background-position: center; background-size: cover; background-repeat: no-repeat; .form-title { color: rgba(255, 255, 255, 1); font-family: "OPPO Sans 4.0"; font-style: Medium; font-size: var(--font-30); font-weight: 500; line-height: var(--font-35); letter-spacing: 0px; text-align: left; } .booking-form { padding-top: 6.25rem; } .input-group { border-bottom: 1px solid rgba(135, 135, 135, 1); input, textarea { width: 100%; background: transparent; border: none; padding: 1.625rem 0; color: #fff; outline: none; &::placeholder { color: rgba(135, 135, 135, 1); font-family: "OPPO Sans 4.0"; font-style: Regular; font-size: var(--font-18); font-weight: 400; line-height: var(--font-21); letter-spacing: 0px; text-align: left; } } textarea { resize: none; } } .submit-btn { margin-top: 6.25rem; width: 100%; } } } @media (width <=992px) { .contact-us { flex-direction: column; .content_left, .content_right { padding: 20px !important; } } }