.page-banner-contact {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
min-height: 620px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.banner-content-contact {
text-align: center;
}
.text-title-banner-contact {
color: #ffffff;
font-size: 80px;
font-weight: bold;
margin-top: 20px;
line-height: 110px;
}
.contact-address-section {
min-height: 960px;
}
.contact-item-link {
text-decoration: none;
color: #000;
}
.text-contact h2 {
font-size: var(--font-size-40en-50th);
font-weight: bold;
color: #f15a22;
}
.contact-item h3 {
font-size: var(--font-size-20);
line-height: 28px;
font-weight: bold;
color: #2b3c8e;
margin-bottom: 2px;
}
.bus-item {
border-bottom: 1px solid #f15a22;
}
.bus-item:last-child {
border-bottom: none;
}
.bus-item p {
font-size: 16px;
line-height: 24px;
margin-bottom: 4px;
}
.map-contact iframe {
width: 100% !important;
max-width: 100% !important;
}
.gform_wrapper .gfield_label {
font-size: 18px !important;
line-height: 26px;
}
.gform_wrapper .gform_fields .gfield {
display: flex;
flex-direction: row;
}
.gform_wrapper .gfield_label {
flex-basis: 150px;
flex-shrink: 0;
text-align: right;
padding-right: 0;
width: auto;
}
.gform_wrapper .ginput_container {
flex-grow: 1;
}
.gform_wrapper .gform_footer {
display: flex;
justify-content: flex-end;
margin-left: 150px;
}
.gform_wrapper .gform_footer input[type="submit"] {
width: 100%;
box-sizing: border-box;
}
.gform_wrapper .gfield_required {
display: none;
}
.gform_wrapper .gfield_required::after {
content: "*";
font-size: 18px;
line-height: 26px;
color: #000;
}
.gform_wrapper .gfield input,
.gform_wrapper .gfield textarea,
.gform_wrapper .gfield select {
border-color: #f15a22 !important;
color: #333 !important;
}
.gform_wrapper .gfield input:focus,
.gform_wrapper .gfield textarea:focus,
.gform_wrapper .gfield select:focus {
border-color: #f15a22 !important;
}
.gform_wrapper .gform_footer .gform_button {
background-color: #f15a22 !important;
border-radius: 0 !important;
color: #ffffff !important;
border: none !important;
margin-top: 18px !important;
padding: 20px !important;
}
.gform_wrapper .gform_fields .gfield {
margin-bottom: -25px !important;
}
.gform_wrapper .ginput_container_textarea textarea {
height: 10px !important;
resize: none !important;
}
.gform_wrapper .gfield_validation_message {
position: absolute;
padding-top: 15px;
}
.img-contact {
display: flex;
align-items: flex-end;
height: 100%;
}
.img-contact img {
object-fit: cover;
object-position: bottom;
}
.contact-content p {
font-size: var(--font-size-16);
line-height: 24px;
letter-spacing: 0;
}
.social-item span {
font-size: var(--font-size-16);
line-height: 24px;
} .page-banner-career {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
min-height: 620px;
width: 100%;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.banner-content-career {
text-align: center;
}
.text-title-banner-career {
color: #ffffff;
font-size: 80px;
font-weight: bold;
margin-top: 20px;
line-height: 100px;
}
.career-content-1>h1 {
font-size: var(--font-size-20);
line-height: 28px;
font-weight: bold;
color: #2b3c8e !important;
margin-bottom: 20px;
}
.career-content-1>p {
font-size: var(--font-size-16);
line-height: 24px;
font-weight: 500;
max-width: 1600px;
letter-spacing: 0;
}
.career-content-2>h1 {
font-size: var(--font-size-20);
line-height: 28px;
font-weight: bold;
color: #f15a22;
margin-bottom: 20px;
}
.career-content-2>p {
font-size: 16px;
line-height: 24px;
font-weight: 500;
max-width: 1200px;
letter-spacing: 0;
}
.career-content-2 ol {
text-align: left;
padding-left: 20px;
margin-left: 0;
max-width: 1200px;
list-style-position: outside;
}
.career-content-2 ol li {
font-size: var(--font-size-16);
line-height: 24px;
font-weight: 500;
text-align: left;
}
.career-content-3>h4 {
font-size: var(--font-size-20);
line-height: 28px;
font-weight: bold;
color: #2b3c8e;
margin-bottom: 20px;
}
.career-content-3>p {
font-size: 16px;
line-height: 24px;
font-weight: 500;
max-width: 1200px;
letter-spacing: 0;
}
.career-content-3 ol {
text-align: left;
padding-left: 20px;
margin-left: 0;
max-width: 1200px;
list-style-position: outside;
}
.career-content-3 ol li {
font-size: 16px;
line-height: 24px;
font-weight: 500;
text-align: left;
}
.career-content-3 ul {
text-align: left;
padding-left: 20px;
margin-left: 0;
max-width: 1200px;
list-style-position: outside;
}
.career-content-3 ul li {
font-size: var(--font-size-16);
line-height: 24px;
font-weight: 500;
text-align: left;
}
.career-content-4>h1 {
font-size: var(--font-size-40en-50th);
line-height: 54px;
font-weight: bold;
color: #f15a22;
margin-bottom: 20px;
}
.career-content-4>h4 {
font-size: var(--font-size-20);
line-height: 28px;
font-weight: bold;
color: #f15a22;
}
.career-content-4>p {
font-size: var(--font-size-16);
line-height: 24px;
font-weight: 500;
max-width: 1200px;
letter-spacing: 0;
}
.download-item {
border-bottom: 1px solid #e0e0e0;
}
.download-item:last-child {
border-bottom: none;
}
.download-content {
display: flex;
align-items: center;
gap: 20px;
flex-wrap: wrap;
}
.download-text {
font-size: var(--font-size-16);
line-height: 24px;
font-weight: 500;
color: #333;
margin: 0;
letter-spacing: 0;
}
.download-button {
display: flex;
box-sizing: border-box;
flex-direction: row;
align-items: center;
padding: 20px 24px;
gap: 8px;
width: auto;
min-width: 250px;
height: 35px;
border: 1.25px solid #f15a22;
border-radius: 8px;
background-color: transparent; font-style: normal;
font-weight: 600;
font-size: var(--font-size-12en-16th);
line-height: 16px;
text-transform: uppercase;
color: #f15a22;
text-decoration: none;
transition: all 0.3s ease;
}
.download-button:visited {
font-size: var(--font-size-16);
line-height: 24px;
color: #f15a22;
border-color: #f15a22;
}
.download-button:hover {
background-color: #f15a22;
color: #ffffff;
text-decoration: none;
}
.career-content-5>h4 {
font-size: var(--font-size-20);
line-height: 28px;
font-weight: bold;
color: #f15a22;
}
.career-content-5>p {
font-size: var(--font-size-16);
line-height: 24px;
font-weight: 500;
max-width: 1200px;
letter-spacing: 0;
}
.career-title-text {
font-size: var(--font-size-40en-50th);
line-height: 54px;
font-weight: bold;
color: #f15a22;
max-width: 1200px;
margin-bottom: 30px;
}
.jobs-table-section {
margin-top: 30px;
}
.jobs-table {
width: 100%;
border-collapse: collapse;
border: none;
}
.jobs-table th,
.jobs-table td {
padding: 15px 0px;
text-align: left;
border: none;
border-bottom: 1px solid #f15a22;
justify-content: space-evenly;
}
.jobs-table th:last-child,
.jobs-table td:last-child {
text-align: end;
width: 200px;
}
.jobs-table th:nth-child(1),
.jobs-table td:nth-child(1) {
width: 35%;
min-width: 220px;
}
.table-header th {
font-size: var(--font-size-20);
line-height: 28px;
font-weight: bold;
color: #2b3c8e;
background-color: transparent;
border-bottom: none;
}
.table-row td {
font-size: var(--font-size-16);
font-weight: 500;
color: #333;
line-height: 24px;
letter-spacing: 0;
}
.apply-button {
background-color: #f15a22;
color: #ffffff;
border: none;
padding: 8px 16px;
font-size: var(--font-size-14en-18th);
line-height: 20px;
font-weight: 600;
text-transform: uppercase;
cursor: pointer;
transition: all 0.3s ease;
width: 183px;
text-align: center;
text-decoration: none;
display: inline-block;
}
.apply-button:visited {
color: #ffffff;
background-color: #f15a22;
}
.apply-button:hover {
background-color: #d14a1d;
transform: translateY(-1px);
}
.text-center {
text-align: center !important;
}
.position-info {
display: none;
}
.sub-career-mobile {
display: none;
} .banner-title-submenu {
font-size: 80px;
line-height: 120px;
color: #fff;
text-align: center;
max-width: 820px;
margin: 0 auto;
}
.text-content-quality {
font-size: var(--font-size-20); color: #333;
margin: 0 auto;
max-width: 850px;
}
.submenu-dynamic-page {
min-height: 900px;
}
.product-item {
text-align: center;
overflow: hidden;
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
}
.product-item a {
text-decoration: none;
color: inherit;
display: flex;
flex-direction: column;
flex-grow: 1;
}
.product-image-container {
position: relative;
height: 300px;
}
.product-image-container img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: contain;
transition: opacity 0.3s ease-in-out;
}
.product-image-container.has-hover-image .hover-image {
object-fit: cover;
}
.product-details-wrap {
padding: 12px 12px;
display: flex;
flex-direction: column;
text-align: center;
}
.text-top-product {
font-size: var(--font-size-18en-22th);
line-height: 26px;
color: #000;
margin: 0px 0 5px 0;
text-transform: uppercase;
}
.product-item h3 {
font-size: var(--font-size-22en-28th);
line-height: 28px;
font-weight: bold;
margin: 0;
text-transform: uppercase;
}
.page-banner-submenu,
.page-banner-about,
.page-banner-sus,
.page-banner-promotion,
.page-banner-packing,
.page-banner-contact,
.page-banner-career,
.page-banner-real,
.page-banner,
.future-banner-image,
.future-banner-container {
position: relative;
}
.page-banner-submenu {
background-size: cover;
background-position: center;
min-height: 560px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.page-banner-submenu::after,
.page-banner-about::after,
.page-banner-sus::after,
.page-banner-promotion::after,
.page-banner-packing::after,
.page-banner-contact::after,
.page-banner-career::after,
.page-banner-real::after,
.page-banner::after,
.future-banner-image::after,
.future-banner-container::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.25);
z-index: 1;
pointer-events: none; } .future-banner-container:has(.future-banner-image)::after {
display: none;
}
.page-banner-submenu>*,
.page-banner-about>*,
.page-banner-sus>*,
.page-banner-promotion>*,
.page-banner-packing>*,
.page-banner-contact>*,
.page-banner-career>*,
.page-banner-real>*,
.page-banner>*,
.future-banner-image>*,
.future-banner-container>* {
position: relative;
z-index: 2;
}
.product-tabs {
margin: 30px 0;
}
.product-tabs .row {
display: flex;
flex-wrap: wrap;
gap: 0;
}
.product-tabs .col {
font-size: var(--font-size-20en-28th);
line-height: 28px;
padding: 10px;
cursor: pointer;
border-radius: 30px;
min-width: 143px;
text-align: center;
background: none;
color: #333;
}
.product-tabs .col.active {
background-color: #f15a22;
color: white;
height: fit-content;
}
.acf-notice {
text-align: center;
padding: 40px;
background: #f9f9f9;
border: 1px dashed #ccc;
margin: 20px 0;
}
.product-image-container .hover-image {
opacity: 0;
}
.product-item:hover .product-image-container.has-hover-image .main-image {
opacity: 0;
}
.product-item:hover .product-image-container.has-hover-image .hover-image {
opacity: 1;
}
.mobile-filter-dropdown {
display: none;
}
.quality-gallery-img {
width: 100%;
max-width: 100px;
height: 97px;
object-fit: cover;
margin-right: 10px;
}
.form-select {
width: 100%;
padding: 12px 40px 12px 20px;
font-size: 1rem;
color: #fff;
background-color: #f15a22;
border-radius: 30px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: right 1.2rem center;
background-size: 16px 12px;
}
.form-select:focus {
outline: none;
box-shadow: none;
}
#mobile-filter-select option {
background: #ffffff;
color: #333333;
}
#mobile-filter-select option:checked {
background: #ffffff;
color: white;
}
.product-filter-section {
display: flex;
} .pagination .page-numbers {
padding: 8px 15px;
margin: 0 5px;
border: 1px solid #ddd;
color: #333;
text-decoration: none;
border-radius: 5px;
}
#product-container {
transition: opacity 0.4s ease-in-out;
}
#product-container.loading {
height: 900px !important;
}
.submenu-additional-info {
font-size: var(--font-size-40en-50th);
line-height: 54px;
font-weight: bold;
color: #f15a22;
}
.submenu-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.submenu-item {
display: flex;
align-items: center;
}
.submenu-item-image img {
width: 25px;
height: 25px;
object-fit: cover;
display: block;
}
.submenu-item-text a {
font-size: 20px;
line-height: 28px;
text-decoration: none;
color: #333;
font-weight: 500;
}
.submenu-item-text {
font-size: var(--font-size-20);
line-height: 28px;
color: #333;
font-weight: 500;
}    .page-banner-real {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
min-height: 900px;
width: 100%;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.banner-content-real {
text-align: center;
}
.text-title-banner-real {
color: #ffffff;
font-size: 80px;
font-weight: bold;
line-height: 110px;
}
.text-content-banner-real {
color: #ffffff;
font-weight: bold;
font-size: var(--font-size-24);
margin-top: 20px;
line-height: 34px;
}
.custom-button {
box-sizing: border-box;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 16px 70px;
gap: 10px;
width: 285px;
height: 64px;
border: 2px solid #ffffff;
border-radius: 8px;
background: transparent;
font-family: "Nunito";
font-weight: bold;
font-size: 24px;
line-height: 34px;
text-align: center;
color: #ffffff;
cursor: pointer;
flex: none;
order: 0;
flex-grow: 0;
}
.custom-button:hover {
background: #2b3c8e;
border: 2px solid #2b3c8e;
}
.text-content-real-1 {
max-width: 1000px;
margin: 0 auto;
font-size: var(--font-size-20);
line-height: 28px;
color: #333;
text-align: center;
}
.img-real {
width: 1200px;
height: 460px;
border-radius: 24px;
left: 0px;
top: 0px;
transition: background-color 0.5s ease, opacity 0.5s ease;
}
.vanit-us>h1 {
margin-top: 100px;
color: #2b3c8e;
font-size: var(--font-size-40en-50th);
line-height: 54px;
font-weight: bold;
margin-bottom: 16px;
}
.vanit-us>h4 {
margin-top: 40px;
font-weight: bold;
color: #f15a22;
font-size: var(--font-size-20);
line-height: 28px;
}
.vanit-us>p {
font-size: var(--font-size-20);
margin-bottom: 0;
line-height: 28px;
}
.vanit-us>h5 {
color: #333;
font-size: var(--font-size-20);
line-height: 28px;
}
.vanit-us>a {
margin-top: 30px;
font-size: var(--font-size-16);
line-height: 24px;
color: #333;
text-decoration: none;
}
.vanit-img {
width: 680px;
height: 640px;
border-radius: 24px;
}
.vanit,
.section-1,
.footer-real-section {
padding: 100px 0;
}
.footer-real-social-container {
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
flex-wrap: wrap;
}
.footer-real-social-item a {
font-size: var(--font-size-16);
line-height: 24px;
display: inline-block;
text-decoration: none;
color: #000;
vertical-align: bottom;
}
.footer-real-social-item {
font-size: 16px;
line-height: 24px;
}
.footer-real-social-item img {
width: 25px;
height: 25px;
transition: transform 0.2s;
}
.footer-real-info-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.footer-real-info-row {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 5px;
text-align: center;
}
.footer-real-info-image img {
width: 100%;
max-width: 25px;
margin-right: 15px;
}
.footer-real-title {
font-size: var(--font-size-40en-50th);
line-height: 54px;
font-weight: bold;
color: #f15a22;
}
.footer-real-info-text {
font-size: var(--font-size-16);
line-height: 24px;
text-decoration: none !important;
}
.gallery-item.no-hover:hover img {
opacity: 1 !important;
transform: none !important;
cursor: default !important;
} @media (max-width: 991px) {
.gform_wrapper .gfield_validation_message {
position: relative;
padding-top: 0;
}
.gform_wrapper .gfield_label {
font-size: 14px !important;
line-height: 20px;
font-weight: 600 !important;
font-family: "Nunito-SemiBold" !important;
}
.gform_wrapper .gform_fields .gfield {
flex-direction: column !important;
}
.gform_wrapper .gfield_label {
flex-basis: auto !important;
text-align: left !important;
margin-bottom: 5px !important;
}
.gform_wrapper .gform_footer {
margin-left: 0 !important;
}
.vanit,
.section-1,
.footer-real-section {
padding: 60px auto;
}
}
@media (max-width: 991px) {
.text-title-banner-contact {
font-size: 32px !important;
line-height: 44px !important;
}
.map-contact iframe {
height: 340px !important;
}
.page-banner-contact {
background-size: auto !important;
}
.bus-item .row {
flex-direction: column !important;
}
.bus-item .col-20,
.bus-item .col-40 {
width: 100% !important;
flex: none !important;
}
.bus-item p {
font-size: 14px !important;
line-height: 20px !important;
}
.contact-item h3 {
font-size: 14px !important;
line-height: 20px !important;
}
.text-contact h2 {
font-size: 24px !important;
line-height: 34px !important;
}
.text-contact h2 br {
display: none !important;
}
.contact-content p {
font-size: 14px;
line-height: 20px !important;
letter-spacing: 0;
}
} @media screen and (max-width: 1500px) {
.career-content-1>p {
line-height: 160%;
font-weight: 500;
max-width: 1200px;
letter-spacing: 0;
}
}
@media screen and (max-width: 768px) {
.page-banner-career {
min-height: 560px;
background-position: 25% center;
}
.text-title-banner-career {
font-size: 32px !important;
line-height: 44px !important;
}
.career-content-1>h1,
.career-content-2>h1,
.career-content-4>h1,
.career-title-text {
font-size: 20px !important;
line-height: 28px !important;
margin-bottom: 20px;
}
.career-content-3>h4,
.career-content-4>h4,
.career-content-5>h4 {
font-size: 16px !important;
line-height: 24px !important;
}
.career-content-2>h1 br {
display: none;
}
.sub-career-mobile {
display: block;
}
.jobs-table-section {
margin-top: 10px;
}
.jobs-table thead {
display: none;
}
.jobs-table,
.jobs-table tbody,
.jobs-table tr,
.jobs-table td {
display: block;
width: 100% !important;
}
.jobs-table tr.table-row {
padding: 10px 0;
border-bottom: 1px solid #f15a22;
margin-bottom: 10px;
}
.jobs-table tr.table-row:last-child {
border-bottom: 1px solid #f15a22;
margin-bottom: 0;
}
.jobs-table td {
padding: 8px 0;
border: none;
text-align: left !important;
}
.jobs-table td[data-label]::before {
content: attr(data-label) ": ";
display: inline;
font-size: 16px;
line-height: 24px !important;
color: #000000;
margin-right: 8px;
}
.jobs-table td:nth-of-type(3) {
display: none;
}
.jobs-table td:last-child {
padding-top: 10px;
display: flex;
justify-content: space-between;
align-items: center; }
.jobs-table td:last-child::before {
display: none;
}
.apply-button {
width: auto;
min-width: 120px;
flex-shrink: 0;
}
.position-info {
font-size: 14px;
line-height: 20px;
color: #333;
font-weight: 500;
display: block;
}
.download-content {
gap: 5px;
}
} @media (max-width: 1023px) {
.product-filter-section {
display: block;
}
.product-tabs {
display: none;
}
.mobile-filter-dropdown {
display: block;
padding: 0 15px;
}
}
@media (max-width: 1023px) {
.submenu-container {
flex-direction: column;
}
}
@media (max-width: 768px) {
.text-content-quality {
font-size: 14px;
line-height: 20px;
}
.submenu-item-text {
font-size: 14px;
line-height: 20px;
}
.submenu-additional-info {
font-size: 20px;
line-height: 28px;
}
.product-item h3 {
font-size: 14px;
line-height: 20px;
}
.text-top-product {
font-size: 12px;
line-height: 16px;
}
.banner-title-submenu {
font-size: 32px;
line-height: 44px;
}
.quality-gallery-img {
width: 100%;
max-width: 75px;
height: 75px;
object-fit: cover;
}
.product-image-container {
height: 260px;
max-width: 280px;
margin: 0 auto;
}
}
@media (max-width: 568px) {
.product-image-container {
height: 200px;
}
} @media (max-width: 1440px) {
.vanit-img {
width: 590px;
height: 590px;
border-radius: 24px;
}
}
@media (max-width: 1023px) {
.vanit-img {
width: 100%;
height: auto;
border-radius: 24px;
}
.vanit-us>h1 {
margin-top: 0;
color: #2b3c8e;
font-size: 40px;
line-height: 54px;
font-weight: bold;
margin-bottom: 16px;
}
.img-real {
width: 1200px;
height: 360px;
}
}
@media (max-width: 767.98px) {
.text-content-real-1 {
font-size: 14px;
line-height: 20px;
}
.page-banner-real {
min-height: 680px;
width: 100%;
background-position: 70% center;
}
.custom-button {
font-family: "Nunito-SemiBold";
max-width: 232px;
max-height: 50px;
font-size: 16px;
line-height: 20px;
font-weight: 500;
}
.text-title-banner-real {
color: #ffffff;
font-size: 32px;
font-weight: bold;
line-height: 44px;
}
.text-content-banner-real {
color: #ffffff;
font-weight: 500;
font-size: 14px;
line-height: 20px;
}
.img-real {
width: 1200px;
height: 200px;
}
.vanit-us>h1 {
color: #2b3c8e;
font-size: 24px;
line-height: 34px;
}
.vanit-us>h4 {
font-size: 14px;
line-height: 20px;
}
.vanit-us>p {
font-size: 14px;
line-height: 20px;
}
.vanit-us>h5 {
font-size: 14px;
line-height: 20px;
}
.vanit-us>a {
font-size: 12px;
line-height: 16px;
}
.vanit-img {
width: 100%;
height: 330px;
border-radius: 24px;
}
}
@media (max-width: 568px) {
.footer-real-title {
font-size: 20px;
line-height: 28px;
}
.footer-real-info-text {
font-size: 14px;
line-height: 20px;
}
.footer-real-info-image img {
margin-right: 10px;
}
.footer-real-social-item {
font-size: 14px;
line-height: 20px;
}
}
@media (max-width: 376px) {
.footer-real-info-text {
font-size: 12px;
line-height: 16px;
}
.footer-real-info-image img {
margin-right: 5px;
}
}