2915 lines
58 KiB
CSS
2915 lines
58 KiB
CSS
@charset "UTF-8";
|
|
*,
|
|
*::before,
|
|
*::after {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
border: none;
|
|
outline: none;
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
button {
|
|
outline: none;
|
|
}
|
|
|
|
button:focus {
|
|
outline: none;
|
|
}
|
|
|
|
input::-webkit-outer-spin-button,
|
|
input::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
/***
|
|
====================================================================
|
|
Global Settings
|
|
====================================================================
|
|
***/
|
|
body {
|
|
font-family: "Montserrat", sans-serif;
|
|
font-size: 14px;
|
|
color: #000;
|
|
line-height: 1.7em;
|
|
font-weight: 400;
|
|
background: #fff;
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-font-smoothing: antialiased;
|
|
}
|
|
|
|
body.active {
|
|
overflow: hidden;
|
|
}
|
|
|
|
a {
|
|
text-decoration: none;
|
|
color: #000;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
position: relative;
|
|
font-weight: normal;
|
|
margin: 0px;
|
|
background: none;
|
|
line-height: 1.6em;
|
|
}
|
|
|
|
/* Typography */
|
|
h1 {
|
|
font-size: 4em;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 40px;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 34px;
|
|
}
|
|
|
|
h4 {
|
|
font-size: 22px;
|
|
}
|
|
|
|
h5 {
|
|
font-size: 20px;
|
|
}
|
|
|
|
h6 {
|
|
font-size: 18px;
|
|
}
|
|
|
|
p {
|
|
position: relative;
|
|
line-height: 1.8em;
|
|
}
|
|
|
|
.auto_container {
|
|
position: relative;
|
|
max-width: 1500px;
|
|
padding: 0px 60px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
ul,
|
|
li {
|
|
list-style: none;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
/* width */
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
}
|
|
|
|
/* Track */
|
|
::-webkit-scrollbar-track {
|
|
background: #fff;
|
|
border: 1px solid #DFDFDF;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
/* Handle */
|
|
::-webkit-scrollbar-thumb {
|
|
background: #DFDFDF;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
/* Handle on hover */
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #DFDFDF;
|
|
}
|
|
|
|
.header {
|
|
padding: 20px 0;
|
|
z-index: 50;
|
|
background: #000;
|
|
position: relative;
|
|
}
|
|
.header_row {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: justify;
|
|
-ms-flex-pack: justify;
|
|
justify-content: space-between;
|
|
}
|
|
.header .logo {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
position: relative;
|
|
}
|
|
.header .logo svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
position: relative;
|
|
}
|
|
.header .logo_bg {
|
|
width: 70px;
|
|
height: 70px;
|
|
display: block;
|
|
}
|
|
.header .logo_bg svg,
|
|
.header .logo_bg img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.header .logo_group {
|
|
position: relative;
|
|
margin-right: 10px;
|
|
}
|
|
.header .logo_group-txt {
|
|
width: 120px;
|
|
height: 30px;
|
|
overflow: hidden;
|
|
}
|
|
.header .logo_group-txt svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
position: relative;
|
|
}
|
|
.header .logo_group:last-child {
|
|
margin-right: 0;
|
|
}
|
|
.header .logo_inner-text {
|
|
font-size: 18px;
|
|
font-weight: 900;
|
|
line-height: 1;
|
|
color: #6A6A6A;
|
|
position: absolute;
|
|
top: 53%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
-moz-ransform: translate(-50%, -50%);
|
|
-o-transform: translate(-50%, -50%);
|
|
-ms-transform: translate(-50%, -50%);
|
|
-webkit-transform: translate(-50%, -50%);
|
|
}
|
|
.header .nav {
|
|
position: relative;
|
|
}
|
|
.header .nav ul {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.header .nav ul li {
|
|
margin-right: 60px;
|
|
position: relative;
|
|
}
|
|
.header .nav ul li:last-child {
|
|
margin-right: 0;
|
|
}
|
|
.header .nav ul li a,
|
|
.header .nav ul li span {
|
|
display: block;
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
line-height: 20px;
|
|
color: #FFFFFF;
|
|
cursor: pointer;
|
|
}
|
|
.header .nav ul li a.service_nav-link,
|
|
.header .nav ul li span.service_nav-link {
|
|
position: relative;
|
|
}
|
|
.header .nav ul li a.service_nav-link::after,
|
|
.header .nav ul li span.service_nav-link::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 50%;
|
|
right: -20px;
|
|
transform: translateY(-50%);
|
|
-moz-ransform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
width: 8px;
|
|
height: 4px;
|
|
-webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
|
|
clip-path: polygon(0 0, 50% 100%, 100% 0);
|
|
background: #fff;
|
|
}
|
|
.header .nav_contact {
|
|
padding: 20px;
|
|
-webkit-box-shadow: inset 0 0 0 2px #fff;
|
|
box-shadow: inset 0 0 0 2px #fff;
|
|
-webkit-transition: color 0.25s 0.0833333333s;
|
|
transition: color 0.25s 0.0833333333s;
|
|
position: relative;
|
|
}
|
|
.header .nav_contact:focus {
|
|
outline: 2px dotted #ccc;
|
|
}
|
|
.header .nav_contact:hover {
|
|
color: #ccc;
|
|
}
|
|
.header .nav_contact:hover::before, .header .nav_contact:hover::after {
|
|
border-color: #ccc;
|
|
-webkit-transition: border-color 0s, width 0.25s, height 0.25s;
|
|
transition: border-color 0s, width 0.25s, height 0.25s;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.header .nav_contact:hover::before {
|
|
-webkit-transition-delay: 0s, 0s, 0.25s;
|
|
transition-delay: 0s, 0s, 0.25s;
|
|
}
|
|
.header .nav_contact:hover::after {
|
|
-webkit-transition-delay: 0s, 0.25s, 0s;
|
|
transition-delay: 0s, 0.25s, 0s;
|
|
}
|
|
.header .nav_contact::before, .header .nav_contact::after {
|
|
border: 0 solid transparent;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
content: "";
|
|
pointer-events: none;
|
|
position: absolute;
|
|
width: 0;
|
|
height: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
}
|
|
.header .nav_contact::before {
|
|
border-bottom-width: 4px;
|
|
border-left-width: 4px;
|
|
}
|
|
.header .nav_contact::after {
|
|
border-top-width: 4px;
|
|
border-right-width: 4px;
|
|
}
|
|
.header .nav .service_nav {
|
|
background: rgba(0, 0, 0, 0.7);
|
|
position: absolute;
|
|
top: calc(100% + 60px);
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
-moz-ransform: translateX(-50%);
|
|
-o-transform: translateX(-50%);
|
|
-ms-transform: translateX(-50%);
|
|
-webkit-transform: translateX(-50%);
|
|
white-space: nowrap;
|
|
z-index: 3;
|
|
min-width: 400px;
|
|
text-align: center;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
-webkit-transition: 0.4s linear;
|
|
transition: 0.4s linear;
|
|
}
|
|
.header .nav .service_nav.active {
|
|
top: calc(100% + 20px);
|
|
opacity: 1;
|
|
pointer-events: unset;
|
|
}
|
|
.header .nav .service_nav a {
|
|
display: block;
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
line-height: 20px;
|
|
color: #fff;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
padding: 20px 0;
|
|
}
|
|
.header .nav .service_nav a:hover {
|
|
background: #2B72B6;
|
|
color: #fff;
|
|
}
|
|
.header .lang {
|
|
position: relative;
|
|
}
|
|
.header .lang_current {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
position: relative;
|
|
margin-right: 20px;
|
|
cursor: pointer;
|
|
}
|
|
.header .lang_current h6 {
|
|
position: relative;
|
|
display: block;
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
color: #FFFFFF;
|
|
}
|
|
.header .lang_current h6::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 50%;
|
|
right: -20px;
|
|
transform: translateY(-50%);
|
|
-moz-ransform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
width: 8px;
|
|
height: 4px;
|
|
-webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
|
|
clip-path: polygon(0 0, 50% 100%, 100% 0);
|
|
background: #fff;
|
|
}
|
|
.header .lang_icon {
|
|
width: 20px;
|
|
height: 20px;
|
|
margin-right: 10px;
|
|
}
|
|
.header .lang_icon img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.header .lang_drop {
|
|
position: absolute;
|
|
top: calc(100% + 50px);
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
-moz-ransform: translateX(-50%);
|
|
-o-transform: translateX(-50%);
|
|
-ms-transform: translateX(-50%);
|
|
-webkit-transform: translateX(-50%);
|
|
background: rgba(0, 0, 0, 0.7);
|
|
color: #fff;
|
|
width: 120px;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
-webkit-transition: 0.3s linear;
|
|
transition: 0.3s linear;
|
|
}
|
|
.header .lang_drop.active {
|
|
opacity: 1;
|
|
pointer-events: unset;
|
|
top: calc(100% + 20px);
|
|
}
|
|
.header .lang_drop-link {
|
|
color: #fff !important;
|
|
display: block;
|
|
text-align: center;
|
|
text-transform: uppercase;
|
|
font-size: 15px;
|
|
font-weight: 500;
|
|
line-height: 1.4;
|
|
padding: 7px;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
.header .lang_drop-link:hover {
|
|
background: #2B72B6 !important;
|
|
color: #fff !important;
|
|
}
|
|
.header .burger {
|
|
display: none;
|
|
}
|
|
|
|
@keyframes logo-bg {
|
|
0% {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@-webkit-keyframes logo-bg {
|
|
0% {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes inner-txt {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
85% {
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@-webkit-keyframes inner-txt {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
85% {
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@keyframes group-txt {
|
|
0% {
|
|
-webkit-transform: translateX(-150%);
|
|
transform: translateX(-150%);
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
-webkit-transform: translateX(0);
|
|
transform: translateX(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@-webkit-keyframes group-txt {
|
|
0% {
|
|
-webkit-transform: translateX(-150%);
|
|
transform: translateX(-150%);
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
-webkit-transform: translateX(0);
|
|
transform: translateX(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
.logo-bg-animate {
|
|
animation: logo-bg 0.8s linear;
|
|
-webkit-animation: logo-bg 0.8s linear;
|
|
}
|
|
|
|
.inner-txt-animte {
|
|
animation: inner-txt 1s linear;
|
|
-webkit-animation: inner-txt 1s linear;
|
|
}
|
|
|
|
.group-txt-animte {
|
|
animation: group-txt 1s linear;
|
|
-webkit-animation: group-txt 1s linear;
|
|
}
|
|
|
|
svg .svg-elem-1 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0s;
|
|
transition: fill 0.7s ease-in 0s;
|
|
}
|
|
|
|
svg.active .svg-elem-1 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-2 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.07s;
|
|
transition: fill 0.7s ease-in 0.07s;
|
|
}
|
|
|
|
svg.active .svg-elem-2 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-3 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.14s;
|
|
transition: fill 0.7s ease-in 0.14s;
|
|
}
|
|
|
|
svg.active .svg-elem-3 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-4 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.21s;
|
|
transition: fill 0.7s ease-in 0.21s;
|
|
}
|
|
|
|
svg.active .svg-elem-4 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-5 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.28s;
|
|
transition: fill 0.7s ease-in 0.28s;
|
|
}
|
|
|
|
svg.active .svg-elem-5 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-6 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.35s;
|
|
transition: fill 0.7s ease-in 0.35s;
|
|
}
|
|
|
|
svg.active .svg-elem-6 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-7 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.42s;
|
|
transition: fill 0.7s ease-in 0.42s;
|
|
}
|
|
|
|
svg.active .svg-elem-7 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-8 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.49s;
|
|
transition: fill 0.7s ease-in 0.49s;
|
|
}
|
|
|
|
svg.active .svg-elem-8 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-9 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.56s;
|
|
transition: fill 0.7s ease-in 0.56s;
|
|
}
|
|
|
|
svg.active .svg-elem-9 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-10 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.63s;
|
|
transition: fill 0.7s ease-in 0.63s;
|
|
}
|
|
|
|
svg.active .svg-elem-10 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-11 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.7s;
|
|
transition: fill 0.7s ease-in 0.7s;
|
|
}
|
|
|
|
svg.active .svg-elem-11 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-12 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.77s;
|
|
transition: fill 0.7s ease-in 0.77s;
|
|
}
|
|
|
|
svg.active .svg-elem-12 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-13 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.84s;
|
|
transition: fill 0.7s ease-in 0.84s;
|
|
}
|
|
|
|
svg.active .svg-elem-13 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-14 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.91s;
|
|
transition: fill 0.7s ease-in 0.91s;
|
|
}
|
|
|
|
svg.active .svg-elem-14 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-15 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 0.98s;
|
|
transition: fill 0.7s ease-in 0.98s;
|
|
}
|
|
|
|
svg.active .svg-elem-15 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-16 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 1.05s;
|
|
transition: fill 0.7s ease-in 1.05s;
|
|
}
|
|
|
|
svg.active .svg-elem-16 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-17 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 1.12s;
|
|
transition: fill 0.7s ease-in 1.12s;
|
|
}
|
|
|
|
svg.active .svg-elem-17 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-18 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 1.19s;
|
|
transition: fill 0.7s ease-in 1.19s;
|
|
}
|
|
|
|
svg.active .svg-elem-18 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-19 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 1.26s;
|
|
transition: fill 0.7s ease-in 1.26s;
|
|
}
|
|
|
|
svg.active .svg-elem-19 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-20 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 1.33s;
|
|
transition: fill 0.7s ease-in 1.33s;
|
|
}
|
|
|
|
svg.active .svg-elem-20 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
svg .svg-elem-21 {
|
|
fill: transparent;
|
|
-webkit-transition: fill 0.7s ease-in 1.4s;
|
|
transition: fill 0.7s ease-in 1.4s;
|
|
}
|
|
|
|
svg.active .svg-elem-21 {
|
|
fill: rgb(255, 255, 255);
|
|
}
|
|
|
|
.crumb {
|
|
padding: 50px 0 0;
|
|
}
|
|
.crumb_title {
|
|
font-weight: 700;
|
|
font-size: 28px;
|
|
line-height: 46px;
|
|
}
|
|
.crumb_txt {
|
|
font-weight: 400;
|
|
font-size: 16px;
|
|
line-height: 30px;
|
|
}
|
|
|
|
.custom-select select {
|
|
display: none;
|
|
}
|
|
|
|
.custom-select {
|
|
position: relative;
|
|
}
|
|
|
|
.select-selected {
|
|
font-weight: 400;
|
|
font-size: 16px;
|
|
line-height: 1.4;
|
|
padding: 12px 40px 12px 20px;
|
|
cursor: pointer;
|
|
background-color: #fff;
|
|
border-radius: 4px;
|
|
border: 1px solid #ced4da;
|
|
}
|
|
.select-selected.select-arrow-active {
|
|
border-bottom: none;
|
|
border: 4px 4px 0 0;
|
|
}
|
|
.select-selected.select-arrow-active:after {
|
|
-webkit-transform: translateY(-50%) rotate(225deg);
|
|
transform: translateY(-50%) rotate(225deg);
|
|
}
|
|
.select-selected::after {
|
|
position: absolute;
|
|
content: "";
|
|
top: 50%;
|
|
-webkit-transform: translateY(-50%) rotate(45deg);
|
|
transform: translateY(-50%) rotate(45deg);
|
|
right: 20px;
|
|
width: 8px;
|
|
height: 8px;
|
|
z-index: 4;
|
|
border-bottom: 1.5px solid #868686;
|
|
border-right: 1.5px solid #868686;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
|
|
.select-items {
|
|
position: absolute;
|
|
top: calc(100% + 10px);
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 99;
|
|
cursor: pointer;
|
|
-webkit-animation-name: select;
|
|
animation-name: select;
|
|
-webkit-animation-duration: 0.3s;
|
|
animation-duration: 0.3s;
|
|
background: #fff;
|
|
}
|
|
.select-items div {
|
|
font-weight: 400;
|
|
font-size: 14px;
|
|
line-height: 1.4;
|
|
color: black;
|
|
padding: 10px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
background-color: rgba(200, 200, 200, 0.5);
|
|
border: 1px solid #EDEDED;
|
|
border-radius: 4px;
|
|
margin-bottom: 2px;
|
|
}
|
|
.select-items div:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.select-items div:hover {
|
|
border: 1px solid #EDEDED;
|
|
}
|
|
.select-items::-webkit-scrollbar {
|
|
width: 10px;
|
|
}
|
|
.select-items::-webkit-scrollbar-track {
|
|
background: #ededed;
|
|
border-radius: 10px;
|
|
}
|
|
.select-items::-webkit-scrollbar-thumb {
|
|
background: #aeaeae;
|
|
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
|
|
box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
|
|
}
|
|
|
|
.select-hide {
|
|
display: none;
|
|
}
|
|
|
|
.select-items div:hover,
|
|
.same-as-selected {
|
|
background-color: rgba(250, 250, 250, 0.5);
|
|
}
|
|
|
|
.modal {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.5);
|
|
-webkit-backdrop-filter: blur(5px);
|
|
backdrop-filter: blur(5px);
|
|
z-index: 50;
|
|
display: none;
|
|
}
|
|
.modal.active {
|
|
display: block;
|
|
}
|
|
.modal.active .modal_inner {
|
|
top: 50%;
|
|
opacity: 1;
|
|
}
|
|
.modal_inner {
|
|
position: absolute;
|
|
top: 60%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
-moz-ransform: translate(-50%, -50%);
|
|
-o-transform: translate(-50%, -50%);
|
|
-ms-transform: translate(-50%, -50%);
|
|
-webkit-transform: translate(-50%, -50%);
|
|
max-width: 900px;
|
|
width: calc(100% - 120px);
|
|
max-height: 450px;
|
|
height: calc(100% - 150px);
|
|
padding: 70px 50px;
|
|
background: rgba(0, 0, 0, 0.5);
|
|
-webkit-backdrop-filter: 5px;
|
|
backdrop-filter: 5px;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
opacity: 0.3;
|
|
display: block;
|
|
}
|
|
.modal_close {
|
|
position: absolute;
|
|
top: 30px;
|
|
right: 30px;
|
|
cursor: pointer;
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
.modal_close:hover svg path {
|
|
fill: red;
|
|
}
|
|
.modal_close svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
pointer-events: none;
|
|
}
|
|
.modal_video {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.modal_video video {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
|
|
.footer {
|
|
padding: 30px 0;
|
|
background: #000;
|
|
}
|
|
.footer_box {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: justify;
|
|
-ms-flex-pack: justify;
|
|
justify-content: space-between;
|
|
}
|
|
.footer .logo {
|
|
width: 200px;
|
|
height: 70px;
|
|
}
|
|
.footer .logo img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.footer .copyright {
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
line-height: 32px;
|
|
color: #fff;
|
|
}
|
|
|
|
.service {
|
|
overflow: hidden;
|
|
height: calc(100vh - 110px);
|
|
}
|
|
.service::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.service_wrap {
|
|
position: relative;
|
|
height: 100%;
|
|
}
|
|
.service .inner {
|
|
height: 100%;
|
|
position: relative;
|
|
}
|
|
.service_bg {
|
|
position: relative;
|
|
height: 100%;
|
|
}
|
|
.service_bg-image {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
opacity: 0;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-webkit-transition: opacity 0.5s linear;
|
|
transition: opacity 0.5s linear;
|
|
background: url("../images/service-banner.png") no-repeat center;
|
|
background-size: cover;
|
|
}
|
|
.service_bg-image::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.5);
|
|
}
|
|
.service_bg-image.main {
|
|
opacity: 1;
|
|
z-index: -1;
|
|
}
|
|
.service_bg-image img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
-o-object-fit: cover;
|
|
}
|
|
.service_info {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
z-index: 4;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow-x: auto;
|
|
}
|
|
.service_info::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.service_item {
|
|
width: calc(16.66% - 1px);
|
|
min-width: 250px;
|
|
border-right: 1px solid rgba(250, 250, 250, 0.2);
|
|
color: #fff;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
text-align: center;
|
|
position: relative;
|
|
}
|
|
.service_item-info {
|
|
position: absolute;
|
|
left: 0;
|
|
transform: translateY(-50%);
|
|
-moz-ransform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
width: 100%;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.service_item:last-child {
|
|
border-right: none;
|
|
}
|
|
.service_item:hover .service_item-title {
|
|
-webkit-transform: translateY(0px);
|
|
transform: translateY(0px);
|
|
}
|
|
.service_item:hover .service_item-txt {
|
|
opacity: 1;
|
|
}
|
|
.service_item-title {
|
|
padding: 30px 10px;
|
|
font-weight: 700;
|
|
font-size: 16px;
|
|
line-height: 20px;
|
|
position: relative;
|
|
-webkit-transform: translateY(100px);
|
|
transform: translateY(100px);
|
|
min-height: 40px;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
background: rgba(0, 0, 0, 0.6);
|
|
width: calc(100% - 20px);
|
|
transition: 0.4s linear;
|
|
-webkit-transition: 0.4s linear;
|
|
-ms-transition: 0.4s linear;
|
|
}
|
|
.service_item-txt {
|
|
font-weight: 400;
|
|
font-size: 14px;
|
|
line-height: 24px;
|
|
width: calc(100% - 40px);
|
|
margin: 20px auto 0;
|
|
opacity: 0;
|
|
width: 100%;
|
|
position: absolute;
|
|
bottom: -110px;
|
|
left: 0;
|
|
transition: 0.4s linear;
|
|
-webkit-transition: 0.4s linear;
|
|
-ms-transition: 0.4s linear;
|
|
}
|
|
|
|
.contact {
|
|
padding: 100px 0;
|
|
}
|
|
.contact_title {
|
|
font-weight: 600;
|
|
font-size: 34px;
|
|
line-height: 46px;
|
|
margin-bottom: 50px;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
letter-spacing: 0.5px;
|
|
position: relative;
|
|
}
|
|
.contact_box {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.contact_form {
|
|
width: calc(50% - 25px);
|
|
margin-right: 25px;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
-webkit-box-align: start;
|
|
-ms-flex-align: start;
|
|
align-items: flex-start;
|
|
}
|
|
.contact_input {
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
}
|
|
.contact_input input {
|
|
border: 1px solid #737373;
|
|
padding: 12px 20px;
|
|
width: calc(100% - 40px);
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
line-height: 36px;
|
|
font-family: "Montserrat", sans-serif;
|
|
}
|
|
.contact_input input::-webkit-input-placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input input::-moz-placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input input:-ms-input-placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input input::-ms-input-placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input input::placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input textarea {
|
|
border: 1px solid #737373;
|
|
padding: 12px 20px;
|
|
width: calc(100% - 40px);
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
line-height: 36px;
|
|
font-family: "Montserrat", sans-serif;
|
|
resize: none;
|
|
height: 180px;
|
|
}
|
|
.contact_input textarea::-webkit-input-placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input textarea::-moz-placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input textarea:-ms-input-placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input textarea::-ms-input-placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_input textarea::placeholder {
|
|
color: #737373;
|
|
}
|
|
.contact_btn {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
border: 1px solid #2B72B6;
|
|
padding: 18px 30px;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
line-height: 36px;
|
|
color: #2B72B6;
|
|
font-family: "Montserrat", sans-serif;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
.contact_btn:hover {
|
|
background: #2B72B6;
|
|
color: #fff;
|
|
}
|
|
.contact_btn:hover .btn_icon {
|
|
opacity: 0;
|
|
width: 0;
|
|
height: 0;
|
|
overflow: hidden;
|
|
margin-right: 0;
|
|
}
|
|
.contact_btn:hover .send_icon {
|
|
display: block;
|
|
width: 18px;
|
|
height: 24px;
|
|
opacity: 1;
|
|
}
|
|
.contact_btn span {
|
|
width: 18px;
|
|
height: 24px;
|
|
}
|
|
.contact_btn span img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.contact_btn .btn_icon {
|
|
margin-right: 10px;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
.contact_btn .send_icon {
|
|
margin-left: 15px;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
width: 0;
|
|
height: 0;
|
|
overflow: hidden;
|
|
}
|
|
.contact_info {
|
|
width: calc(50% - 25px);
|
|
margin-left: 25px;
|
|
}
|
|
.contact_map {
|
|
width: 100%;
|
|
height: 240px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.contact_map iframe {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
-o-object-fit: cover;
|
|
}
|
|
.contact_row {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
margin-bottom: 30px;
|
|
}
|
|
.contact_row:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.contact_row-group {
|
|
margin-top: 7px;
|
|
}
|
|
.contact_row-icon {
|
|
width: 40px;
|
|
height: 40px;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
.about {
|
|
padding: 50px 0;
|
|
}
|
|
.about_box {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.about_video {
|
|
width: 100%;
|
|
}
|
|
.about_video-box {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 600px;
|
|
}
|
|
.about_video-box img,
|
|
.about_video-box video {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
display: block;
|
|
}
|
|
.about_video-box .video_play {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
-moz-ransform: translate(-50%, -50%);
|
|
-o-transform: translate(-50%, -50%);
|
|
-ms-transform: translate(-50%, -50%);
|
|
-webkit-transform: translate(-50%, -50%);
|
|
width: 85px;
|
|
height: 85px;
|
|
background: white;
|
|
border-radius: 50%;
|
|
display: block;
|
|
z-index: 5;
|
|
cursor: pointer;
|
|
}
|
|
.about_video-box .video_play::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 54%;
|
|
transform: translate(-50%, -50%);
|
|
-moz-ransform: translate(-50%, -50%);
|
|
-o-transform: translate(-50%, -50%);
|
|
-ms-transform: translate(-50%, -50%);
|
|
-webkit-transform: translate(-50%, -50%);
|
|
-webkit-clip-path: polygon(0 0, 0% 100%, 100% 50%);
|
|
clip-path: polygon(0 0, 0% 100%, 100% 50%);
|
|
background: #2B72B6;
|
|
width: 24px;
|
|
height: 27px;
|
|
}
|
|
.about_list {
|
|
margin-bottom: 50px;
|
|
position: relative;
|
|
}
|
|
.about_list li {
|
|
margin-bottom: 15px;
|
|
padding-left: 70px;
|
|
position: relative;
|
|
}
|
|
.about_list li::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 7px;
|
|
left: 25px;
|
|
background: url("../images/svg/circle.svg") no-repeat center;
|
|
background-size: contain;
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
.about_list li::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 27px;
|
|
left: 34px;
|
|
height: calc(100% + 10px);
|
|
width: 1px;
|
|
border-left: 2px dashed #C4DAF0;
|
|
border-right: none;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
z-index: -1;
|
|
}
|
|
.about_list li:last-child::after {
|
|
display: none;
|
|
}
|
|
.about_list li p {
|
|
font-weight: 400;
|
|
font-size: 18px;
|
|
line-height: 35px;
|
|
}
|
|
.about_list li p span {
|
|
font-weight: 700;
|
|
}
|
|
|
|
@keyframes open-arrow {
|
|
0% {
|
|
left: -20px;
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
left: 0;
|
|
}
|
|
}
|
|
@-webkit-keyframes open-arrow {
|
|
0% {
|
|
left: -20px;
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
left: 0;
|
|
}
|
|
}
|
|
@keyframes typing {
|
|
from {
|
|
width: 0;
|
|
}
|
|
to {
|
|
width: 100%;
|
|
}
|
|
}
|
|
@-webkit-keyframes typing {
|
|
from {
|
|
width: 0;
|
|
}
|
|
to {
|
|
width: 100%;
|
|
}
|
|
}
|
|
.client {
|
|
padding: 50px 0 100px;
|
|
background: #F5F5F5;
|
|
}
|
|
.client_title {
|
|
font-weight: 600;
|
|
font-size: 34px;
|
|
line-height: 46px;
|
|
margin-bottom: 50px;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
letter-spacing: 0.5px;
|
|
position: relative;
|
|
}
|
|
.client_item {
|
|
width: 100%;
|
|
height: 100px !important;
|
|
margin: 0 5px;
|
|
position: relative;
|
|
display: -webkit-box !important;
|
|
display: -ms-flexbox !important;
|
|
display: flex !important;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
overflow: hidden;
|
|
border: 1px solid #D9D9D9;
|
|
padding: 30px;
|
|
}
|
|
.client_item img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
-webkit-transition: all 0.5s linear;
|
|
transition: all 0.5s linear;
|
|
}
|
|
.client_item img:hover {
|
|
-webkit-transform: scale(1.05);
|
|
transform: scale(1.05);
|
|
}
|
|
.client .slick-dots li:nth-of-type(n+12) {
|
|
display: none;
|
|
}
|
|
|
|
.title-animate {
|
|
animation: typing 3.5s steps(40, end);
|
|
-webkit-animation: typing 3.5s steps(40, end);
|
|
}
|
|
|
|
.about.page {
|
|
padding: 50px 0 0;
|
|
}
|
|
.about.page .about_txt {
|
|
font-weight: 400;
|
|
font-size: 18px;
|
|
line-height: 30px;
|
|
color: #000000;
|
|
margin-bottom: 30px;
|
|
}
|
|
.about.page .about_box {
|
|
background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0.7))), url("../images/blur-bg.jpg") no-repeat center;
|
|
background: linear-gradient(0deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url("../images/blur-bg.jpg") no-repeat center;
|
|
background-size: cover;
|
|
margin-bottom: 50px;
|
|
position: relative;
|
|
padding: 80px 0;
|
|
}
|
|
.about.page .about_box::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
-webkit-backdrop-filter: blur(15px);
|
|
backdrop-filter: blur(15px);
|
|
z-index: 1;
|
|
}
|
|
.about.page .about_box-inner {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
z-index: 5;
|
|
position: relative;
|
|
}
|
|
.about.page .about_box-item {
|
|
width: calc(33.33% - 82px);
|
|
margin: 20px;
|
|
text-align: center;
|
|
padding: 30px 20px;
|
|
border: 0.5px solid hsla(0, 0%, 100%, 0.3);
|
|
border-radius: 12px;
|
|
color: #fff;
|
|
}
|
|
.about.page .about_box-item-title {
|
|
font-size: 22px;
|
|
font-weight: 400;
|
|
line-height: 1.4;
|
|
}
|
|
.about.page .about_box-item-txt {
|
|
margin-top: 20px;
|
|
font-size: 16px;
|
|
font-weight: 400;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.main_title {
|
|
padding-left: 25px;
|
|
position: relative;
|
|
font-size: 28px;
|
|
font-weight: 500;
|
|
line-height: 1.4;
|
|
margin: 45px 0 30px;
|
|
}
|
|
.main_title::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 3px;
|
|
height: 100%;
|
|
max-height: 35px;
|
|
background: #2B72B6;
|
|
}
|
|
|
|
.p0 {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.pt0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
|
|
.pb0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
|
|
.gallery {
|
|
padding: 100px 0;
|
|
}
|
|
.gallery_filter-row {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: justify;
|
|
-ms-flex-pack: justify;
|
|
justify-content: space-between;
|
|
}
|
|
.gallery_filter-row .category {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.gallery_filter-row .category_icon {
|
|
width: 18px;
|
|
height: 18px;
|
|
margin-right: 10px;
|
|
}
|
|
.gallery_filter-row .category_icon svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.gallery_filter-row .category .select-selected {
|
|
border: none;
|
|
padding: 0 20px 0 0;
|
|
font-weight: 400;
|
|
font-size: 16px;
|
|
line-height: 20px;
|
|
}
|
|
.gallery_filter-row .category .select-selected.select-arrow-active::after {
|
|
-webkit-transform: translateY(-50%) rotate(180deg);
|
|
transform: translateY(-50%) rotate(180deg);
|
|
}
|
|
.gallery_filter-row .category .select-selected::after {
|
|
border: none;
|
|
-webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
|
|
clip-path: polygon(0 0, 50% 100%, 100% 0);
|
|
width: 12px;
|
|
height: 6px;
|
|
right: 0;
|
|
background: #2B72B6;
|
|
-webkit-transform: translateY(-50%) rotate(0);
|
|
transform: translateY(-50%) rotate(0);
|
|
}
|
|
.gallery_box {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
margin: 50px -1px;
|
|
}
|
|
.gallery_box-item {
|
|
width: calc(33.33% - 2px);
|
|
height: 370px;
|
|
margin: 1px;
|
|
position: relative;
|
|
cursor: pointer;
|
|
}
|
|
.gallery_box-item::after {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.8)));
|
|
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
|
|
pointer-events: none;
|
|
}
|
|
.gallery_box-item-info {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
padding: 30px;
|
|
width: calc(100% - 60px);
|
|
color: #fff;
|
|
z-index: 1;
|
|
pointer-events: none;
|
|
}
|
|
.gallery_box-item-title {
|
|
font-weight: 700;
|
|
font-size: 16px;
|
|
line-height: 36px;
|
|
}
|
|
.gallery_box-item-txt {
|
|
font-weight: 400;
|
|
font-size: 14px;
|
|
line-height: 17px;
|
|
}
|
|
.gallery .gal_slider-item {
|
|
width: 100%;
|
|
height: 370px !important;
|
|
}
|
|
.gallery .gal_slider-item img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
-o-object-fit: cover;
|
|
}
|
|
.gallery .pagination {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.gallery .pagination .pag_arrow {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
width: 50px;
|
|
height: 50px;
|
|
border: 1px solid #2B72B6;
|
|
}
|
|
.gallery .pagination .pag_arrow svg {
|
|
width: 30%;
|
|
height: 30%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.gallery .pagination .pag_txt {
|
|
margin: 0 15px;
|
|
font-weight: 400;
|
|
font-size: 16px;
|
|
line-height: 36px;
|
|
}
|
|
.gallery .pagination .pag_txt span {
|
|
color: #2B72B6;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.service.page {
|
|
padding: 50px 0 100px;
|
|
height: unset;
|
|
}
|
|
.service.page .service_info {
|
|
position: relative;
|
|
top: unset;
|
|
left: unset;
|
|
bottom: unset;
|
|
right: unset;
|
|
display: block;
|
|
}
|
|
.service.page .service_info p {
|
|
font-weight: 400;
|
|
font-size: 18px;
|
|
line-height: 30px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.service.page .service_info p b {
|
|
font-weight: 600;
|
|
}
|
|
.service.page .service_info p strong {
|
|
font-weight: 600;
|
|
position: relative;
|
|
padding-left: 15px;
|
|
}
|
|
.service.page .service_info p strong::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 5px;
|
|
height: 100%;
|
|
background: #2B72B6;
|
|
}
|
|
.service.page .service_block {
|
|
overflow-x: auto;
|
|
-ms-overflow-style: none;
|
|
scrollbar-width: none;
|
|
}
|
|
.service.page .service_block::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.service.page .service_txt {
|
|
font-weight: 400;
|
|
font-size: 18px;
|
|
line-height: 30px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.service.page .service_txt b {
|
|
font-weight: 600;
|
|
}
|
|
.service.page .service_box {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.service.page .service_box-item {
|
|
width: 440px;
|
|
margin-right: 30px;
|
|
}
|
|
.service.page .service_box-item-photo {
|
|
width: 100%;
|
|
height: 300px;
|
|
}
|
|
.service.page .service_box-item-photo img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
-o-object-fit: cover;
|
|
}
|
|
.service.page .service_box-item-title {
|
|
font-weight: 700;
|
|
font-size: 27px;
|
|
line-height: 36px;
|
|
margin: 30px 0 20px;
|
|
}
|
|
.service.page .service_list {
|
|
margin-bottom: 30px;
|
|
position: relative;
|
|
}
|
|
.service.page .service_list li {
|
|
margin-bottom: 15px;
|
|
padding-left: 35px;
|
|
position: relative;
|
|
}
|
|
.service.page .service_list li::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 5px;
|
|
left: 0px;
|
|
background: url("../images/svg/circle.svg") no-repeat center;
|
|
background-size: contain;
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
.service.page .service_list li::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 27px;
|
|
left: 9px;
|
|
height: calc(100% + 10px);
|
|
width: 1px;
|
|
border-left: 2px dashed #C4DAF0;
|
|
border-right: none;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
z-index: -1;
|
|
}
|
|
.service.page .service_list li:last-child::after {
|
|
display: none;
|
|
}
|
|
.service.page .service_list li p {
|
|
font-weight: 400;
|
|
font-size: 16px;
|
|
line-height: 30px;
|
|
}
|
|
|
|
/* Slider */
|
|
.slick-slider {
|
|
position: relative;
|
|
display: block;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
-webkit-touch-callout: none;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
-ms-touch-action: pan-y;
|
|
touch-action: pan-y;
|
|
-webkit-tap-highlight-color: transparent;
|
|
}
|
|
|
|
.slick-list {
|
|
position: relative;
|
|
overflow: hidden;
|
|
display: block;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.slick-list:focus {
|
|
outline: none;
|
|
}
|
|
.slick-list.dragging {
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.slick-slider .slick-track,
|
|
.slick-slider .slick-list {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
|
|
.slick-track {
|
|
position: relative;
|
|
left: 0;
|
|
top: 0;
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.slick-track:before, .slick-track:after {
|
|
content: "";
|
|
display: table;
|
|
}
|
|
.slick-track:after {
|
|
clear: both;
|
|
}
|
|
.slick-loading .slick-track {
|
|
visibility: hidden;
|
|
}
|
|
|
|
.slick-slide {
|
|
float: left;
|
|
height: 100%;
|
|
min-height: 1px;
|
|
display: none;
|
|
}
|
|
[dir=rtl] .slick-slide {
|
|
float: right;
|
|
}
|
|
.slick-slide img {
|
|
display: block;
|
|
}
|
|
.slick-slide.slick-loading img {
|
|
display: none;
|
|
}
|
|
.slick-slide.dragging img {
|
|
pointer-events: none;
|
|
}
|
|
.slick-initialized .slick-slide {
|
|
display: block;
|
|
}
|
|
.slick-loading .slick-slide {
|
|
visibility: hidden;
|
|
}
|
|
.slick-vertical .slick-slide {
|
|
display: block;
|
|
height: auto;
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
.slick-arrow.slick-hidden {
|
|
display: none;
|
|
}
|
|
|
|
/* Slider */
|
|
/* Icons */
|
|
/* Arrows */
|
|
.slick-prev,
|
|
.slick-next {
|
|
position: absolute;
|
|
display: block;
|
|
height: 20px;
|
|
width: 20px;
|
|
line-height: 0px;
|
|
font-size: 0px;
|
|
cursor: pointer;
|
|
background: transparent;
|
|
color: transparent;
|
|
top: 50%;
|
|
-webkit-transform: translate(0, -50%);
|
|
transform: translate(0, -50%);
|
|
padding: 0;
|
|
border: none;
|
|
outline: none;
|
|
}
|
|
.slick-prev:hover, .slick-prev:focus,
|
|
.slick-next:hover,
|
|
.slick-next:focus {
|
|
outline: none;
|
|
background: transparent;
|
|
color: transparent;
|
|
}
|
|
.slick-prev:hover:before, .slick-prev:focus:before,
|
|
.slick-next:hover:before,
|
|
.slick-next:focus:before {
|
|
opacity: 1;
|
|
}
|
|
.slick-prev.slick-disabled:before,
|
|
.slick-next.slick-disabled:before {
|
|
opacity: 0.25;
|
|
}
|
|
.slick-prev:before,
|
|
.slick-next:before {
|
|
font-family: "slick";
|
|
font-size: 20px;
|
|
line-height: 1;
|
|
color: #fff;
|
|
opacity: 0.75;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
|
|
.slick-prev {
|
|
left: -25px;
|
|
}
|
|
[dir=rtl] .slick-prev {
|
|
left: auto;
|
|
right: -25px;
|
|
}
|
|
.slick-prev:before {
|
|
content: "";
|
|
}
|
|
.client_box .slick-prev {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-moz-transform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
left: -50px;
|
|
width: 40px;
|
|
height: 40px;
|
|
background: url("../images/svg/slider-arrow.svg") no-repeat center;
|
|
background-size: contain;
|
|
z-index: 4;
|
|
}
|
|
.client_box .slick-next {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%) rotate(180deg);
|
|
-ms-transform: translateY(-50%) rotate(180deg);
|
|
-moz-transform: translateY(-50%) rotate(180deg);
|
|
-o-transform: translateY(-50%) rotate(180deg);
|
|
-webkit-transform: translateY(-50%) rotate(180deg);
|
|
right: -50px;
|
|
width: 40px;
|
|
height: 40px;
|
|
background: url("../images/svg/slider-arrow.svg") no-repeat center;
|
|
background-size: contain;
|
|
z-index: 4;
|
|
}
|
|
.client_box .slick-dots {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
bottom: -50px;
|
|
}
|
|
.client_box .slick-dots li {
|
|
display: block;
|
|
}
|
|
.client_box .slick-dots li button {
|
|
display: block;
|
|
width: 14px;
|
|
height: 14px;
|
|
border: 2px solid #D6D6D6;
|
|
opacity: 1;
|
|
background: transparent;
|
|
border-radius: 50%;
|
|
}
|
|
.client_box .slick-dots li.slick-active {
|
|
width: 14px;
|
|
height: 14px;
|
|
}
|
|
.client_box .slick-dots li.slick-active button {
|
|
border: 1px solid #2B72B6;
|
|
background-size: contain;
|
|
width: 14px;
|
|
height: 14px;
|
|
opacity: 1;
|
|
position: relative;
|
|
background: transparent;
|
|
}
|
|
.client_box .slick-dots li.slick-active button::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
-moz-ransform: translate(-50%, -50%);
|
|
-o-transform: translate(-50%, -50%);
|
|
-ms-transform: translate(-50%, -50%);
|
|
-webkit-transform: translate(-50%, -50%);
|
|
width: 50%;
|
|
height: 50%;
|
|
background: #2B72B6;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.hero_slider .slick-track {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.hero_slider .slick-prev {
|
|
transform: translateY(0) rotate(180deg);
|
|
-ms-transform: translateY(0) rotate(180deg);
|
|
-moz-transform: translateY(0) rotate(180deg);
|
|
-o-transform: translateY(0) rotate(180deg);
|
|
-webkit-transform: translateY(0) rotate(180deg);
|
|
width: 36px;
|
|
height: 24px;
|
|
background: url("../images/svg/hero-slider-arrow.svg") no-repeat center;
|
|
background-size: contain;
|
|
z-index: 4;
|
|
}
|
|
.hero_slider .slick-next {
|
|
transform: translateY(0%);
|
|
-ms-transform: translateY(0%);
|
|
-moz-transform: translateY(0%);
|
|
-o-transform: translateY(0%);
|
|
-webkit-transform: translateY(0%);
|
|
width: 36px;
|
|
height: 24px;
|
|
background: url("../images/svg/hero-slider-arrow.svg") no-repeat center;
|
|
background-size: contain;
|
|
z-index: 4;
|
|
}
|
|
.hero_slider .slick-dots {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: end;
|
|
-ms-flex-pack: end;
|
|
justify-content: flex-end;
|
|
padding: 0 60px;
|
|
max-width: 1500px;
|
|
bottom: unset;
|
|
position: relative;
|
|
top: -50px;
|
|
margin: 0 auto;
|
|
padding-right: 30px;
|
|
z-index: 10;
|
|
}
|
|
.hero_slider .slick-dots li {
|
|
display: block;
|
|
}
|
|
.hero_slider .slick-dots li button {
|
|
display: block;
|
|
width: 15px;
|
|
height: 15px;
|
|
border: 2.5px solid #fff;
|
|
opacity: 0.8;
|
|
border-radius: 50%;
|
|
}
|
|
.hero_slider .slick-dots li.slick-active {
|
|
width: 15px;
|
|
height: 15px;
|
|
}
|
|
.hero_slider .slick-dots li.slick-active button {
|
|
background: transparent;
|
|
background-size: contain;
|
|
width: 15px;
|
|
height: 15px;
|
|
border-radius: 50%;
|
|
}
|
|
.hero_slider .slick-dots li.slick-active button::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
-moz-ransform: translate(-50%, -50%);
|
|
-o-transform: translate(-50%, -50%);
|
|
-ms-transform: translate(-50%, -50%);
|
|
-webkit-transform: translate(-50%, -50%);
|
|
width: 6px;
|
|
height: 6px;
|
|
background: #fff;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.banner_box .slick-prev {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-moz-transform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
left: -200px;
|
|
width: 36px;
|
|
height: 24px;
|
|
background: url("../images/svg/arrow_left.svg") no-repeat center;
|
|
background-size: contain;
|
|
z-index: 4;
|
|
}
|
|
.banner_box .slick-next {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-moz-transform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
right: -200px;
|
|
width: 36px;
|
|
height: 24px;
|
|
background: url("../images/svg/arrow_right.svg") no-repeat center;
|
|
background-size: contain;
|
|
z-index: 4;
|
|
}
|
|
|
|
.news .slick-track {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.news .slick-prev {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-moz-transform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
left: 200px;
|
|
width: 36px;
|
|
height: 24px;
|
|
background: url("../images/svg/arrow_left-gold.svg") no-repeat center;
|
|
background-size: contain;
|
|
z-index: 4;
|
|
}
|
|
.news .slick-next {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-moz-transform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
right: 200px;
|
|
width: 36px;
|
|
height: 24px;
|
|
background: url("../images/svg/arrow_right-gold.svg") no-repeat center;
|
|
background-size: contain;
|
|
z-index: 4;
|
|
}
|
|
.news .slick-dots {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
bottom: -50px;
|
|
}
|
|
.news .slick-dots li {
|
|
display: block;
|
|
}
|
|
.news .slick-dots li button {
|
|
display: block;
|
|
width: 12px;
|
|
height: 12px;
|
|
border: 2px solid #fff;
|
|
opacity: 0.3;
|
|
border-radius: 50%;
|
|
}
|
|
.news .slick-dots li.slick-active {
|
|
width: 30px;
|
|
height: 30px;
|
|
}
|
|
.news .slick-dots li.slick-active button {
|
|
background: url("../images/svg/dot.svg") no-repeat center !important;
|
|
background-size: contain;
|
|
width: 30px;
|
|
height: 30px;
|
|
border: none;
|
|
}
|
|
|
|
.slick-next {
|
|
right: -25px;
|
|
}
|
|
[dir=rtl] .slick-next {
|
|
left: -25px;
|
|
right: auto;
|
|
}
|
|
.slick-next:before {
|
|
content: "";
|
|
}
|
|
[dir=rtl] .slick-next:before {
|
|
content: "←";
|
|
}
|
|
|
|
/* Dots */
|
|
.slick-dots {
|
|
position: absolute;
|
|
bottom: 32px;
|
|
list-style: none;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
text-align: center;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
padding: 0;
|
|
margin: 0;
|
|
width: 100%;
|
|
}
|
|
.slick-dots li {
|
|
position: relative;
|
|
cursor: pointer;
|
|
margin: 0 8px;
|
|
}
|
|
.slick-dots li button {
|
|
border: 0;
|
|
display: block;
|
|
height: 14px;
|
|
width: 14px;
|
|
outline: none;
|
|
color: transparent;
|
|
border-radius: 50%;
|
|
background: rgba(59, 59, 59, 0.5);
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
.slick-dots li button:focus {
|
|
outline: none;
|
|
background: #6ec9c7;
|
|
}
|
|
.slick-dots li.slick-active button {
|
|
background: #6ec9c7;
|
|
width: 28px;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
@media (max-width: 1400px) {
|
|
.about_video-box {
|
|
height: 470px;
|
|
}
|
|
.gallery {
|
|
padding: 80px 0;
|
|
}
|
|
.gallery_box-item {
|
|
height: 300px;
|
|
}
|
|
.gallery .gal_slider-item {
|
|
height: 300px !important;
|
|
}
|
|
.service.page .service_box {
|
|
width: calc(100% + 60px);
|
|
}
|
|
.service.page .service_box .slick-list {
|
|
padding: 0 60px 0 0 !important;
|
|
}
|
|
}
|
|
@media (max-width: 1200px) {
|
|
.hero_item-title {
|
|
font-size: 30px;
|
|
}
|
|
.hero_item-txt {
|
|
margin: 20px 0;
|
|
}
|
|
.hero_item-link {
|
|
font-size: 14px;
|
|
}
|
|
.hero .page_box-link {
|
|
font-size: 16px;
|
|
}
|
|
.about_video-box {
|
|
height: 430px;
|
|
}
|
|
.about_video-box .video_play {
|
|
width: 65px;
|
|
height: 65px;
|
|
}
|
|
.about_video-box .video_play::before {
|
|
width: 13px;
|
|
height: 17px;
|
|
}
|
|
.service_item-title {
|
|
font-size: 14px;
|
|
}
|
|
.service_item-txt {
|
|
font-size: 13px;
|
|
}
|
|
.contact {
|
|
padding: 70px 0;
|
|
}
|
|
.contact_title {
|
|
font-size: 30px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.client_title {
|
|
font-size: 30px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.client_box .slick-next {
|
|
width: 30px;
|
|
height: 30px;
|
|
right: -35px;
|
|
}
|
|
.client_box .slick-prev {
|
|
width: 30px;
|
|
height: 30px;
|
|
left: -35px;
|
|
}
|
|
.footer .logo {
|
|
width: 160px;
|
|
height: 55px;
|
|
}
|
|
}
|
|
@media (max-width: 1100px) {
|
|
.auto_container {
|
|
padding: 0 35px;
|
|
}
|
|
.header .burger {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
cursor: pointer;
|
|
width: 30px;
|
|
height: 25px;
|
|
position: relative;
|
|
}
|
|
.header .burger.active span {
|
|
background: transparent;
|
|
}
|
|
.header .burger.active span::before {
|
|
-webkit-transform: rotate(45deg);
|
|
transform: rotate(45deg);
|
|
width: 25px;
|
|
height: 1.5px;
|
|
top: 0;
|
|
}
|
|
.header .burger.active span::after {
|
|
width: 25px;
|
|
height: 1.5px;
|
|
-webkit-transform: rotate(-45deg);
|
|
transform: rotate(-45deg);
|
|
bottom: 0;
|
|
}
|
|
.header .burger span {
|
|
position: relative;
|
|
display: block;
|
|
width: 20px;
|
|
height: 1.5px;
|
|
background: #fff;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
.header .burger span::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: -7px;
|
|
right: 0;
|
|
width: 30px;
|
|
height: 1.5px;
|
|
background: #fff;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
.header .burger span::after {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: -7px;
|
|
right: 0;
|
|
width: 10px;
|
|
height: 1.5px;
|
|
background: #fff;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
.header .lang_drop {
|
|
background: transparent;
|
|
color: #fff;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
}
|
|
.header .lang_drop.active {
|
|
top: calc(100% + 7px);
|
|
}
|
|
.header .lang_drop-link {
|
|
color: #fff !important;
|
|
padding: 7px 15px;
|
|
position: relative;
|
|
font-size: 16px !important;
|
|
}
|
|
.header .lang_drop-link:first-child::before {
|
|
content: none;
|
|
}
|
|
.header .lang_drop-link:first-child::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
background: #fff;
|
|
height: 100%;
|
|
width: 1px;
|
|
}
|
|
.header .nav {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.header .nav_bg {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.7);
|
|
-webkit-backdrop-filter: blur(8px);
|
|
backdrop-filter: blur(8px);
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
-webkit-transform: scale(0);
|
|
transform: scale(0);
|
|
transition: all 0.3s linear;
|
|
-ms-transition: all 0.3s linear;
|
|
-moz-transition: all 0.3s linear;
|
|
-webkit-transition: all 0.3s linear;
|
|
}
|
|
.header .nav_bg.active {
|
|
opacity: 1;
|
|
pointer-events: unset;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
.header .nav ul {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
-webkit-box-align: unset;
|
|
-ms-flex-align: unset;
|
|
align-items: unset;
|
|
width: calc(100% - 90px);
|
|
max-width: 450px;
|
|
margin: 0 auto;
|
|
}
|
|
.header .nav ul li {
|
|
margin-right: 0;
|
|
margin-bottom: 30px;
|
|
}
|
|
.header .nav ul li:last-child {
|
|
margin-bottom: 0;
|
|
margin-top: 30px;
|
|
}
|
|
.header .nav ul li a {
|
|
font-size: 18px;
|
|
padding-left: 20px;
|
|
position: relative;
|
|
}
|
|
.header .nav ul li a::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 1px;
|
|
height: 100%;
|
|
background: #fff;
|
|
}
|
|
.header .nav .service_nav {
|
|
text-align: left;
|
|
position: relative;
|
|
top: unset;
|
|
left: unset;
|
|
-webkit-transform: translate(0, 0);
|
|
transform: translate(0, 0);
|
|
opacity: 1;
|
|
pointer-events: unset;
|
|
background-color: unset;
|
|
min-width: none;
|
|
}
|
|
.header .nav .service_nav-link {
|
|
display: none;
|
|
}
|
|
.header .nav .service_nav.active {
|
|
top: unset;
|
|
}
|
|
.header .nav .service_nav a {
|
|
font-size: 18px;
|
|
padding: 0;
|
|
padding-left: 20px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.header .nav .service_nav a:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.header .nav_contact {
|
|
text-align: center;
|
|
}
|
|
.hero_item-title {
|
|
font-size: 22px;
|
|
}
|
|
.hero_item-txt {
|
|
font-size: 15px;
|
|
}
|
|
.hero_item-link {
|
|
font-size: unset;
|
|
}
|
|
.hero_item-link a {
|
|
font-size: 14px;
|
|
padding: 10px 25px;
|
|
}
|
|
.hero .swiper-pagination-bullet {
|
|
width: 10px;
|
|
height: 10px;
|
|
}
|
|
.hero .swiper-pagination-bullet-active::after {
|
|
width: 5px;
|
|
height: 5px;
|
|
}
|
|
.hero .swiper-button-prev span {
|
|
width: 13px;
|
|
height: 20px;
|
|
}
|
|
.hero .swiper-button-prev span svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.hero .swiper-button-next span {
|
|
width: 13px;
|
|
height: 20px;
|
|
}
|
|
.hero .swiper-button-next span svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.about_video-box {
|
|
height: 385px;
|
|
}
|
|
.about.page .about_box-item-title {
|
|
font-size: 18px;
|
|
}
|
|
.about.page .about_box-item-txt {
|
|
font-size: 14px;
|
|
}
|
|
.contact_box {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
.contact_form {
|
|
width: 100%;
|
|
margin-right: 0;
|
|
margin-bottom: 60px;
|
|
}
|
|
.contact_input input {
|
|
font-size: 14px;
|
|
}
|
|
.contact_input textarea {
|
|
font-size: 14px;
|
|
}
|
|
.contact_btn {
|
|
padding: 14px 30px;
|
|
}
|
|
.contact_info {
|
|
width: 100%;
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
@media (max-width: 1000px) {
|
|
.gallery_box {
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
}
|
|
.gallery_box-item {
|
|
width: calc(50% - 2px);
|
|
}
|
|
.service.page .service_box {
|
|
width: calc(100% + 70px);
|
|
}
|
|
.service.page .service_box .slick-list {
|
|
padding: 0 170px 0 0 !important;
|
|
}
|
|
.about.page .about_box-item {
|
|
width: calc(50% - 82px);
|
|
}
|
|
}
|
|
@media (max-width: 750px) {
|
|
.header .logo_bg {
|
|
width: 55px;
|
|
height: 55px;
|
|
}
|
|
.header .logo_inner-text {
|
|
width: 30px;
|
|
height: 30px;
|
|
top: 50%;
|
|
font-size: unset;
|
|
display: block;
|
|
}
|
|
.header .logo_inner-text svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
.header .logo_group-txt {
|
|
width: 95px;
|
|
}
|
|
.crumb_title {
|
|
font-size: 24px;
|
|
}
|
|
.crumb_txt {
|
|
line-height: 30px;
|
|
font-size: 14px;
|
|
}
|
|
.hero_item {
|
|
height: 800px !important;
|
|
}
|
|
.hero_item-title {
|
|
font-size: 18px;
|
|
}
|
|
.hero_pag {
|
|
display: none;
|
|
}
|
|
.hero .page_box {
|
|
top: -50px;
|
|
}
|
|
.hero .page_box-group {
|
|
padding: 20px 50px 20px 0;
|
|
}
|
|
.hero .page_box-group::before {
|
|
width: 1500px;
|
|
left: -1499px;
|
|
}
|
|
.hero .page_box-link {
|
|
font-size: 14px;
|
|
}
|
|
.hero .page_box-link::after {
|
|
top: 5px;
|
|
width: 17px;
|
|
right: -24px;
|
|
}
|
|
.service {
|
|
height: calc(100vh - 95px);
|
|
}
|
|
.about {
|
|
padding-top: 0;
|
|
}
|
|
.about_video-box {
|
|
height: unset;
|
|
}
|
|
.about_video-box .video_play {
|
|
width: 54px;
|
|
height: 54px;
|
|
}
|
|
.about_video-box .video_play::before {
|
|
width: 13px;
|
|
height: 13px;
|
|
}
|
|
.contact {
|
|
padding: 50px 0;
|
|
}
|
|
.contact_title {
|
|
font-size: 26px;
|
|
margin-bottom: 25px;
|
|
}
|
|
.contact_input input {
|
|
padding: 10px 20px;
|
|
}
|
|
.contact_input textarea {
|
|
padding: 10px 20px;
|
|
}
|
|
.contact_btn {
|
|
padding: 12px 30px;
|
|
line-height: 30px;
|
|
}
|
|
.client_title {
|
|
font-size: 22px;
|
|
margin-bottom: 25px;
|
|
}
|
|
.client_box .slick-next, .client_box .slick-prev {
|
|
display: none !important;
|
|
}
|
|
.client_box .slick-dots li:nth-child(n+7) {
|
|
display: none;
|
|
}
|
|
.client_box .slick-dots li button {
|
|
width: 12px;
|
|
height: 12px;
|
|
}
|
|
.client_item {
|
|
height: 60px !important;
|
|
padding: 15px;
|
|
}
|
|
.footer_box {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
.footer .logo {
|
|
margin-bottom: 30px;
|
|
}
|
|
.footer .copyright {
|
|
font-size: 14px;
|
|
line-height: 30px;
|
|
text-align: center;
|
|
}
|
|
.gallery_box-item {
|
|
width: calc(50% - 2px);
|
|
height: 245px;
|
|
}
|
|
.gallery_box-item-title {
|
|
font-size: 13px;
|
|
line-height: 27px;
|
|
}
|
|
.gallery_box-item-txt {
|
|
font-size: 12px;
|
|
}
|
|
.gallery .gal_slider-item {
|
|
height: 245px !important;
|
|
}
|
|
.service.page .service_box-item {
|
|
min-width: 390px;
|
|
}
|
|
.service.page .service_box-item-photo {
|
|
height: 280px;
|
|
}
|
|
.main_title {
|
|
font-size: 20px;
|
|
}
|
|
}
|
|
@media (max-width: 650px) {
|
|
.auto_container {
|
|
padding: 0 20px;
|
|
}
|
|
.gallery {
|
|
padding: 60px 0;
|
|
}
|
|
.gallery_filter-row {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
-webkit-box-align: start;
|
|
-ms-flex-align: start;
|
|
align-items: flex-start;
|
|
}
|
|
.gallery_filter-row .category {
|
|
margin-bottom: 30px;
|
|
}
|
|
.gallery_filter-row .category:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.gallery_box {
|
|
margin-top: 30px;
|
|
}
|
|
.gallery_box-item {
|
|
width: calc(100% - 2px);
|
|
}
|
|
.service.page .service_box {
|
|
width: 100%;
|
|
}
|
|
.service.page .service_box .slick-list {
|
|
padding: 0 !important;
|
|
}
|
|
.service.page .service_box-item {
|
|
min-width: 280px;
|
|
margin-right: 15px;
|
|
}
|
|
.service.page .service_box-item-photo {
|
|
height: 240px;
|
|
}
|
|
.service.page .service_box-item-title {
|
|
font-size: 20px;
|
|
line-height: 27px;
|
|
}
|
|
.service.page .service_list li p {
|
|
line-height: 28px;
|
|
}
|
|
.about.page .about_box-item {
|
|
width: calc(100% - 42px);
|
|
margin: 20px 0;
|
|
}
|
|
.modal_inner {
|
|
height: unset;
|
|
}
|
|
}
|
|
@media (max-width: 400px) {
|
|
.auto_container {
|
|
padding: 0 20px;
|
|
}
|
|
.crumb_txt {
|
|
line-height: 30px;
|
|
font-size: 14px;
|
|
}
|
|
.hero_item {
|
|
height: 700px !important;
|
|
}
|
|
.service.page .service_box {
|
|
width: calc(100% + 0px);
|
|
}
|
|
.service.page .service_box-item {
|
|
min-width: unset !important;
|
|
margin-right: 5px;
|
|
}
|
|
.service.page .service_box .slick-list {
|
|
padding: 0 !important;
|
|
}
|
|
} |