* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
html {
font-family: sans-serif;
font-size: 10px;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
margin: 0;
padding: 0;
font-family: "minerva-modern", "Anuphan", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 18px;
line-height: 1.3;
color: #000;
background-color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* filter: saturate(0.8) contrast(0.975); */
}
article,
aside,
footer,
header,
main,
menu,
nav,
section,
summary {
display: block;
}
button,
input,
select,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-transition: border-color ease-in-out 0.2s;
-o-transition: border-color ease-in-out 0.2s;
transition: border-color ease-in-out 0.2s;
}
textarea {
resize: vertical;
}
button:focus,
textarea,
button {
outline: 0;
}
button:focus {
outline: 0;
}
input:focus {
outline: 0;
}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
background-color: transparent;
}
fieldset {
margin: 0;
padding: 0;
border: 0;
outline: none;
}
img {
border: 0;
max-width: 100%;
vertical-align: middle;
}
a {
cursor: pointer;
color: inherit;
text-decoration: none;
-webkit-transition: color ease-in-out 0.2s;
-o-transition: color ease-in-out 0.2s;
transition: color ease-in-out 0.2s;
}
a:hover,
a:focus {
color: inherit;
text-decoration: none;
}
a:focus {
outline: 0;
outline-offset: 0;
}
p {
margin: 0;
padding: 0;
line-height: 1.4;
}
a[href^="tel"] {
cursor: none;
outline: none;
text-decoration: none;
color: inherit;
white-space: nowrap;
}
.ic {
display: inline-block;
vertical-align: middle;
}
ul,
ol,
li {
list-style: none;
margin: 0;
padding: 0;
}
h1,
h2,
h3,
h4 {
padding: 0;
margin: 0;
font-weight: normal;
}
.a-center {
text-align: center;
}
.a-right {
text-align: right;
}
.c-blue {
color: #48597b !important;
}
.c-blue-dark {
color: #0f1537 !important;
}
.c-white {
color: #fff !important;
}
.c-gray {
color: #8d8d8d;
}
.font-body {
font-family: "minerva-modern", sans-serif !important;
}
.bg-c-gray {
background: #f5f5f5;
}
.bg-c-blue {
background: #0f1537;
}
.btn-action {
margin-top: 35px;
}
.text-sm {
font-size: 15px;
}
.container {
width: 100%;
padding-right: 20px;
padding-left: 20px;
margin-right: auto;
margin-left: auto;
}
.container-fluid {
width: 100%;
max-width: 100%;
padding-right: 20px;
padding-left: 20px;
margin-right: auto;
margin-left: auto;
}
.heading {
position: relative;
z-index: 500;
margin-bottom: 35px;
}
.heading-group h2 {
margin-top: 0;
}
.heading-group h3 {
margin-top: 15px;
}
.heading .entry-desc {
margin-top: 15px;
}
.text-uppercase {
text-transform: uppercase;
}
.heading .btn-action {
margin-top: 30px;
}
h1,
h2 {
line-height: 1;
}
h1,
.heading-h1 {
font-size: 60px;
line-height: 0.9;
color: #000;
}
h2,
.heading-h2 {
font-size: 50px;
color: #000;
line-height: 0.9;
}
h3,
.heading-h3 {
font-size: 24px;
line-height: 1.2;
}
.heading-h1 {
font-family: "Saol Display Light";
}
.heading-h4 {
font-size: 18px;
}
.subtitle {
margin-bottom: 10px;
font-family: "_pristine_scriptregular";
font-size: 35px;
line-height: 1;
}
.subtitle.xs {
margin-bottom: 5px;
}
.section {
padding-top: 100px;
padding-bottom: 100px;
}
.section-md {
padding-top: 50px;
padding-bottom: 50px;
}
.section.nopaddingtop {
padding-top: 0;
}
.nopaddingbottom {
padding-bottom: 0 !important;
}
.nomarginbottom {
margin-bottom: 0 !important;
}
.grid-column {
display: grid;
}
.grid-column {
grid-template-columns: 1fr;
}
.section-navbar-menu {
position: static;
width: 100%;
z-index: 1000;
}
.navbar-menu {
display: block;
text-align: center;
}
.navbar-menu ul li {
display: inline-block;
margin: 0 1.5%;
}
.navbar-menu ul li a {
font-size: 14px;
color: #48597b;
text-transform: uppercase;
transition: 0.3s all ease;
}
.navbar-menu ul li a.active,
.navbar-menu ul li a:hover {
font-weight: 700;
transition: 0.3s all ease;
}
.navbar-menu ul li a.current {
font-weight: 700;
}
.textlink {
position: relative;
font-family: "_pristine_scriptregular";
font-size: 35px;
margin-bottom: 5px;
line-height: 1;
}
.textlink:after {
content: "";
display: block;
width: 100%;
height: 2px;
position: absolute;
bottom: 4px;
left: 0;
z-index: 1000;
background: #000;
}
.btn,
a.btn {
min-width: 200px;
position: relative;
height: 50px;
font-family: "minerva-modern", sans-serif;
line-height: 50px;
font-size: 15px;
color: #000;
z-index: 1;
padding: 0 50px;
margin: 0 auto;
cursor: pointer;
text-align: center;
display: inline-block;
border-radius: 30px;
outline: none;
border: 1px solid #ededed;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
background-color: #fff;
}
.btn:hover,
a.btn:hover {
color: #000;
background-color: #ededed;
}
.btn.outline:hover {
color: #000;
background-color: #ededed;
}
.btn.outline {
border: 1px solid #e1e1e1;
background-color: #fff;
}
.btn.nooutline {
border: 1px solid transparent;
background-color: transparent;
}
.btn.nooutline:hover {
border-color: #ededed;
background-color: #fff;
}
.btn:hover {
color: #000;
}
.btn.c-white {
color: #fff;
}
.btn.c-white:hover {
color: #000;
}
.btn-circle .ic {
display: none;
font-size: 24px;
}
.btn.btn-black {
color: #fff;
border: 0;
background-color: #000;
}
/* swiper */
.swiper-notification {
display: none;
}
/* swiper multiple item */
.swiper-multiple-item {
position: relative;
}
.swiper-multiple-item .swiper-pagination {
text-align: left;
display: none;
}
.swiper-pagination-bullet {
width: 20px;
height: 3px;
padding: 0 5px;
display: table-cell;
border-radius: 0;
opacity: 1;
background-color: transparent;
text-indent: -9999px;
z-index: 900 !important;
}
.swiper-pagination-bullet:focus {
outline: 0;
border: 0;
}
.swiper-pagination-bullet:after {
content: "";
display: block;
width: 100%;
height: 3px;
padding: 0;
background-color: #e5e5e5;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active:after {
background-color: #000;
}
.swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
left: inherit;
bottom: -40px;
}
/* article */
.section-article {
padding-top: 50px;
padding-bottom: 50px;
}
.article-body {
position: relative;
z-index: 100;
}
.article-content {
font-size: 18px;
}
.article-content h2,
.article-content h3 {
margin-bottom: 20px;
font-weight: 400;
line-height: 1.2;
color: #48597b;
}
.article-content h2 {
font-size: 50px;
}
.article-content h3 {
font-size: 25px;
}
.article-content p {
line-height: 1.4;
margin-bottom: 20px;
}
.sidebar h3 {
display: none;
}
.nav-sidebar {
position: relative;
}
.nav-sidebar li {
padding: 14px 30px;
transition: 0.3s all ease;
}
.nav-sidebar li a {
display: block;
font-size: 16px;
color: #000;
text-transform: uppercase;
}
.nav-sidebar li.current,
.nav-sidebar li:hover {
background: #f2f2f2;
}
.nav-sidebar li a:hover {
color: #000;
}
/* form */
.form-styles {
position: relative;
}
.form-styles fieldset {
padding: 0;
margin: 30px 0 0 0;
}
.form-styles.xs {
width: 300px;
margin: 0 auto;
}
.form-styles .label-form {
font-family: "minerva-modern", sans-serif;
font-size: 15px;
text-align: center;
margin: 0 auto;
display: block;
}
.form-styles .textinput {
width: 100%;
height: 40px;
display: block;
font-family: "minerva-modern", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 15px;
line-height: 1.3;
color: #000;
text-align: center;
padding: 10px 20px;
border-radius: 0;
border: 0;
border-bottom: 1px solid #e1e1e1;
background-color: transparent;
}
.form-register .textinput {
border-color: #959595;
}
.form-register .label-form {
font-size: 16px;
}
.form-styles textarea.textinput {
height: 70px;
}
.form-styles .label-subscribe {
position: absolute;
width: 100%;
text-align: center;
font-family: "_pristine_scriptregular";
font-size: 50px;
z-index: 100;
top: -5px;
pointer-events: none;
transition: opacity 0.2s ease-in-out 0.15s;
}
.form-styles .label-subscribe:after {
content: "";
display: block;
width: 100%;
height: 1px;
position: absolute;
z-index: -1;
top: 30px;
background: #959595;
}
.form-styles .label-subscribe.active {
display: none;
}
.input-subscribe {
height: 50px !important;
padding: 0 15px !important;
line-height: 50px !important;
font-family: "_pristine_scriptregular" !important;
font-size: 50px !important;
text-align: center;
border: 0 !important;
}
.form-styles input::-webkit-input-placeholder {
font-family: "noto_sans_krlight", sans-serif;
font-style: italic;
font-size: 12px;
color: #999;
}
.form-styles input:-ms-input-placeholder {
font-family: "noto_sans_krlight", sans-serif;
font-style: italic;
font-size: 12px;
color: #999;
}
.form-styles input::placeholder {
font-family: "noto_sans_krlight", sans-serif;
font-style: italic;
font-size: 12px;
color: #999;
}
.form-styles textarea::placeholder {
font-family: "noto_sans_krlight", sans-serif;
font-style: italic;
font-size: 12px;
color: #999;
}
.form-styles input:focus,
.form-styles textarea:focus {
border-color: #000;
}
.form-styles textarea {
height: 150px;
}
.form-group {
position: relative;
margin-bottom: 10px;
}
.form-group .txt-alt {
font-size: 14px;
margin-top: 10px;
}
.form-btn {
margin-top: 20px;
}
.form-styles .grid-column {
grid-column-gap: 15px;
}
.form-subscribe .entry-desc {
margin: 10px 0 30px;
}
.block-content p {
margin-bottom: 20px;
}
.block-content p:last-of-type {
margin-bottom: 0;
}
.area-content.sm {
max-width: 370px;
}
.area-content.md {
max-width: 750px;
margin: 0 auto;
}
.area-content.md-plus {
max-width: 850px;
margin: 0 auto;
}
.area-content h3 {
margin-bottom: 30px;
}
.area-content p {
margin-bottom: 20px;
}
.area-content p:last-of-type {
margin-bottom: 0;
}
.section-content-view {
min-height: 500px;
align-items: center;
display: grid;
}
.coverimg {
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.coverimg.position-bottom {
background-position: center bottom;
}
.covervideo {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 300;
}
.covervideo video {
object-fit: cover;
width: 100vw;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.section-bg-color {
height: calc(100vh - 80px);
display: grid;
align-items: center;
align-content: center;
}
.section-bgimg-content {
position: relative;
height: calc(100vh - 80px);
display: grid;
align-items: center;
align-content: center;
}
.section-bgimg-content .coverimg {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 300;
}
/* #section-community .coverimg {
background-position-y: 150px;
} */
#section-community {
position: relative;
}
#section-community:before {
content: "";
display: block;
position: absolute;
width: 100%;
height: 92%;
top: 0;
left: 0;
z-index: 500;
background: rgb(255, 255, 255);
background: linear-gradient(
0deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 1) 65%
);
}
.section-bgimg-content .area-content {
position: relative;
margin: 0 auto;
z-index: 400;
color: #48597b;
padding-bottom: 70px;
}
.section-bgimg-content .area-content .heading-h1,
.section-bgimg-content .area-content h2 {
color: #48597b;
}
.section-bgimg-content .area-content p {
margin-top: 20px;
margin-bottom: 0;
color: #48597b;
}
.section-bgimg-content .area-content .btn-action {
margin-top: 50px;
}
.section-bgimg-content.a-items-center .area-content,
.section-bgimg-content.a-items-center-top .area-content {
position: relative;
z-index: 600;
max-width: 700px;
margin: 0 auto;
text-align: center;
}
.section-bgimg-content.a-items-center-top {
align-items: start;
align-content: start;
}
.section-bgimg-content.a-items-center-top .btn-absolute {
position: relative;
z-index: 1000;
bottom: 50px;
text-align: center;
}
.section-bgimg-content.a-items-right {
align-items: end;
align-content: end;
}
.section-bgimg-content.a-items-right .area-content {
max-width: 500px;
margin: 0 0 0 auto;
text-align: left;
}
.section-bgimg-content.a-items-center-right {
align-items: center;
align-content: center;
}
.section-bgimg-content.a-items-center-right .area-content {
max-width: 500px;
margin: 0 0 0 auto;
text-align: left;
}
.content-c-white,
.content-c-white .heading-h2,
.content-c-white h2,
.content-c-white h3,
.content-c-white ul li,
.content-c-white p {
color: #fff !important;
}
/* Hero Subtitle */
.hero-subtitle {
width: 100%;
position: absolute;
bottom: 0;
z-index: 700;
text-align: center;
-webkit-transform: translateY(57%) scale(1);
transform: translateY(57%) scale(1);
}
.hero-subtitle h1 {
font-size: 9vw;
line-height: 1;
white-space: nowrap;
text-transform: uppercase;
}
.hero-subtitle .text-box {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
opacity: 1;
transition-duration: 0.9s;
transform: translateZ(0) scale(1);
}
.hero-subtitle.craftmanship {
top: 0;
bottom: inherit;
-webkit-transform: translateY(-41%);
transform: translateY(-41%);
}
.hero-subtitle.craftmanship h1 {
font-size: 8vw;
color: #fff !important;
-webkit-clip-path: none;
clip-path: none;
}
.hero-subtitle.craftmanship .text-box h1:nth-child(2) {
color: #fff;
}
.hero-subtitle.desktop {
display: block;
}
.hero-subtitle.mobile {
display: none;
}
.hero-subtitle.hide .text-box {
opacity: 0;
transition-duration: 1s;
transform: translateZ(0) scale(0);
}
/* Home */
.section-hero-fullimg {
position: relative;
height: calc(100vh - 180px);
background: #000;
}
.section-hero-fullimg .swiper-hero-banner-full,
.section-hero-fullimg .container {
width: 100%;
height: 100%;
}
.section-hero-fullimg .swiper-slide {
overflow: hidden;
position: relative;
z-index: 100;
}
.section-hero-fullimg .coverimg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.section-hero-fullimg .slide-video {
object-fit: cover;
}
.section-hero-fullimg .slide-video video {
object-fit: cover;
width: 100vw;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.section-hero-fullimg .container {
position: relative;
}
.section-hero-fullimg .block-content {
position: absolute;
width: 100%;
z-index: 1000;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
top: 50%;
right: 0;
padding: 0 20px;
text-align: right;
}
.section-hero-fullimg .block-content h1 {
position: relative;
color: #fff;
margin-bottom: 10px;
-webkit-transform: translateY(50px);
transform: translateY(50px);
transition-duration: 1s;
}
.section-hero-fullimg .block-content p {
position: relative;
-webkit-transform: translateY(20px);
transform: translateY(20px);
transition-duration: 1s;
}
.section-hero-fullimg .swiper-slide.swiper-slide-active .block-content h1,
.section-hero-fullimg .swiper-slide.swiper-slide-active .block-content p {
transform: translateY(0);
transition-duration: 1s;
}
/* Hero Banner */
.section-hero {
position: relative;
width: 100%;
height: 395px;
overflow: hidden;
}
.section-hero .swiper-hero-banner,
.section-hero .container {
position: relative;
width: 100%;
height: 100%;
}
.section-hero .area-content {
position: absolute;
width: 100%;
bottom: 35px;
padding: 0 20px;
z-index: 600;
color: #fff;
text-align: center;
}
.section-hero .area-content h1 {
line-height: 1;
color: #fff;
text-transform: uppercase;
}
.section-hero .swiper-slide {
height: 395px;
}
.section-hero .coverimg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
pointer-events: none;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.section-hero .slide-video {
object-fit: cover;
}
.section-hero .slide-video video {
object-fit: cover;
width: 100vw;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.bgimg-parallax {
position: relative;
height: 395px;
z-index: 0;
overflow: hidden;
display: grid;
align-content: center;
align-items: center;
justify-content: center;
justify-items: center;
}
.parallax-desktop {
display: block !important;
}
.parallax-mobile {
display: none !important;
}
.jarallax {
position: relative;
z-index: 0;
}
.jarallax > .jarallax-img {
position: absolute;
object-fit: cover;
font-family: "object-fit: cover;";
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.jarallax-img {
height: 100% !important;
}
.section-promo-home {
padding-top: 150px;
padding-bottom: 50px;
}
.promo-home-img {
display: grid;
grid-row-gap: 30px;
}
.promo-home .heading {
margin-bottom: 35px;
}
.promo-home .block-content {
padding: 80px 0;
}
.home-thumbnail .box-img {
position: relative;
overflow: hidden;
}
.home-thumbnail .box-img img {
position: relative;
width: 100%;
height: auto;
z-index: 1;
transition: all 0.3s ease-in-out;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.home-thumbnail:hover .box-img img {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.home-thumbnail .enty-desc {
padding: 15px 0;
text-align: center;
text-transform: uppercase;
}
.hidden-desktop {
display: none !important;
}
.section-slide-stories,
.slide-stories {
overflow-x: hidden;
}
.section-slide-stories,
.slide-stories,
.swiper-stories-item {
position: relative;
}
.slide-stories .grid-box {
overflow: hidden;
}
.slide-stories .grid-box a {
display: block;
}
.slide-stories .coverimg {
height: 610px;
overflow: hidden;
}
.slide-stories .box-caption {
position: absolute;
bottom: 0;
z-index: 400;
padding: 30px;
color: #fff;
}
.slide-stories .box-caption .entry-count {
font-size: 75px;
line-height: 1;
margin-bottom: 5px;
display: block;
}
.slide-stories .box-caption .entry-count span {
display: none;
}
.slide-stories .box-caption .entry-category {
font-size: 15px;
margin-bottom: 30px;
text-transform: uppercase;
}
.slide-stories .box-caption h3 {
font-size: 25px;
text-shadow: 0px 2px 24px rgba(0, 0, 0, 0.84);
}
.slide-stories .coverimg {
display: grid;
padding: 0 20px;
align-items: center;
}
.slide-stories .subtitle {
font-family: "_pristine_scriptregular";
font-size: 35px;
color: #fff;
text-align: center;
display: none;
}
.section-exhibition {
position: relative;
z-index: 400;
}
.section-exhibition .heading {
margin-bottom: 30px;
}
.section-exhibition .grid-column {
grid-column-gap: 0;
}
.list-exhibition {
padding: 25px 0;
display: grid;
align-items: center;
align-content: center;
grid-template-columns: 1fr 200px;
border-bottom: 1px solid #e1e1e1;
}
.list-exhibition h3 {
font-size: 15px;
text-transform: uppercase;
}
.list-exhibition .entry-date {
font-size: 20px;
color: #000;
display: flex;
align-items: center;
line-height: 1;
margin: 0 0 5px 0;
}
.list-exhibition .entry-location {
font-size: 14px;
color: #737373;
margin-top: 15px;
}
.promo-exhibition {
position: relative;
z-index: 600;
max-width: 450px;
margin: 0 0 0 auto;
}
.promo-exhibition .box-caption {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
color: #fff;
display: grid;
align-items: end;
align-content: end;
padding-bottom: 35px;
text-align: center;
}
.promo-exhibition .box-caption h3 {
font-size: 75px;
line-height: 0.9;
color: #fff;
margin-bottom: 10px;
text-shadow: 0px 2px 24px rgba(0, 0, 0, 0.84);
}
.promo-exhibition .entry-date {
font-family: "_pristine_scriptregular";
font-size: 30px;
}
.promo-exhibition .entry-location {
width: 100%;
position: absolute;
top: 60px;
font-size: 15px;
display: grid;
align-items: center;
}
/* CSR */
.section-csr {
position: relative;
padding-top: 0;
padding-bottom: 100px;
}
.section-header-csr {
padding-top: 50px;
padding-bottom: 20px;
}
.section-header-csr .heading,
.section-header-csr .subtitle {
margin-bottom: 0;
}
.item-csr .block-img {
position: relative;
}
.item-csr .block-img img {
display: block;
width: 100%;
max-width: 100%;
margin: 0 auto;
}
.item-csr .box-description {
display: block;
padding-top: 20px;
}
.item-csr .box-description p:last-of-type {
margin-bottom: 0;
}
.item-csr .box-description h3 {
font-size: 25px;
color: #48597b;
margin-bottom: 20px;
}
.grid-item-csr {
margin-bottom: 40px;
}
.grid-item-csr .box-description {
padding-top: 40px;
}
.align-left-img .grid-item-csr .box-description {
position: relative;
/* top: 50%;
transform: translateY(-50%);
padding-top: 0px; */
}
.list-item-csr {
padding-bottom: 40px;
}
.list-item-csr .block-content {
display: grid;
align-items: start;
}
.grid-column-csr {
display: grid;
grid-template-columns: 1fr;
}
.topic-mobile {
display: none;
}
.section-home-contact:after {
content: "";
display: block;
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 95%;
background: rgb(254, 254, 254);
background: linear-gradient(
0deg,
rgba(254, 254, 254, 1) 0%,
rgba(231, 231, 231, 1) 100%
);
}
.section-two-column {
position: relative;
z-index: 1000;
}
.section-two-column .block-img {
position: relative;
width: 50%;
height: 100%;
padding: 60px;
overflow: hidden;
display: grid;
align-items: center;
background: #0f1537;
}
.section-two-column .block-img .entry-img {
max-width: 380px;
margin: 0 auto;
}
.section-two-column .block-form {
padding: 70px 20px;
}
.section-subscribe {
position: relative;
width: 100%;
height: 700px;
background-position: center;
background-repeat: no-repeat;
background-image: url(../img/design/subscribe-bg.jpg);
background-size: cover;
}
.section-subscribe .block-subscribe {
width: 700px;
height: 550px;
margin: 0 auto;
position: absolute;
z-index: 200;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -45%);
transform: translate(-50%, -45%);
background-image: url(../img/design/card.png);
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
}
.section-subscribe .block-subscribe .box-inner {
max-width: 380px;
margin: 0 auto;
position: absolute;
z-index: 200;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.section-subscribe .heading-h2 {
position: relative;
display: inline-block;
}
.section-subscribe .heading-h2:after {
content: "";
display: block;
width: 45px;
height: 45px;
margin: 0 auto;
position: absolute;
top: -15px;
right: -30px;
background-image: url(../img/logo.svg);
background-size: 45px 45px;
}
.section-subscribe .block-subscribe .form-styles {
margin-top: 30px;
display: block;
}
.section-subscribe .block-subscribe .entry-desc {
margin-top: 10px;
}
.bg-subscribe {
position: relative;
width: 100%;
height: 100%;
}
.bg-subscribe:before {
content: "";
display: block;
position: absolute;
z-index: -1;
top: -150px;
left: 0;
width: 100%;
height: 135vh;
background-image: url(../img/design/subscribe-bg.jpg);
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
}
.section-column-content {
position: relative;
display: grid;
grid-template-columns: 1fr;
}
.section-column-content .bg-c-gray {
height: 86%;
width: 100%;
position: absolute;
display: block;
}
.section-column-content .block-img {
position: relative;
z-index: 200;
padding: 0 20px;
}
.section-column-content .block-img.nopadding {
padding: 0;
}
.section-column-content .box-inner {
padding: 0 100px;
}
/* Contact */
.section-contact {
position: relative;
padding-bottom: 0;
height: unset !important;
min-height: inherit !important;
}
.address-contact {
position: relative;
z-index: 500;
text-align: center;
}
.address-contact p {
margin-bottom: 20px;
}
.map-container {
width: 100%;
height: 500px;
background-position: center;
background-repeat: no-repeat;
background-image: url(../img/design/map.jpg);
background-size: cover;
}
.map-container:before {
content: "";
display: block;
position: absolute;
width: 100%;
height: 100px;
top: 0;
left: 0;
z-index: 100;
background: rgb(255, 255, 255);
background: linear-gradient(
0deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 1) 100%
);
}
.section-contact-form {
position: relative;
background-color: #fff;
}
.section-contact-form .block-form {
padding: 120px 20px;
background-color: #fff;
}
.section-slide-shine {
position: relative;
overflow-x: hidden;
}
.slide-shine .grid-box,
.slide-shine .coverimg {
position: relative;
opacity: 0.8;
}
.slide-shine .grid-box {
overflow: hidden;
opacity: 1;
}
.slide-shine:hover .coverimg {
opacity: 0.5;
}
.slide-shine .box-caption {
position: absolute;
width: 100%;
height: 100%;
bottom: 0;
z-index: 100;
color: #fff;
padding: 30px;
display: grid;
align-content: end;
}
.slide-shine .box-caption .text-lg {
font-size: 75px;
line-height: 1;
}
.slide-shine .box-caption h3 {
font-size: 25px;
margin-bottom: 20px;
}
.slide-shine .grid-box {
height: 44.44vw;
background-color: #000;
}
.slide-shine .coverimg {
position: absolute;
top: 0;
left: 0;
z-index: 10;
width: 100%;
height: 100%;
overflow: hidden;
-webkit-transform: scale(1);
transform: scale(1);
transition: ease-in-out 0.4s;
}
/* swiper */
.swiper-button-next.swiper-button-white,
.swiper-button-prev.swiper-button-white {
--swiper-navigation-color: #4d4d4d;
}
.swiper-button-next,
.swiper-button-prev {
width: 30px;
height: 30px;
top: 50%;
z-index: 200;
margin: 0;
z-index: 1000;
color: #4d4d4d;
overflow: hidden;
}
.swiper-button-prev:after,
.swiper-button-next:after {
display: block;
font-family: "icon-meo-jewelry";
text-indent: 0px;
font-size: 25px;
}
.swiper-button-prev:after {
content: "\e903";
}
.swiper-button-next:after {
content: "\e902";
}
.swiper-button-prev:hover:after,
.swiper-button-next:hover:after {
color: #4d4d4d;
}
.swiper-button-prev:focus,
.swiper-button-next:focus,
.swiper-button-prev:focus:after,
.swiper-button-next:focus:after {
outline: 0;
bottom: 0;
margin: 0;
padding: 0;
}
/* Jewelry */
.section-jewelry {
position: relative;
height: 100vh;
overflow: hidden;
background: #fafafa;
}
.section-jewelry .container {
height: 100%;
}
.section-jewelry .coverimg {
width: 100%;
height: 100vh;
}
.section-jewelry .heading {
margin-bottom: 0;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
overflow: hidden;
}
.section-jewelry .heading h1 {
color: #000;
}
.section-jewelry .tab-category {
margin-bottom: 25px;
}
.section-jewelry .tab-category ul li {
display: inline-block;
vertical-align: middle;
cursor: pointer;
margin-right: 5px;
margin-bottom: 5px;
font-size: 14px;
color: #4d4d4d !important;
background: #fff;
padding: 4px 21px;
border-radius: 13px;
transition: 0.5s;
}
.section-jewelry .tab-category ul li.active {
transition: 0.5s;
color: #000;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.59);
}
.section-jewelry .align-bottom {
width: 100%;
position: absolute;
z-index: 1000;
bottom: 30px;
padding-left: 50px;
padding-right: 50px;
}
.swiper-jewelry-item {
overflow: hidden;
}
.swiper-jewelry-item .swiper-slide {
width: 115px;
margin-right: 25px;
}
.swiper-jewelry-item .swiper-button-next,
.swiper-jewelry-item .swiper-button-prev {
margin-top: 12px;
}
.section-jewelry.content-c-white .swiper-button-next.swiper-button-white,
.section-jewelry.c-whit .swiper-button-next.swiper-button-white {
--swiper-navigation-color: #000;
}
.section-jewelry.content-c-white .swiper-button-prev:after,
.section-jewelry.c-white .swiper-button-next:after {
color: #000;
}
.section-jewelry.content-c-white .tab-category ul li a {
color: #000;
}
.jewelry-thumb {
display: block;
cursor: pointer;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.jewelry-thumb img {
position: relative;
display: block;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.swiper-slide:hover .jewelry-thumb {
background: #0c1b38;
}
.swiper-slide:hover .jewelry-thumb img {
-webkit-transform: scale(0.7);
transform: scale(0.7);
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.section-jewelry .tab-content {
display: none;
}
.section-jewelry .tab-content.current {
display: block;
}
/* Modal Popup */
.modal-popup {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
display: none;
z-index: 8000;
overflow-y: auto;
visibility: hidden;
background: rgba(14, 14, 12, 0.7);
}
.mfp-zoom-out-cur {
height: 100vh !important;
overflow: hidden;
}
.modal-popup .modal-popup-container {
position: relative;
height: 100%;
padding-left: 20px;
padding-right: 20px;
display: grid;
align-items: center;
}
.modal-popup-active {
height: 100vh;
overflow: hidden;
}
.modal-popup-active .modal-popup {
opacity: 1;
visibility: visible;
}
.modal-close,
a.modal-close {
width: 30px;
height: 30px;
line-height: 26px;
display: inline-block;
position: absolute;
top: 30px;
right: 30px;
z-index: 105;
font-size: 18px;
text-align: center;
color: #fff;
border: 0;
border-radius: 0;
text-decoration: none !important;
background-color: transparent;
}
.modal-close:hover {
opacity: 1;
color: #fff;
}
.modal-inner {
max-width: 450px;
margin: 0 auto;
}
.modal-inner.lg {
max-width: 100%;
}
.modal-content {
position: relative;
z-index: 1000;
width: 700px;
margin: 20px auto;
border-radius: 0;
padding: 50px 40px;
background-color: #fff;
}
.modal-content h3 {
margin-bottom: 15px;
}
.modal-content .heading p {
font-size: 14px;
}
.modal-content .modal-close,
.modal-content a.modal-close {
color: #000;
}
.modal-content .form-group {
margin-bottom: 20px;
}
.modal-content .form-group:last-of-type {
margin-bottom: 0;
}
.modal-popup.hide {
display: none !important;
}
.popup-subscribe {
background-position: center;
background-repeat: no-repeat;
background-image: url(../img/design/bg-subscribe.jpg);
background-size: cover;
}
.footnote {
font-size: 14px;
color: #565656;
}
.box-logo-item {
position: relative;
z-index: 1;
text-align: center;
}
.box-logo-item .logo-item {
width: 50px;
height: auto;
margin: 0 10px;
display: inline-block;
}
/* Slick */
.slick-slide {
position: relative;
}
.slick-slide:focus {
outline: 0;
border: 0;
}
.slider-group.slider-info-group {
display: none;
}
.two-column-slide {
overflow: hidden;
width: 100%;
position: relative;
display: grid;
padding-top: 100px;
padding-bottom: 50px;
padding-bottom: 0;
grid-column-gap: 50px;
grid-template-columns: 1fr;
}
.two-column-slide .imgblank {
width: 100%;
}
.two-column-slide .slick-slider {
position: relative;
height: 100%;
display: grid;
align-items: start;
align-content: start;
}
.two-column-slide .block-content {
padding-top: 20px;
text-align: center;
}
.two-column-slide .block-img {
max-width: 750px;
margin: 0 auto;
}
.two-column-slide .box-img {
font-size: 14px;
text-align: center;
}
.two-column-slide .box-img img {
filter: grayscale(80%);
}
.two-column-slide .btn-action {
margin-top: 30px;
}
.two-column-slide p,
.two-column-slide .entry-desc {
font-size: 14px;
padding-top: 20px;
text-align: center;
}
.two-column-slide .slick-dotted.slick-slider {
margin-bottom: 0;
}
.two-column-slide .heading {
margin-bottom: 30px;
}
.two-column-slide .slick-dots {
z-index: 500;
display: table;
width: 100%;
bottom: -40px;
text-align: center;
}
.two-column-slide .slick-dots li {
height: 3px;
margin: 0;
padding: 0 5px;
display: table-cell;
}
.two-column-slide .slick-dots li button {
width: 100%;
height: 3px;
padding: 0;
background-color: #e5e5e5;
}
.two-column-slide .slick-dots li button:before {
display: none;
}
.two-column-slide .slick-dots li.slick-active button {
background-color: #000;
}
.link-download {
width: 150px;
padding: 30px 0;
margin: 0 10px;
font-size: 15px;
color: #000;
display: inline-block;
border-radius: 30px;
transition: all 0.3s ease-in-out;
}
.link-download .ic {
font-size: 50px;
display: block;
margin-bottom: 10px;
}
.link-download:hover {
background: #ededed;
}
.section-metal-testing .col-content-img {
position: relative;
overflow: hidden;
z-index: 400;
display: grid;
grid-column-gap: 50px;
align-items: center;
grid-template-columns: auto 40%;
}
.section-metal-testing .area-content {
padding: 0 20px;
}
.swiper-single-item {
position: relative;
overflow: hidden;
padding-bottom: 100px;
}
.item-process .box-img {
margin: 30px 0;
font-size: 0;
display: block;
align-items: center;
text-align: center;
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.item-process .img-item {
height: 182px;
display: inline-block;
vertical-align: middle;
justify-content: center;
}
.item-process .img-item img {
width: auto;
height: 182px;
margin: 0 10px;
}
.item-process .box-content {
max-width: 900px;
margin: 0 auto;
padding: 0 20px 50px;
text-align: center;
}
.item-process .box-content h3 {
color: #48597b;
margin-bottom: 5px;
}
.item-process .box-content h3 span {
display: inline-block;
font-family: "Saol Display Light";
font-size: 75px;
line-height: 1;
font-style: italic;
padding: 0 5px;
}
.section-craftmanship-process {
position: relative;
overflow: hidden;
padding: 50px 0 80px;
}
.section-craftmanship-process .slick-dotted.slick-slider {
margin-bottom: 0;
}
.section-craftmanship-process .slick-dots {
position: relative;
bottom: 20px;
}
.section-craftmanship-process .slick-dots:after {
content: "";
display: block;
width: 100%;
height: 5px;
position: absolute;
bottom: -23px;
z-index: -1;
background-color: #ededed;
}
.section-craftmanship-process .slick-dots li {
position: relative;
width: 100px;
height: 50px;
text-align: center;
}
.section-craftmanship-process .slick-dots li button {
display: block;
margin: 0 auto;
padding: 0;
width: 50px;
height: 50px;
font-family: "Saol Display Light";
font-size: 25px;
line-height: 1;
color: #48597b;
}
.section-craftmanship-process .slick-dots li button {
width: 50px;
height: 50px;
text-align: center;
}
.section-craftmanship-process .slick-dots li button:before {
opacity: 1;
width: 15px;
height: 15px;
top: 140%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border-radius: 50%;
border: 1px solid #ededed;
background-color: #fff;
}
.section-craftmanship-process .slick-dots li button:before {
content: "";
}
.section-craftmanship-process .slick-dots li.slick-active button:before {
width: 50px;
height: 50px;
background-color: #ededed;
}
.process-twocol {
position: relative;
}
.process-twocol .gallery-slider {
width: 100%;
position: relative;
}
/* .process-twocol .slider-info, .process-twocol .slider-img {
display: grid;
align-items: center;
align-content: center;
} */
.process-twocol .slider-info {
background: #e7e7eb;
}
.process-twocol .slider-info.bg-c-white {
background: #fff;
}
.process-twocol .slider-info.a-items-top {
align-items: start;
align-content: start;
}
.process-twocol .slider-process {
width: 50%;
}
.process-twocol .slider-process,
.process-twocol .slide-item {
height: 100%;
}
.process-twocol .slider-img .slide-item {
display: grid;
align-items: center;
background: #0f1537;
}
.process-twocol .slider-img .block-img {
max-width: 100%;
margin: 0 auto;
}
.process-twocol .block-img .entry-img {
max-width: 400px;
margin: 0 auto;
}
.process-twocol .block-img h3 {
display: none;
padding-top: 15px;
color: #fff;
font-size: 17px;
text-align: center;
text-transform: uppercase;
}
.process-twocol .area-content {
text-align: center;
padding: 70px 40px;
}
.process-twocol .area-content .heading {
margin-bottom: 20px;
}
.process-twocol .area-content .heading-h1 {
color: #48597b;
text-transform: uppercase;
margin-top: 20px;
}
.process-twocol .area-content .box-content {
max-width: 500px;
margin: 0 auto;
padding-top: 20px;
}
.process-twocol .area-content .box-content.nopadding-top {
padding-top: 0;
}
.process-twocol .area-content h3 {
margin-bottom: 20px;
}
.process-info .swiper-button-next,
.swiper-whyus-item .swiper-button-next {
top: inherit;
right: inherit;
left: 0;
bottom: 0;
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
}
.process-info .swiper-button-next,
.swiper-whyus-item .swiper-button-next {
width: 50%;
height: 70px;
}
.process-info .swiper-button-next:after,
.swiper-whyus-item .swiper-button-next:after {
font-family: "icon-meo-jewelry";
content: "\e90d";
font-size: 45px;
}
.process-thumbs .swiper-slide-thumb-active .slide-menu {
opacity: 1;
}
.section-slide-twocol {
overflow-x: hidden;
}
/* Select2 */
.select2-container {
width: 100% !important;
}
.select2-container .select2-selection--single {
height: 45px;
}
.select2-container--default .select2-selection--single {
padding: 0 20px;
border-radius: 0;
border: 0;
border-bottom: 1px solid #e1e1e1;
}
.select2-container .select2-selection--single:focus {
outline: 0;
}
.select2-container--default
.select2-selection--single
.select2-selection__rendered {
font-family: "" minerva-modern "", sans-serif;
font-size: 15px;
line-height: 45px;
text-align: center;
color: #000;
opacity: 1;
}
.select2-dropdown {
border: 1px solid #e1e1e1;
}
.select2-container--default
.select2-results__option--highlighted.select2-results__option--selectable {
color: #000;
background-color: transparent;
}
.select2-results__option {
padding: 10px 15px;
font-family: "" minerva-modern "", sans-serif;
font-size: 18px;
color: #000;
}
.select2-container--default .select2-results__option--selected {
color: #000;
background-color: transparent;
}
.select2-container--default .select2-selection--single {
background-color: transparent;
}
.select2-container--default
.select2-selection--single
.select2-selection__arrow
b {
left: 0;
margin-left: 0;
margin-top: 10px;
border-color: #000 transparent transparent transparent;
}
.select2-container .select2-selection--single .select2-selection__rendered {
padding-left: 0;
padding-right: 0;
}
.select2-container--default.select2-container--open
.select2-selection--single
.select2-selection__arrow
b {
border-color: transparent transparent #000 transparent;
}
.select2-search__field {
display: none;
}
.select2-container--default .select2-selection--multiple {
border-radius: 0;
border: 0;
border-bottom: 1px solid #e1e1e1;
background-color: transparent;
}
.select2-container--default.select2-container--focus
.select2-selection--multiple {
border: 0;
}
.visible-992 {
display: none !important;
}
.content-group {
padding-bottom: 80px;
}
.content-group:last-of-type {
padding-bottom: 0;
}
/* Company */
.section-statistic {
position: relative;
background-color: #000;
}
.section-statistic .coverimg {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-position: center -60px;
background-size: contain;
}
.section-statistic .area-content {
position: relative;
z-index: 500;
}
.badge-column {
margin-top: 30px;
display: inline-table;
}
.badge-content {
margin-bottom: 50px;
width: 25%;
display: inline-table;
text-align: center;
}
.badge-content p {
margin-bottom: 0;
line-height: 1.3;
}
.badge-content p.head {
font-size: 18px;
min-height: 70px;
display: grid;
align-items: start;
}
.badge-value {
white-space: nowrap;
display: block;
font-family: "Saol Display Light";
font-size: 30px;
margin-bottom: 10px;
}
.badge-text {
font-size: 20px;
}
.section-why-us {
overflow: hidden;
}
.swiper-whyus-item .swiper-button-next {
position: relative;
bottom: 80px;
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
.section-company-thumbimg,
.section-company-thumbimg .container {
position: relative;
}
.section-company-thumbimg {
z-index: 400;
}
.company-thumbimg .box-inner {
position: relative;
}
.company-thumbimg .thumb-img h3 {
font-family: "Saol Display Light";
text-transform: uppercase;
text-align: center;
font-size: 50px;
color: #fff;
position: absolute;
width: 100%;
top: 0;
z-index: 100;
/*
-webkit-transform: translateY(-15%);
transform: translateY(-15%);
*/
}
.company-thumbimg .thumb-img p {
padding: 20px 45px 10px;
font-size: 14px;
color: #fff;
width: 100%;
position: absolute;
bottom: 0;
text-align: center;
line-height: 17px;
text-shadow: 0px 0px 4px #000;
}
.company-thumbimg .thumb-img p.texttop {
top: 30px;
bottom: inherit;
}
.company-thumbimg .thumb-img.xs {
width: 283px;
}
.company-thumbimg .thumb-img img {
width: 100%;
}
.section-company-img .area-content {
padding: 70px 0;
}
.section-case-study {
position: relative;
overflow: hidden;
}
.section-case-study:after {
content: "";
display: block;
width: 15%;
height: 100%;
position: absolute;
top: 0;
right: 0;
z-index: 1000;
background: rgb(254, 254, 254);
background: linear-gradient(
90deg,
rgba(254, 254, 254, 0) 30%,
rgb(255 255 255 / 90%) 100%
);
}
.section-case-study .swiper-container-horizontal > .swiper-pagination-bullets,
.section-case-study .swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: 0;
}
.case-study-container {
display: grid;
align-items: center;
grid-template-columns: 40% 1fr;
}
.item-case-study {
width: 500px !important;
}
.item-case-study:nth-child(2n) {
-webkit-transform: translateY(60px);
transform: translateY(60px);
}
.item-case-study .box-content {
text-align: center;
margin: 6px;
padding: 30px 30px 20px 30px;
box-shadow: 2px 3px 6px rgb(0 0 0 / 35%);
background-image: url(../img/design/bg-case-study.jpg);
background-position: center;
}
.item-case-study .box-content h3 {
color: #48597b;
margin-bottom: 15px;
}
.item-case-study .textlink {
display: inline-block;
-webkit-transform: rotate(-6deg);
-ms-transform: rotate(-6deg); /* IE 9 */
transform: rotate(-6deg);
}
.item-case-study .btn-action {
margin-top: 20px;
}
.container-slider {
position: relative;
width: 60%;
}
.container-slider .container {
max-width: 1300px;
}
.swiper-case-study {
margin: 0 auto;
position: relative;
overflow-x: hidden;
list-style: none;
padding-left: 10px;
padding-bottom: 70px;
z-index: 1;
}
/* Company History */
.section-history {
padding-top: 70px;
padding-bottom: 70px;
position: relative;
overflow: hidden;
}
.history-slide {
height: 100%;
position: relative;
padding-left: 20px;
padding-right: 20px;
}
.item-history {
max-width: 1000px;
margin: 0 auto;
height: 25vw;
display: grid;
align-items: center;
align-content: center;
justify-content: center;
}
.item-history .heading {
margin-bottom: 20px;
}
.item-history.a-center-img .col-history {
grid-template-columns: 1fr;
}
.item-history.a-center-img .block-content {
text-align: center;
}
.item-history.a-center-img .block-img {
text-align: center;
}
.item-history.a-center-img .block-img img {
margin: 0 auto;
}
.item-history.a-right-img .col-history .block-img img {
margin: 0 auto 0 0;
}
.item-history .block-img {
display: grid;
align-items: center;
text-align: center;
}
.item-history .block-img img {
margin: 0 auto;
}
.item-history .heading-h1 {
-webkit-transform: translateX(5%);
transform: translateX(5%);
transition-duration: 1s;
}
.item-history .col-history {
-webkit-transform: translateX(-5%);
transform: translateX(-5%);
transition-duration: 1s;
}
.item-history .block-content {
padding-top: 20px;
}
.item-history .block-content h3 {
color: #48597b;
margin-bottom: 15px;
}
.years-group {
width: 100%;
position: absolute;
bottom: 20px;
z-index: 500;
}
.slider-years {
margin-left: -25px;
margin-right: -20px;
}
.slider-years .slick-list:after {
content: "";
display: block;
position: absolute;
right: -60px;
bottom: 42px;
width: 100%;
height: 5px;
z-index: -1;
pointer-events: none;
background-color: #ededed;
}
.nav-years {
width: 100px;
height: 100px;
padding: 0 3px;
text-align: center;
}
.nav-years .text-years {
font-family: "Saol Display Light";
font-size: 22px;
color: #48597b;
}
.nav-years:after {
content: "";
display: block;
width: 15px;
height: 15px;
position: absolute;
top: 55%;
left: 50%;
z-index: 500;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border-radius: 50%;
border: 1px solid #ededed;
background-color: #fff;
}
.slider-history-info .slick-slide.slick-current.slick-active .heading-h1,
.slider-history-info
.slick-slide.slick-current.slick-active
.item-history
.col-history {
-webkit-transform: translateX(0);
transform: translateX(0);
}
.slider-years .slick-slide.slick-current.slick-active .nav-years:after {
width: 50px;
height: 50px;
background-color: #ededed;
}
/* Casestudy Popup */
.casestudy-popup {
display: grid;
align-items: start;
grid-column-gap: 40px;
grid-template-columns: 1fr 1fr;
}
.slide-casestudy-popup {
display: grid;
grid-template-columns: 1fr;
}
.slide-casestudy-popup .item {
margin: 0 !important;
}
.slider-thumb-group {
grid-row: 2;
margin-top: 10px;
margin-right: -8px;
}
/* magnificPopup */
.mfp-wrap {
z-index: 200000;
}
.mfp-bg {
z-index: 200000 !important;
background: rgba(255, 255, 255, 0.92);
}
.mfp-with-zoom.mfp-ready.mfp-bg {
opacity: 1;
}
.mfp-counter {
display: none;
}
.mfp-close {
cursor: pointer !important;
right: 50px;
color: #000 !important;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.mfp-close:active {
top: 45px;
}
.mfp-close:after {
font-family: "icon-meo-jewelry";
content: "\e908";
display: block;
font-size: 18px;
color: #000;
}
.mfp-container {
position: fixed;
padding: 0;
}
.mfp-no-margins img.mfp-img {
padding: 0;
}
.mfp-no-margins .mfp-figure:after {
top: 0;
bottom: 0;
}
.mfp-figure:after {
box-shadow: none;
}
.mfp-no-margins .mfp-container {
padding: 0;
}
.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
position: fixed !important;
opacity: 0;
-webkit-backface-visibility: hidden;
transition: all 0.3s ease-out;
}
.mfp-with-zoom.mfp-ready .mfp-container {
opacity: 1;
}
.mfp-with-zoom.mfp-removing .mfp-container,
.mfp-with-zoom.mfp-removing.mfp-bg {
opacity: 0;
}
.mfp-jewelry .mfp-close {
top: 5px !important;
right: -20px !important;
z-index: 2000 !important;
cursor: pointer !important;
}
/* World Map */
.world-map {
position: relative;
max-width: 1050px;
margin: 0 auto;
}
.world-map .label-zone {
position: absolute;
display: block;
transition: all 0.3s ease-out;
}
.world-map .label-zone:after {
content: "";
position: absolute;
width: 4px;
height: 4px;
border-radius: 50%;
display: block;
background-color: #fff;
transition: all 0.3s ease-out;
}
.world-map .label-zone span {
position: absolute;
white-space: nowrap;
display: block;
padding: 2px 15px;
top: -35px;
left: 50%;
opacity: 0;
background-color: #000;
-webkit-transform: translateX(-48%);
transform: translateX(-48%);
border: 1px solid #fff;
transition: all 0.3s ease-out;
}
.world-map .label-zone:hover {
transition: all 0.3s ease-out;
}
.world-map .label-zone:hover span {
z-index: 200;
opacity: 1;
top: -40px;
transition: all 0.3s ease-out;
}
/* Casestudy Popup */
.casestudy-popup {
position: relative;
max-width: 1000px;
min-height: 540px;
margin: 0 auto;
overflow: hidden;
width: 100%;
padding: 120px 40px 80px;
background-color: #fff;
}
.casestudy-popup .block-content-popup {
font-size: 15px;
}
.casestudy-popup .block-content-popup p {
margin-bottom: 20px;
}
.casestudy-popup .block-content-popup .heading {
margin-bottom: 15px;
}
.casestudy-popup .block-content-popup h3 {
color: #48597b;
}
.casestudy-popup .slider-img-view .box-img {
position: relative;
width: 440px;
height: 282px;
overflow: hidden;
}
.casestudy-popup .slider-img-view .box-img img {
object-fit: cover;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: auto;
}
.casestudy-popup .box-img-xs {
position: relative;
width: 104px;
height: 66px;
margin-right: 10px;
}
.casestudy-popup .box-img-xs img {
object-fit: cover;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: auto;
}
.casestudy-popup .slick-slider {
position: relative;
height: 100%;
display: grid;
}
.casestudy-popup .slick-dotted.slick-slider {
margin-bottom: 0;
}
.casestudy-popup .slick-dots {
width: 50%;
left: 50%;
bottom: -100px;
z-index: 500;
text-align: center;
-webkit-transform: translateX(60%);
transform: translateX(60%);
}
.casestudy-popup .slick-dots li {
width: 6px;
height: 6px;
margin: 0 5px;
padding: 0;
border-radius: 50%;
}
.casestudy-popup .slick-dots li button {
width: 6px;
height: 6px;
padding: 0;
border-radius: 50%;
background-color: #e5e5e5;
}
.casestudy-popup .slick-dots li button:before {
display: none;
}
.casestudy-popup .slick-dots li.slick-active button {
background-color: #000;
}
/* modal */
.modal-slider .slick-prev,
.modal-slider .slick-next {
width: 60px;
height: 60px;
z-index: 100;
background-color: rgb(0 0 0 / 66%);
}
.modal-slider .slick-prev:before,
.modal-slider .slick-next:before {
display: block;
font-family: "icon-meo-jewelry";
text-indent: 0px;
font-size: 40px;
color: #fff;
}
.modal-slider .slick-next {
right: 0;
}
.modal-slider .slick-prev {
left: 0;
}
.modal-slider .slick-prev:before {
content: "\e903";
}
.modal-slider .slick-next:before {
content: "\e902";
}
.modal-slider-item .item {
position: relative;
margin: 0 30px;
}
.modal-slider-item .mfp-close {
position: absolute;
right: 0;
top: 20px;
}
.modal-slider-item .mfp-close:after {
font-size: 20px;
}
/* mfp */
.mfp-arrow {
width: 30px;
height: 30px;
padding: 0;
margin: 0;
opacity: 1;
text-align: center;
-webkit-transform: translateY(-50%) !important;
transform: translateY(-50%) !important;
}
.mfp-arrow:active {
margin: 0;
}
.mfp-arrow:after {
top: 0 !important;
}
.mfp-arrow:before,
.mfp-arrow:after {
display: block;
border: 0;
}
.mfp-arrow-left:after,
.mfp-arrow-right:after {
width: 30px;
height: 30px;
display: block;
margin: 0;
font-family: "icon-meo-jewelry";
color: #000;
text-indent: 0px;
font-size: 25px;
}
.mfp-arrow-left:before,
.mfp-arrow-right:before {
display: none;
}
.mfp-arrow-left:after {
content: "\e903";
}
.mfp-arrow-right:after {
content: "\e902";
}
.mfp-arrow-left {
left: 20px;
}
.mfp-arrow-right {
right: 20px;
}
.mfp-arrow-left:hover:after,
.mfp-arrow-left:after:hover {
color: #000;
}
.mfp-arrow:before:focus,
.mfp-arrow:hover:focus,
.mfp-arrow:active,
.mfp-arrow:focus {
outline: 0;
bottom: 0;
margin: 0;
padding: 0;
}
.mfp-close {
width: 30px;
height: 30px;
line-height: 30px;
top: 50px;
right: 15px !important;
margin: 0;
padding: 0;
opacity: 1;
font-size: 16px;
}
button.mfp-close,
button.mfp-arrow {
padding: 0 !important;
}
.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
width: auto;
}
.hide-desktop {
display: none;
}
.covervideo.desktop {
display: block !important;
}
.covervideo.mobile {
display: none !important;
}
/* IMG History */
.img-year-2001 {
width: 652px;
}
.img-year-2006 {
width: 652px;
}
.img-year-2008 {
width: 500px;
}
.img-year-2020 {
width: 266px;
}
.img-year-2020-01 {
width: 272px;
}
/* 31.05.2021 */
.wpcf7-not-valid-tip {
font-size: 13px;
margin-top: 2px;
}
.wpcf7 form .wpcf7-response-output {
margin: 10px 0;
padding: 0.2em 1em;
border: 1px solid #00a0d2;
font-size: 13px;
text-align: center;
}
.canceled {
padding: 3px 7px;
font-size: 10px;
text-transform: uppercase;
background-color: #b01a1a;
color: #fff;
margin-left: 10px;
border-radius: 4px;
font-weight: bold;
}
/* 30.06.2021 */
.section-company-csr {
position: relative;
padding: 100px 0;
background-size: contain;
background-repeat: no-repeat;
background-position: center bottom;
background-image: url(../img/design/sc-bg-company-csr.jpg);
}
.section-company-csr .area-content {
position: relative;
z-index: 300;
max-width: 750px;
margin: 0 auto;
padding-bottom: 30vw;
}
.section-company-csr .area-content h2 {
margin-bottom: 40px;
}
.section-company-csr .area-content p {
color: #000;
}
.section-company-csr .box-img {
max-width: 677px;
margin: 0 auto 40px;
}
.section-company-csr .area-content {
text-align: center;
}
.section-company-csr .btn-action {
text-align: center;
}
.company-csr-list {
display: none;
}
/* Timeline */
.section-timeline {
position: relative;
overflow: hidden;
padding: 50px 0 0;
}
.section-timeline .heading {
margin-bottom: 40px;
}
.timeline-container {
position: relative;
padding-bottom: 80px;
}
.timeline-container:after {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 1px;
height: 100%;
z-index: 10;
background-color: #e1e1e1;
}
.timeline-item {
position: relative;
z-index: 100;
display: grid;
align-items: center;
grid-template-columns: 1fr;
}
.timeline-item .block-content {
margin-top: 40px;
margin-bottom: 40px;
}
.timeline-item .block-content h2 {
position: relative;
margin-bottom: 20px;
}
.timeline-item .block-content h2:after {
content: "";
width: 15px;
height: 15px;
position: absolute;
top: 16px;
border-radius: 50%;
background-color: #ccc;
z-index: 200;
}
.timeline-item .block-content h3 {
color: #48597b;
margin-bottom: 10px;
}
/* Certification */
#section-quality-certification {
padding-top: 80px;
padding-bottom: 100px !important;
}
.certification-container {
display: inline-table;
text-align: center;
margin-top: 40px;
}
.certification-item {
width: 33.33336%;
display: inline-flex;
padding: 20px;
}
.certification-item img {
display: block;
width: auto;
height: auto;
max-height: 120px;
margin: 0 auto;
}
.popup-certification {
background: rgba(255, 255, 255, 0.92);
}
.popup-certification .modal-content {
width: 100%;
max-width: 750px;
}
.popup-certification .modal-content h3 {
color: #48597b;
}
.popup-certification .modal-inner {
max-width: 100%;
}
.popup-certification .box-img {
text-align: center;
margin-bottom: 30px;
}
.popup-certification .modal-close,
.popup-certification a.modal-close {
top: 20px;
right: 20px;
}
.dropdown-jewelry {
display: none;
}
/* 07 Nov 2024 */
/* BASE STYLE ==================== */
/*PLUGIN:MARQUEE==================== */
*[data-js="liMarquee"] .mWrap .mMove,
*[data-js="liMarquee"] .mWrap .mItem {
width: auto !important;
}
*[data-js="liMarquee"] .mWrap .mItem {
float: left !important;
}
*[data-js="liMarquee"] .cloneContent {
padding: 0 !important;
}
button,
input,
textarea,
select {
outline: 0;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
box-shadow: none;
border-radius: 0;
border: 0;
background: none;
padding: 0;
margin: 0;
min-width: 0;
font: inherit;
line-height: normal;
text-transform: inherit;
text-align: inherit;
letter-spacing: inherit;
text-indent: inherit;
color: inherit;
}
/* FORM */
*:is(input, textarea, select) {
background: none;
border-radius: 0;
border: none !important;
border-bottom: var(--input-border) !important;
font-family: var(--font-body);
font-weight: var(--font-weight-regular);
font-size: var(--font-size-body);
line-height: normal;
text-transform: inherit;
text-align: left;
letter-spacing: inherit;
text-indent: inherit;
color: inherit;
display: block;
width: 100%;
height: var(--input-height);
padding: var(--input-spacing-y) var(--input-spacing-x);
padding-bottom: 0;
position: relative;
}
textarea {
--height: calc(var(--input-height) * 2);
resize: none;
display: block;
overflow: auto;
width: 100% !important;
min-width: 100%;
max-width: 100%;
min-height: var(--height);
}
.choice {
position: relative;
display: flex;
max-width: 100%;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
font-family: inherit;
font-weight: inherit;
font-size: inherit;
color: inherit;
line-height: inherit;
letter-spacing: normal;
text-transform: none;
}
.choice > span {
position: relative;
display: inline-block;
-webkit-touch-callout: none;
}
.choice > input {
position: absolute;
z-index: -1000;
overflow: hidden;
clip: rect(0 0 0 0);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
background: none;
}
.choice input + span {
display: inline-block;
vertical-align: baseline;
text-align: left;
padding-left: calc(1em + var(--spacing-16));
line-height: inherit;
min-width: 1em;
min-height: 1em;
height: auto;
cursor: pointer;
}
.choice input + span:before,
.choice input + span:after {
content: "";
display: flex;
align-items: center;
justify-content: center;
width: 1em;
height: 1em;
border-radius: 2px;
color: rgba(var(--rgb), 1);
line-height: 1;
margin: 0;
position: absolute;
left: 0;
top: 0.25em;
}
.choice input + span:before {
background: none;
border: 1px solid;
}
.choice input + span:after {
background: currentColor;
opacity: 0;
transform: scale(0.5);
transition: opacity 0.1s;
}
.choice input:checked + span:after {
opacity: 1;
}
.choice input[type="checkbox"] + span:after {
font-family: "iconfont";
content: "\e923";
background: none;
width: 1em;
height: 1em;
transform: scale(0.65);
}
.choice input[type="radio"] + span:before,
.choice input[type="radio"] + span:after {
border-radius: 50%;
}
.choice-container {
display: grid;
grid-template-columns: 100%;
grid-gap: var(--spacing-16);
}
.label:not(.anim) + *[class*="choice"] {
margin-top: var(--spacing-20);
}
/* CHECKBOX&RADIO:END */
.fields {
--col-gap: var(--spacing-40);
--row-gap: var(--spacing-16);
display: flex;
flex-wrap: wrap;
justify-content: space-between;
row-gap: var(--row-gap);
column-gap: var(--col-gap);
}
.field {
position: relative;
width: 100%;
}
@media (min-width: 992px) {
.field.half-width {
width: 47.3392461197%;
}
}
.field.focusin {
z-index: 2;
}
*[class*="fields"] + *[class*="fields"] {
margin-top: var(--spacing-24);
}
*[class*="fields"] + .fields-cta {
margin-top: var(--spacing-30);
}
.label {
padding: 0;
border: 0;
border-radius: 0;
position: relative;
display: block;
font-family: var(--font-body);
font-weight: var(--font-weight-regular);
font-size: inherit;
text-transform: none;
color: var(--color-dark-moon);
opacity: var(--opacity);
}
.c-white .label {
color: inherit;
}
.label:not(.anim):not(:last-child) {
margin-bottom: var(--spacing-12);
}
.label a {
box-shadow: var(--cta-shadow);
}
.label.anim {
height: auto;
width: 100%;
max-width: 100%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
position: absolute;
z-index: 1;
left: 0;
top: calc(var(--input-height) / 2);
transform: translateY(-50%);
padding: 0 var(--input-spacing-x);
pointer-events: none;
}
.label.anim:not(.fixed) {
transition-property: opacity, visibility;
}
.input.filled .label.anim:not(.fixed) {
opacity: 0;
visibility: hidden;
}
.input.filled .label.anim.fixed {
top: 0;
padding: 0;
transform: translateY(30%);
font-size: var(--font-size-overline);
line-height: var(--line-height-overline);
opacity: var(--opacity);
}
.c-white .input.filled .label.anim.fixed {
color: inherit;
opacity: var(--opacity);
}
.input:has(*:-internal-autofill-selected) .label.anim.fixed {
top: 0;
padding: 0;
transform: translateY(-50%);
font-size: var(--font-size-body-sub);
opacity: var(--opacity);
}
.c-white .input:has(*:-internal-autofill-selected) .label.anim.fixed {
color: inherit;
opacity: var(--opacity);
}
.input {
position: relative;
text-align: left;
}
.input .entry-title {
font-weight: var(--font-weight-body);
font-size: var(--font-size-h3);
line-height: var(--line-height-24);
}
.input .entry-title:not(:last-child) {
margin-bottom: var(--spacing-24);
}
.input.with-cta .cta {
margin: 0;
position: absolute;
z-index: 3;
right: 0;
top: calc(var(--input-height) / 2);
transform: translateY(-50%);
}
.input input:-internal-autofill-selected,
.input textarea:-internal-autofill-selected,
.input select:-internal-autofill-selected {
color: inherit;
}
.input input:disabled,
.input textarea:disabled,
.input select:disabled,
.select2-container--default.select2-container--disabled
.select2-selection--single {
cursor: default;
opacity: 0.1;
}
.input input[type="checkbox"]:disabled,
.input input[type="radio"]:disabled {
background-color: transparent;
}
.input :-ms-input-placeholder {
font-size: var(--font-size-20) !important;
font-weight: var(--font-weight-regular) !important;
font-style: normal !important;
text-transform: none !important;
color: var(--color-gray) !important;
opacity: 1 !important;
}
.input ::-webkit-input-placeholder {
font-size: var(--font-size-20) !important;
font-weight: var(--font-weight-regular) !important;
font-style: normal !important;
text-transform: none !important;
color: var(--color-gray) !important;
opacity: 1 !important;
}
.input ::-moz-placeholder {
font-size: var(--font-size-20) !important;
font-weight: var(--font-weight-regular) !important;
font-style: normal !important;
text-transform: none !important;
color: var(--color-gray) !important;
opacity: 1 !important;
}
.input ::-ms-clear {
display: none;
width: 0;
height: 0;
}
.input ::-ms-reveal {
display: none;
width: 0;
height: 0;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 0;
}
input::-webkit-contacts-auto-fill-button {
display: none !important;
visibility: hidden;
pointer-events: none;
}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
box-shadow: 0 0 0px 1000px #fff inset;
-webkit-transition: 5000s ease 0s;
transition: 5000s ease 0s;
}
input[type="number"] {
-moz-appearance: textfield;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.entry-form.w-fix {
width: 100%;
max-width: 655px;
margin-left: auto;
margin-right: auto;
}
/* DEFAULT ==================== */
.sc {
width: 100vw;
}
.sc-inner {
padding-top: 80px;
padding-bottom: 80px;
}
@media (max-width: 991px) {
.sc-inner {
padding: 60px 0;
}
}
.image-banner {
width: 100%;
aspect-ratio: 3.2432432432;
}
.image-banner .banner {
width: 100%;
height: 100%;
}
.image-banner .banner *:is(img, video) {
object-fit: cover;
object-position: center;
width: 100%;
height: 100%;
}
@media (max-width: 991px) {
.image-banner {
aspect-ratio: 0.8;
}
}
.wrapper {
position: relative;
width: 100%;
height: 100%;
}
.marquee-wrapper {
height: 100%;
display: flex;
align-items: center;
}
.marquee {
display: inline-flex !important;
height: 100%;
}
.cloneContent {
padding: 0;
}
.button {
font-size: 16px;
line-height: normal;
font-family: "minerva-modern", sans-serif;
color: var(--color-blue);
transition: 0.3s ease-in-out;
display: block;
}
.button.primary {
border: 1px solid #fff;
border-radius: 100px;
padding: 14px 24px;
}
.button.primary.active {
background-color: white;
border: 1px solid var(--color-blue-light);
}
html.no-touch .button.primary:hover {
background-color: white;
}
html.no-touch .button.primary.active:hover {
background-color: rgba(231, 231, 235, 0.6);
}
.button.secondary {
text-decoration: underline;
text-underline-offset: 8px;
}
html.no-touch .button.secondary:hover {
opacity: 0.5;
}
:root {
--header-height: 118px;
--color-blue: #37487c;
--color-blue-rgb: 55, 72, 124;
--color-blue-dark: #0f1537;
--color-blue-dark-rgb: 15, 21, 55;
--color-blue-light: #e7e7eb;
--color-blue-light-rgb: 231, 231, 235;
--duration: 0.3s;
--timing-function: ease-in-out;
}
@media (max-width: 991px) {
:root {
--header-height: 70px;
}
.sc-inner {
padding-top: 60px;
padding-bottom: 60px;
}
}
/* CAREER ==================== */
/* CAREER HERO ==================== */
#career-hero {
width: 100vw;
height: calc(100svh - var(--header-height));
}
#career-hero .bg-image {
width: 100%;
height: 100%;
}
#career-hero .bg-image *:is(img, video) {
object-fit: cover;
object-position: center;
width: 100%;
height: 100%;
}
#career-hero .hero-content {
position: absolute;
top: 50%;
left: 9.7222222222%;
transform: translateY(-50%);
color: white;
display: flex;
flex-direction: column;
grid-gap: 20px;
width: min(31.9444444444vw, 460px);
}
#career-hero .hero-content .title {
font-size: 48px;
line-height: normal;
color: white;
}
#career-hero .hero-content .input {
display: flex;
justify-content: space-between;
align-items: center;
background-color: white;
padding-left: 24px;
color: var(--color-blue);
border-radius: 100px;
height: 50px;
}
#career-hero .hero-content .input > input {
padding: 16px 0;
}
#career-hero .hero-content .input > button {
cursor: pointer;
padding-left: 16px;
padding-right: 16px;
height: 100%;
}
@media (max-width: 991px) {
#career-hero {
height: 100svh;
}
#career-hero .hero-content .title {
font-size: 43px;
text-wrap: nowrap;
}
#career-hero .hero-content {
width: 90%;
top: unset;
bottom: 60px;
left: 20px;
transform: unset;
grid-gap: 12px;
}
}
/* CAREER DESCRIPTION ==================== */
#career-description {
min-height: 100vh;
}
#career-description .sc-inner {
display: flex;
flex-direction: column;
justify-content: space-around;
grid-gap: max(4.1666666667vw, 60px);
height: 100%;
width: 100%;
}
#career-description .marquee {
padding-left: 40px;
display: inline-flex;
grid-gap: 40px;
vertical-align: top;
}
#career-description .marquee-items {
display: inline-flex;
align-items: flex-end;
vertical-align: top;
grid-gap: 40px;
}
#career-description .marquee-item {
opacity: 0;
animation-fill-mode: forwards;
}
#career-description .marquee-item .image {
width: auto;
line-height: 1;
}
#career-description .marquee-item .image img {
display: block;
width: auto;
height: auto;
max-height: 24.8611111111vw !important;
max-width: 24.8611111111vw !important;
}
#career-description .marquee-item .image img.square {
max-height: 19.5833333333vw !important;
}
@media (max-width: 991px) {
#career-description {
min-height: 100vh;
}
#career-description .sc-inner {
grid-gap: 40px;
}
#career-description .heading-group h3 {
margin-top: 40px;
}
#career-description .heading {
margin-bottom: 40px;
}
#career-description .marquee {
padding-left: 40px;
}
#career-description .marquee-item .image img {
max-height: 81.02564102564vw !important;
max-width: 81.02564102564vw !important;
}
#career-description .marquee-item .image img.square {
max-height: 54.1025641026vw !important;
}
}
/* CAREER OPENING POSITION ==================== */
#career-two-column {
min-height: 100vh;
}
#career-two-column .wrapper {
display: flex;
}
#career-two-column .wrapper > * {
width: 50%;
}
#career-two-column .block-image {
background-color: var(--color-blue-dark);
display: flex;
justify-content: center;
align-items: center;
}
#career-two-column .block-image .main-image {
width: 50%;
position: relative;
}
#career-two-column .block-image .main-image figure {
margin: 0;
}
#career-two-column .block-image .main-image *:is(img, video) {
display: block;
width: 100%;
height: auto;
}
#career-two-column .block-image .main-image .play-pause-button {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
justify-content: center;
align-items: center;
padding: 12px;
background-color: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(10px);
opacity: 0;
pointer-events: none;
transition: opacity 0.3s ease-in-out;
cursor: pointer;
}
#career-two-column .block-image .main-image:hover .play-pause-button {
opacity: 1;
pointer-events: auto;
}
#career-two-column .block-image .main-image .play-pause-button:after {
content: "";
width: 20px;
height: 20px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
#career-two-column .block-image .main-image .play-pause-button.play:after {
background-image: url('data:image/svg+xml,');
}
#career-two-column .block-image .main-image .play-pause-button.pause:after {
background-image: url('data:image/svg+xml,');
}
#career-two-column .block-content {
background-color: var(--color-blue-light);
}
#career-two-column .block-content .wrapper {
padding: min(6.9444444444vw, 100px);
display: flex;
flex-direction: column;
justify-content: space-between;
grid-gap: 60px;
}
#career-two-column .block-content .opening-position {
width: 100%;
}
#career-two-column .block-content .opening-position > .title {
margin-bottom: 16px;
text-wrap: nowrap;
text-align: center;
}
.opening-position .position-list {
display: flex;
flex-direction: column;
margin-bottom: 24px;
}
.position-list .list-item {
padding: 20px 0;
display: flex;
grid-gap: 20px;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.position-list .list-item .text {
flex-grow: 1;
display: flex;
justify-content: space-between;
align-items: center;
color: var(--color-blue);
}
.position-list .list-item .text h3 {
margin: 0;
}
#career-two-column .block-content .other-position {
width: 100%;
}
#career-two-column .block-content .other-position .content-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
}
#career-two-column .block-content .other-position .text {
display: flex;
flex-direction: column;
grid-gap: 16px;
}
@media (max-width: 991px) {
#career-two-column {
min-height: 100vh;
height: auto;
}
#career-two-column .wrapper {
flex-direction: column;
}
#career-two-column .wrapper > * {
width: 100%;
}
#career-two-column .block-image {
background-color: var(--color-blue-dark);
display: flex;
justify-content: center;
align-items: center;
padding: 85px 0;
}
#career-two-column .block-image .main-image {
width: 67.4358974359%;
}
#career-two-column .block-image .main-image .play-pause-button {
top: auto;
bottom: 10px;
left: 10px;
transform: unset;
opacity: 1;
pointer-events: auto;
}
#career-two-column .block-content .wrapper {
padding: 60px 20px;
grid-gap: 40px;
}
.opening-position .position-list {
margin-bottom: 50px;
}
.position-list .list-item .text {
flex-direction: column;
align-items: flex-start;
}
#career-two-column .block-content .opening-position .title {
font-size: 43px;
}
#career-two-column .block-content .opening-position .cta-button {
display: flex;
justify-content: center;
align-items: center;
}
#career-two-column .block-content .other-position .content-wrapper {
flex-direction: column;
grid-gap: 16px;
}
#career-two-column .block-content .other-position .text {
text-align: center;
}
#career-two-column .block-content .other-position .text > h3 {
font-size: 28px;
}
}
/* CAREER BUILD FUTURE ==================== */
#career-build-future .sc-inner {
padding: 80px 0;
}
#career-build-future .sc-inner .container {
display: flex;
justify-content: center;
align-items: center;
grid-gap: min(5.9722222222vw, 86px);
}
#career-build-future .container .text {
display: flex;
flex-direction: column;
grid-gap: 20px;
max-width: 435px;
}
#career-build-future .container .image {
width: min(44.375vw, 639px);
}
#career-build-future .container .image img {
display: block;
width: 100%;
height: auto;
}
@media (max-width: 991px) {
#career-build-future .sc-inner {
padding: 60px 0;
}
#career-build-future .sc-inner .container {
flex-direction: column-reverse;
grid-gap: min(7.6923076923vw, 30px);
}
#career-build-future .container .text {
text-align: center;
max-width: unset;
}
#career-build-future .container .image {
width: 100%;
}
}
/* POSITIONS ==================== */
#all-positions .position-list .list-item:last-child {
border: none;
}
#all-positions .heading {
margin-bottom: 60px;
}
@media (max-width: 991px) {
#all-positions .heading {
margin-bottom: 30px;
}
}
/* POSITIONS SINGLE ==================== */
#position-detail .heading .description {
text-wrap: nowrap;
}
#position-detail .position-detail {
display: grid;
grid-template-columns: 1fr 1fr;
grid-auto-rows: min-content;
row-gap: 44px;
margin-top: 100px;
margin-bottom: 64px;
}
#position-detail .position-detail.area-content h3 {
margin-bottom: 16px;
}
#position-detail .position-detail .detail-item {
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
color: var(--color-blue);
padding-bottom: 40px;
}
#position-detail .position-detail .detail-item:last-child {
border: none;
}
#position-detail .position-detail .detail-item.full-width {
grid-column: span 2;
}
#position-detail .position-detail .detail-item .description-list {
list-style: inside;
display: flex;
flex-direction: column;
row-gap: 4px;
padding-left: 1.5em;
}
#position-detail .position-detail .detail-item .description-list li {
list-style-type: disc !important;
padding-left: 0.5em;
}
#position-detail .apply-btn {
width: fit-content;
margin: 0 auto;
}
@media (max-width: 991px) {
#position-detail .position-detail {
row-gap: 36px;
margin-top: 60px;
margin-bottom: 40px;
}
#position-detail .position-detail.area-content h3 {
margin-bottom: 12px;
}
#position-detail .position-detail .detail-item {
padding-bottom: 32px;
grid-column: span 2;
}
}
/* PROGRESS TRACKER ==================== */
.swiper {
width: 100%;
overflow: hidden;
}
.swiper-wrapper {
will-change: transform;
}
.progress-tracker {
--gap: 15px;
}
.progress-tracker .swiper-slide {
width: auto;
padding-right: var(--gap);
}
.progress-tracker .tracker {
display: flex;
align-items: center;
grid-gap: var(--gap);
color: var(--color-blue);
opacity: 0.3;
}
.progress-tracker .tracker.active {
opacity: 1;
}
.progress-tracker .swiper-slide:not(:first-child) .tracker:before {
content: "\e902";
font-family: "icon-meo-jewelry" !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
}
.progress-tracker .tracker .ic::before {
font-size: 26px;
}
.progress-tracker .tracker .ic.ic-upload::before {
font-size: 22px;
}
.progress-tracker .tracker .check {
display: none;
}
.progress-tracker .tracker.show-check .check {
display: block;
}
.progress-tracker .tracker.show-check .ic:first-child {
display: none;
}
@media (min-width: 992px) {
.progress-tracker .swiper {
overflow: visible !important;
}
.progress-tracker .swiper-wrapper {
display: flex !important;
transform: none !important;
justify-content: center;
}
}
@media (max-width: 991px) {
.progress-tracker {
width: 100vw;
margin-left: -20px;
}
.progress-tracker .swiper {
overflow: hidden !important;
padding: 0 20px;
}
.progress-tracker .swiper-slide:last-child {
padding-right: 80px;
}
.progress-tracker .tracker p {
display: none;
}
.progress-tracker .tracker.show-text p {
display: block;
}
}
/* FORM ==================== */
.apply-form {
--input-border: 1px solid rgba(var(--color-blue-rgb), 0.3);
--input-border-active: 1px solid var(--color-blue);
}
.apply-form .Al1:focus-within:not(.menu-open):not(.disabled),
.apply-form .An1:hover:not(.menu-open):not(.disabled),
.apply-form .Dm1:focus,
.apply-form .Do1:hover,
.apply-form .Hc1.active ._frm-b1-stp-icn-cntn,
.apply-form .He1.completed ._frm-b1-stp-icn-cntn {
border-color: var(--color-blue) !important;
}
.apply-form .Am1:focus-within:not(.menu-open):not(.disabled),
.apply-form .Dn1:focus,
.apply-form .Hc1.active ._frm-b1-stp-icn-cntn,
.apply-form .BR1:focus {
box-shadow: none !important;
}
.apply-form ._frm-b1-stp-progress-wrpr {
height: 0;
opacity: 0;
pointer-events: none;
}
.apply-form ._frm-b1-stp-wrpr {
padding: 0;
}
.apply-form ._frm-b1-stp-cntnt-wrpr {
justify-content: center;
padding-top: 50px;
}
.apply-form ._frm-b1-stp-cntnt {
max-width: 750px;
}
.apply-form .bf-lbl-wrp {
margin: 0;
}
.apply-form .bf-lbl-wrp .bf-lbl {
font-size: 18px;
line-height: 1.2;
font-weight: 400;
}
.apply-form .bf-lbl-wrp .bf-sub-titl {
font-size: 15px;
line-height: 1.5;
font-weight: 300;
}
.apply-form .bf-fld-wrp {
padding: 10px 25px 10px 0;
}
.apply-form .btcd-fld-itm:has(.bf-fld-wrp .bf-fld-wrp) > .bf-fld-wrp {
padding-right: 0;
}
.apply-form *:is(input, textarea, select) {
background: none !important;
border-radius: 0 !important;
border: none !important;
border-bottom: var(--input-border) !important;
font-family: "minerva-modern", "Anuphan", sans-serif;
font-weight: 400 !important;
font-size: 17px !important;
line-height: 1.43;
display: block;
width: 100%;
padding-left: 0 !important;
padding-right: 0 !important;
position: relative;
color: var(--color-blue) !important;
}
.apply-form .Dn1:focus {
box-shadow: none !important;
}
input[type="date"]::-webkit-calendar-picker-indicator {
display: none;
}
input[type="date"]::-moz-calendar-picker-indicator {
display: none;
}
input[type="date"]::-ms-clear {
display: none;
}
input[type="date"]:after {
content: "\e90f";
font-family: "icon-meo-jewelry" !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
}
.apply-form ._frm-b1-stp-btn-wrpr {
padding: 0;
}
.apply-form ._frm-b1-stp-btn-cntnt {
flex-direction: column-reverse;
grid-gap: 20px;
padding-top: 40px;
}
.apply-form ._frm-b1-next-step-btn {
background-color: #fff !important;
border: 1px solid #e7e7eb !important;
border-radius: 100px !important;
font-size: 16px !important;
line-height: normal !important;
font-weight: 400 !important;
color: var(--color-blue) !important;
padding: 20px 30px !important;
min-width: 160px;
box-shadow: none !important;
}
.apply-form ._frm-b1-next-step-btn:hover {
background-color: #e7e7eb !important;
}
.apply-form ._frm-b1-prev-step-btn {
background: none !important;
padding: 0 !important;
border: none !important;
color: var(--color-blue) !important;
font-size: 16px !important;
line-height: normal !important;
font-weight: 400 !important;
box-shadow: none !important;
text-decoration: underline;
text-underline-offset: 8px;
}
.apply-form ._frm-b1-prev-step-btn:hover {
opacity: 0.5;
background: none !important;
}
.apply-form .bf-sub-titl,
.apply-form .bf-title {
margin: 0;
}
.apply-form .bf-title {
margin-bottom: 6px;
text-transform: uppercase;
line-height: 1.2;
text-align: start;
font-size: 24px;
}
.apply-form .bf-sub-titl {
font-size: 24px;
line-height: normal;
font-weight: 300;
}
.apply-form .bf-titl-wrp {
padding: 0;
}
.apply-form .btcd-fld-itm:has(> .bf-fld-wrp > .bf-divider) {
display: none;
}
.apply-form .bf-dpd-fld-wrp,
.apply-form .bf-phone-fld-wrp,
.apply-form .bf-country-fld-wrp {
border: none !important;
border-bottom: var(--input-border) !important;
border-radius: 0 !important;
transition: var(--duration) var(--timing-function);
}
.apply-form .bf-dpd-wrp {
padding-left: 0;
padding-right: 0;
transition: var(--duration) var(--timing-function);
}
.apply-form .bf-dpd-fld-wrp .bf-dpd-down-btn,
.apply-form .bf-phone-fld-wrp .bf-dpd-down-btn,
.apply-form .bf-country-fld-wrp .bf-dpd-down-btn {
position: relative;
}
.apply-form .bf-dpd-fld-wrp .bf-dpd-down-btn:before,
.apply-form .bf-phone-fld-wrp .bf-dpd-down-btn::before,
.apply-form .bf-country-fld-wrp .bf-dpd-down-btn::before {
content: "\e914";
font-family: "icon-meo-jewelry" !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
font-size: 8px;
}
.apply-form .bf-phone-fld-wrp .bf-dpd-down-btn::before {
right: 50%;
transform: translateY(-50%) translateX(50%);
}
.apply-form .bf-dpd-fld-wrp .bf-dpd-down-btn svg,
.apply-form .bf-phone-fld-wrp .bf-dpd-down-btn svg,
.apply-form .bf-country-fld-wrp .bf-dpd-down-btn svg {
display: none;
}
.apply-form .bf-phone-fld-wrp *:is(input, textarea, select) {
border: none !important;
}
.apply-form .bf-option-search-wrp input {
padding-right: 0 !important;
padding-left: 25px !important;
border-bottom: var(--input-border-active) !important;
}
.apply-form .bf-option-search-wrp svg,
.apply-form input:focus ~ svg {
left: 0;
width: 16px;
color: #000 !important;
}
.apply-form .bf-dpd-fld-wrp.menu-open .bf-dpd-wrp {
padding-left: 12px !important;
}
.apply-form .option {
border-radius: 0 !important;
}
.apply-form .option.selected-opt {
background-color: var(--color-blue) !important;
color: #fff !important;
}
.apply-form .bf-search-clear-btn {
background-color: var(--color-blue) !important;
}
.apply-form .bf-inp-clr-btn {
width: 18px;
height: 18px;
background-color: var(--color-blue) !important;
color: #fff !important;
transition: var(--duration) var(--timing-function);
}
.apply-form .bf-search-clear-btn svg {
color: #fff !important;
}
.apply-form .btcd-fld-itm:not(:has(input)):not(:first-child) {
margin-top: 80px;
}
.apply-form .bf-ct {
font-size: 18px;
font-weight: 400;
}
.apply-form .FA1:checked ~ [data-cl] [data-bx],
.apply-form .FL1:hover ~ [data-cl] [data-bx] {
border-color: var(--color-blue);
}
.apply-form .FK1:focus ~ [data-cl] [data-bx] {
box-shadow: none !important;
}
.apply-form .Ez1:checked ~ [data-cl] [data-bx] {
background-color: #fff !important;
}
.apply-form .FC1:checked ~ [data-cl] [data-bx]:before {
background-color: #000 !important;
box-shadow: none !important;
}
.apply-form .bf-bx {
margin-right: 15px;
width: 20px;
height: 20px;
border-width: 1px;
}
.apply-form .chip-wrp {
background-color: var(--color-blue-light) !important;
border-radius: 8px;
}
.apply-form .bf-ct p {
line-height: 1.7;
}
.apply-form .btcd-fld-itm.b1-56 {
margin-top: 15px;
}
.apply-form .bf-rpt-fld-wrp {
display: flex;
flex-direction: column;
grid-gap: 35px;
}
.apply-form .bf-inp-fld-wrp {
border: none;
}
.apply-form .bf-rpt-wrp .bf-pair-btn-wrp {
display: flex;
flex-direction: column-reverse;
width: 100%;
align-items: flex-start;
grid-gap: 50px;
padding: 0;
padding-top: 20px;
}
.apply-form .bf-rpt-wrp {
border: none !important;
flex-direction: column;
}
.apply-form .bf-rpt-wrp .item-title {
border: none;
font-size: 20px;
font-weight: 400;
line-height: 1.15;
margin-bottom: 6px;
}
.apply-form .bf-rpt-wrp:nth-last-child(2) .bf-rpt-add-btn {
display: block;
}
.apply-form .bf-rpt-wrp:nth-child(1) .bf-rpt-rmv-btn {
display: none;
}
.apply-form .bf-rpt-add-btn {
display: none;
}
.apply-form .bf-rpt-add-btn,
.apply-form .bf-rpt-rmv-btn {
border-radius: 0;
border: none !important;
box-shadow: none !important;
padding: 0;
transition: var(--duration) var(--timing-function);
}
.apply-form .bf-rpt-add-btn:disabled,
.apply-form .bf-rpt-rmv-btn:disabled {
display: none;
}
.apply-form .bf-rpt-add-btn:hover,
.apply-form .bf-rpt-rmv-btn:hover {
opacity: 0.5;
background-color: transparent !important;
}
.apply-form .bf-rpt-add-btn:before,
.apply-form .bf-rpt-rmv-btn:before {
color: var(--color-blue);
font-weight: 300;
text-decoration: underline;
text-underline-offset: 2.5px;
}
/* Education Button */
.apply-form .bf-rpt-rmv-btn[data-parent-field-name="education"]:before {
content: "- Remove Education " attr(data-count) " / ลบประวัติการศึกษา";
}
.apply-form .bf-rpt-add-btn[data-parent-field-name="education"]:before {
content: "+ Add Education / เพิ่มประวัติการศึกษา";
}
/* Work Button */
.apply-form .bf-rpt-rmv-btn[data-parent-field-name="work"]:before {
content: "- Remove Work Experiences " attr(data-count)
" / ลบประสบการณ์ทำงาน";
}
.apply-form .bf-rpt-add-btn[data-parent-field-name="work"]:before {
content: "+ Add Work Experiences / เพิ่มประสบการณ์ทำงาน";
}
/* Language Button */
.apply-form .bf-rpt-rmv-btn[data-parent-field-name="language"]:before {
content: "- Remove Document File " attr(data-count) " / ลบเอกสารอื่นๆ";
}
.apply-form .bf-rpt-add-btn[data-parent-field-name="language"]:before {
content: "+ Add Document File / เพิ่มเอกสารอื่นๆ";
}
/* Resume Button */
.apply-form .bf-rpt-add-btn[data-parent-field-name="resume"]:before {
content: "+ Add File / เพิ่มไฟล์";
}
.apply-form .bf-rpt-rmv-btn[data-parent-field-name="resume"]:before {
content: "- Remove File " attr(data-count) " / ลบไฟล์";
}
/* Seminar Button */
.apply-form .bf-rpt-add-btn[data-parent-field-name="seminar"]:before {
content: "+ Add File / เพิ่มไฟล์";
}
.apply-form .bf-rpt-rmv-btn[data-parent-field-name="seminar"]:before {
content: "- Remove File " attr(data-count) " / ลบไฟล์";
}
.apply-form .bf-rpt-add-btn > img,
.apply-form .bf-rpt-rmv-btn > img {
display: none;
}
.apply-form
.bf-rpt-wrp:has(
.bf-pair-btn-wrp .bf-rpt-add-btn[data-parent-field-name="language"]
)
.btcd-fld-itm:not(:last-child) {
margin-bottom: 10px;
}
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .bf-lbl[for="b1-18-1"],
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .bf-lbl[for="b1-128-1"],
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .b1-131-titl-wrp .bf-title {
font-size: 20px;
font-weight: 400;
line-height: 1.15;
letter-spacing: 0.4px;
margin-bottom: 20px;
}
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .b1-131-fld-wrp {
padding: 0 !important;
margin: 0 !important;
}
.apply-form .btcd-fld-itm.b1-18,
.apply-form .btcd-fld-itm.b1-128,
.apply-form .btcd-fld-itm.b1-131 {
margin-top: 20px !important;
}
.apply-form .bf-file-input-wrpr *:is(input, textarea, select) {
width: 0;
height: 0;
opacity: 0;
pointer-events: none;
}
.apply-form .bf-file-input-wrpr .bf-btn-wrpr {
flex-direction: column;
align-items: flex-start;
}
.apply-form .bf-file-input-wrpr .bf-btn-wrpr .bf-inp-btn {
background: none !important;
border-radius: 0 !important;
border: none !important;
border-bottom: var(--input-border) !important;
font-family: "minerva-modern", "Anuphan", sans-serif;
font-weight: 400 !important;
font-size: 16px;
line-height: 1.43;
display: block;
width: 100%;
padding-left: 0 !important;
padding-right: 0 !important;
padding-top: 5px !important;
padding-bottom: 5px !important;
position: relative;
color: #b3b3b3 !important;
}
.apply-form .bf-file-input-wrpr .bf-btn-wrpr:has(~ .files-list) {
display: none;
}
.apply-form .bf-file-input-wrpr .bf-file-select-status,
.apply-form .bf-file-input-wrpr .bf-max-size-lbl {
display: none;
}
.apply-form .bf-file-input-wrpr .bf-btn-wrpr .bf-inp-btn:after {
content: "\e915";
font-family: "icon-meo-jewelry" !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
font-size: 16px;
color: var(--color-blue);
}
.apply-form .bf-file-input-wrpr .bf-btn-wrpr .bf-inp-btn > img {
display: none;
}
.apply-form .files-list .cross-btn {
position: relative;
}
.apply-form .files-list .cross-btn:before {
content: "\e908";
font-family: "icon-meo-jewelry" !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
position: absolute;
top: 50%;
right: 50%;
transform: translate(50%, -50%);
font-size: 12px;
color: #000;
}
.apply-form .files-list .file-wrpr {
border-radius: 8px;
}
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .bf-titl-wrp .bf-sub-titl {
font-size: 16px;
font-weight: 400;
}
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .bf-rpt-wrp .bf-pair-btn-wrp {
padding-top: 0;
}
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .bf-rpt-wrp .bf-pair-btn-wrp {
grid-gap: 30px;
}
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .bf-rpt-fld-wrp {
grid-gap: 10px !important;
}
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .bf-rpt-wrp .item-title {
display: none;
}
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .btcd-fld-itm.b1-13,
.apply-form ._frm-b1-stp-cntnt[data-step="5"] .btcd-fld-itm.b1-135 {
margin-bottom: 60px;
}
.apply-form .bf-cw .bf-ct {
font-size: 18px;
font-weight: 400;
line-height: 1.2;
}
.apply-form .bf-cw input[type="checkbox"] ~ .bf-cl .bf-bx {
position: relative;
border-radius: 50%;
}
.apply-form .bf-cw input[type="checkbox"] ~ .bf-cl .bf-bx:before {
content: "";
background-color: #000;
position: absolute;
width: 10px;
height: 10px;
border-radius: 50%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0);
transform-origin: center center;
transition: 0.15s var(--timing-function);
}
.apply-form .bf-cw input[type="checkbox"]:checked ~ .bf-cl .bf-bx:before {
transform: translate(-50%, -50%) scale(1);
}
.apply-form .bf-cw input[type="checkbox"] ~ .bf-cl .bf-bx > svg {
display: none;
}
.apply-form .btcd-fld-itm:has(> .bf-fld-wrp > ol) {
margin-top: 0;
}
.apply-form .bf-fld-wrp:has(> ol) {
overflow-y: scroll;
max-height: 384px;
padding: 30px;
border: var(--input-border-active);
}
.apply-form .bf-fld-wrp:has(> ol)::-webkit-scrollbar {
width: 10px;
}
.apply-form .bf-fld-wrp:has(> ol)::-webkit-scrollbar-thumb {
background-color: var(--color-blue);
border: 1px solid #fff;
}
.apply-form .bf-fld-wrp ol {
padding-left: 1em;
}
.apply-form .bf-fld-wrp ol li {
list-style: decimal;
list-style-position: outside;
}
.apply-form button.bf-btn[type="submit"] {
border-radius: 100px !important;
border: 1px solid #e7e7eb !important;
background: #fff !important;
padding: 20px 30px !important;
min-width: 160px !important;
box-shadow: none !important;
font-size: 16px !important;
font-weight: 400;
line-height: normal;
color: var(--color-blue) !important;
}
.apply-form .btcd-fld-itm:has(button[type="submit"]) {
margin-top: 0;
}
.apply-form .bf-fld-wrp:has(button[type="submit"]) {
padding-right: 0;
}
.apply-form .v-hide:disabled {
display: none;
}
.apply-form ._frm-b1-stp-btn-cntnt:has(.next-step-btn.v-hide:disabled) {
padding-top: 20px;
}
.apply-complete {
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
}
.apply-complete .description {
font-weight: 400;
color: var(--color-blue);
padding: 0 30px;
text-wrap: balance;
}
/* FORM RWD ==================== */
@media (min-width: 992px) {
.apply-form .bf-fld-wrp:has(> .bf-titl-wrp) {
margin-bottom: 15px;
}
.apply-form .bf-lbl-wrp:has(+ .bf-inp-wrp > .bf-cc) {
margin-bottom: 15px;
}
.apply-form .bf-cc {
margin-bottom: 15px;
}
.apply-form .bf-cc.b1-78-cc,
.apply-form .bf-cc.b1-86-cc {
display: flex;
grid-gap: 50px;
}
.apply-form
.bf-rpt-wrp:has(
.bf-pair-btn-wrp .bf-rpt-add-btn[data-parent-field-name="language"]
)
.bf-cc {
display: flex;
grid-gap: 80px;
}
}
@media (max-width: 575px) {
.apply-form .btcd-fld-itm:not(:has(input)):not(:first-child) {
margin-top: 60px;
}
.apply-form .btcd-fld-itm:has(> .bf-fld-wrp > ol) {
margin-top: 20px;
margin-bottom: 20px;
}
.apply-form .heading-h1 {
font-size: 28px;
}
.apply-form ._frm-b1-stp-cntnt-wrpr {
padding-top: 20px;
}
.apply-form .bf-fld-wrp {
padding: 15px 0;
}
.apply-form .bf-rpt-wrp .item-title {
font-weight: 300;
}
.apply-form .bf-rpt-wrp .bf-pair-btn-wrp {
padding-top: 0px;
grid-gap: 30px;
}
.apply-form .bf-fld-wrp:has(> ol) {
max-height: 450px;
padding: 24px;
}
.apply-complete .description br {
display: none;
}
}