/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on November 30, 2023 */
@font-face {font-family: 'falsesemi-bold'; src: url('../fonts/satoshi-bold-webfont.woff2') format('woff2'), url('../fonts/satoshi-bold-webfont.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face {font-family: 'satoshilight'; src: url('../fonts/satoshi-light-webfont.woff2') format('woff2'), url('../fonts/satoshi-light-webfont.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face {font-family: 'satoshimedium'; src: url('../fonts/satoshi-medium-webfont.woff2') format('woff2'), url('../fonts/satoshi-medium-webfont.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face {font-family: 'falsenormal'; src: url('../fonts/satoshi-regular-webfont.woff2') format('woff2'), url('../fonts/satoshi-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal;}

:root{
  --primary1: 230,138,10; /* #E68A0A */
  --primary2: 11,113,230; /* #0B71E6 */
  --primary3: 216,45,45; /* #D82D2D */
  --primary4: 10,152,225; /* #0A98E1 */
  --baseColor: 67,74,84; /* #434A54 */
  --color_gray: 247,247,247;  /* F7F7F7 */
  --color_black: 0,0,0;
  --color_white: 255,255,255;

  --baseFont: 'falsenormal', sans-serif;
  --baseFontLight: 'satoshilight', sans-serif;
  --baseFontMedium: 'satoshimedium', sans-serif;
  --baseFontBold: 'falsesemi-bold', sans-serif;

  --imgPrimary1: invert(57%) sepia(95%) saturate(2017%) hue-rotate(3deg) brightness(97%) contrast(92%);
  --imgPrimary2: invert(34%) sepia(68%) saturate(3691%) hue-rotate(201deg) brightness(92%) contrast(95%);
  --imgPrimary3: invert(31%) sepia(20%) saturate(6571%) hue-rotate(341deg) brightness(89%) contrast(96%);
  --imgPrimary4: invert(38%) sepia(37%) saturate(4319%) hue-rotate(177deg) brightness(104%) contrast(92%);  
  --imgWhite: invert(100%) sepia(100%) saturate(0%) hue-rotate(13deg) brightness(103%) contrast(102%);
  --imgBlack: invert(0%) sepia(100%) saturate(0%) hue-rotate(108deg) brightness(93%) contrast(103%);
  --padding: clamp(3.125rem, 2.8125rem + 1.5625vw, 4.6875rem);
  --mb:1.875rem;
  --bs-breadcrumb-divider: '|';
}

html { scroll-behavior: auto !important;}

body {font-family: var(--baseFont); color:rgb(var(--baseColor));}
a:hover, a:focus {outline: none; -webkit-box-shadow: none; box-shadow: none; text-decoration: none;}
button:focus {outline: none;}
.sprite {background-image: url("../images/sprite.png"); background-position: 0 0; background-repeat: no-repeat; display: inline-block; vertical-align: middle;}
.transition {-webkit-transition: all .3s linear; transition: all .3s linear;}

.container{max-width: 1440px; width: 100%;}
::selection {color: rgb(var(--color_white)); background: rgb(var(--primary1));}
.clr-1 {color: rgb(var(--primary1));} .bg-clr-1 {background-color: rgb(var(--primary1));}
.clr-2 {color: rgb(var(--primary2));} .bg-clr-2 {background-color: rgb(var(--primary2));}
.clr-3 {color: rgb(var(--primary3));} .bg-clr-3 {background-color: rgb(var(--primary3));}
.clr-4 {color: rgb(var(--primary4));} .bg-clr-4 {background-color: rgb(var(--primary4));}
.clr-base {color: rgb(var(--baseColor)) !important;}

.bg-clr-gray {background-color: rgb(var(--color_gray));}
.ff-light {font-family: var(--baseFontLight);}
.ff-medium {font-family: var(--baseFontMedium);}
.ff-bold {font-family: var(--baseFontBold);}
.spl {font-size: clamp(1.25rem, 1.225rem + 0.125vw, 1.375rem);}
.pg-content p a,.pg-content h3 a,.pg-content ul li a,.pg-content ol li a{color: inherit;}


/* button custom */
.btn-custom {position: relative; border: none; background-color: rgb(var(--primary1)); border-radius: 0; color: rgb(var(--color_white)); overflow: hidden; padding: 0.7rem 1.35rem; filter: drop-shadow(0px 15px 30px rgba(0, 0, 0, 0.15));}
.btn-custom:before {content: ''; position: absolute; inset: 0; transition: 0.4s; background-color: rgb(var(--primary1)); width: 0;}
.btn-custom span {position: relative;}
.btn-custom:focus {box-shadow: none;}
.btn-custom:hover, .btn-custom:focus{background-color: rgb(var(--primary1)); color: rgb(var(--color_white));}
.btn-custom:hover:before {width: 100%;}
.bg-gradient{background: linear-gradient(45deg,  #0a98e2 0%,#a83099 51%,#f58825 100%) !important; }
.btn-custom.bg-gradient:focus,.btn-custom.bg-gradient:active{color: rgb(var(--color_white)) !important;}
.bg-gradient:hover::before{display: none;}

/* owl-carousel */
.owl-flex .owl-stage {display: flex;}
.owl-carousel.style01 .owl-dots{display: flex; justify-content: flex-end; position: absolute; right: 0; bottom: 8px;}
.owl-carousel.style01 .owl-dots .owl-dot span{margin-left: 10px; width: 10px; height: 10px; border-radius: 50%; background-color: #5C6574; display: block;}
.owl-carousel.style01 .owl-dots .owl-dot.active span{background-color: rgb(var(--primary4));}
.owl-carousel.style01 .owl-nav button{width: 54px; height: 36px; display: flex; align-items: center; justify-content: center; background-color: #E8EEF6;}
.owl-carousel.style01 .owl-nav button:hover{background-color: rgb(var(--color_white)); }
.owl-carousel.style01 .owl-nav [class^='owl-'].disabled {opacity: 0.5; cursor: default;}
.owl-carousel.style01 .owl-nav.disabled [class^='owl-'] {display: none;}

#wrapper {max-width: 1920px; margin: 0 auto; position: relative;}

/* header */
header {max-width: 1920px; margin: 0 auto;}
body:not(#home) header {background-color: rgb(var(--color_white));}
header {left: 0; right: 0; top: 0; transition: all 0.4s; z-index: 22; }
header .navbar .navbar-nav .nav-link {font-family: var(--baseFontBold); font-size: 1rem; color: rgb(var(--color_black)); text-transform: uppercase; --bs-navbar-nav-link-padding-x: 0.75rem;}
header .navbar .navbar-nav .nav-link:hover,header  .navbar .navbar-nav .nav-item.active>.nav-link{color: rgb(var(--primary2)) !important;}
header .dropdown:hover > .dropdown-menu {display: block;}
header.fixed{background-color: rgb(var(--color_white)); box-shadow: 0px 4px 50px rgb(0 0 0 / 10%);}
header .dropdown-menu .dropdown-item:focus, header .dropdown-menu .dropdown-item:hover{color: rgb(var(--primary2)); background-color: transparent;}
header .dropdown-menu {--bs-dropdown-font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);}
header .dropdown-menu{width: 250px;}
header .dropdown .dropdown-menu .dropdown .dropdown-menu{left: 100%; top: 0;}
header .navbar .navbar-nav .dropdown-menu li a{font-size1: 0.85rem; text-transform: none; font-family: var(--baseFontMedium);}
header .dropdown-item {--bs-dropdown-link-color: rgb(var(--baseColor));}
header .navbar-collapse {justify-content: flex-end;}
header .sub-menu-toggle{display: none;}
header .dropdown:hover>.dropdown-menu,header .menu-item-has-children:hover>.dropdown-menu {display: block; visibility: visible; opacity: 1; margin: 0;}

header .menu-item-has-children>a:after {display: inline-block; margin-left: .255em; vertical-align: .255em; content: ""; border-top: .3em solid; border-right: .3em solid transparent; border-bottom: 0; border-left: .3em solid transparent;}

/* banner */
.banner {transition: all 0.3s; position: relative; overflow: hidden; height: 100vh; max-height: 960px;}
.banner .bg {position: absolute; left: 50%; top: 0; width: 1920px; max-height: 960px; transform: translateX(-50%);}
/* .banner .bg:before {content: ''; position: absolute; left: 0; top: 0; background: url('../images/banner-bg.webp') left top no-repeat; width: 1095px; height: 972px;} */
.banner .bg::after {
    content: "";
    background: linear-gradient(to bottom,rgba(255, 255, 255, 0.9) 0%,rgba(255, 255, 255, 0.3) 50%,rgba(255, 255, 255, 0) 100%);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
}

.banner-video {position: absolute; left: 0; top: 0; width: 1095px; height: 972px;}
.banner-video #banner-video {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;}

.z-index-1 {position: relative; z-index: 1;}

.banner .container {display: flex; align-items: center; height: 100%;}
.banner .container .banner-content-block {position: absolute; top: 50%; right: 12px; transform: translateY(-50%); width: 820px; height: 70vh;}
.banner {--sliderWidth: 820px; --sliderHeight: 698px;}
.banner .slider {width: var(--sliderWidth); height: var(--sliderHeight); position: absolute; right: 0; top: 0;}
.banner .slider.owl-carousel .owl-stage-outer{z-index: 2;}
.banner .slider .item {width: var(--sliderWidth); height: var(--sliderHeight);}
.banner .slider .item .item-inner {margin-left: 100px;  height: 100%; position: relative; display: flex; align-items: flex-end;}
.banner .slider .item .item-inner .btn-custom img{filter: var(--imgWhite);}
.banner .slider .item .item-inner::before {content: ''; position: absolute; width: 100%; height: 100%; left: 0; z-index: 0;}
.banner .slider .item .item-inner01::before {background-color: rgb(var(--primary1));}
.banner .slider .item .item-inner02::before {background-color: rgb(var(--primary2));}
.banner .slider .item .item-inner03::before {background-color: #7837B2;}
.banner .slider .item .item-inner::after{content: ''; position: absolute; width: 100%; height: 100%; background-image: url('../images/shape.png'); background-repeat: no-repeat; background-position: 0 0; top: 0; left: 0; z-index: 0;}
.banner .slider .item .product-block {width: 600px; margin-left: -100px; padding: 2rem 0 2rem 2.5rem; position: relative;}
.banner .slider .item .pro-pic {position: absolute; right: -150px; bottom: 70px; transition: 0.4s; z-index: 2;}
.banner .slider .item img {width: auto;}
.banner .slider .item .btn-custom:before {display: none;}
.banner .slider .item .btn-custom svg {width: 22px;}
.banner .slider .item .btn-custom svg path {fill: rgb(var(--color_white));}
.banner .banner-content-inner {position: absolute; left: 100px; top: 0; padding: 5rem 1.5rem 3rem; z-index: 1;}
.banner .banner-content-inner img.logo {width: 173px; height: 41px; margin-bottom: var(--mb);}
.banner .banner-content-inner h1 {max-width: 300px; font-size: clamp(1.5rem, 1.4rem + 0.5vw, 2rem);}
.banner .owl-nav {position: absolute; bottom: -36px; left: 100px; display: flex;}
.banner .slider .owl-item.active .pro-pic {right: 20px;}

/* Typography */
.padding {padding: var(--padding) 0;}
h2.title {font-size: clamp(1.5rem, 1.3rem + 1vw, 2.4rem);}
h2.title.sm {font-size: clamp(1.5rem, 1.425rem + 0.375vw, 1.875rem);}
h2.title.has-line {position: relative;}
h2.title.has-line:before {content: ''; position: absolute; left: 0; top: 0; width: 32px; height: 4px; background-color: rgb(var(--primary2));}
h2.title.has-line.btm:before {top: auto; bottom: 0;}
h3 {font-size: clamp(1.125rem, 1.1rem + 0.125vw, 1.25rem);}
.bg{background-color: #EFF9FF;}
.bg02{background-color: #FFF3E4;}

/* about */
.about .about-block-inner:before {content: ''; position: absolute; left: 0; top: 0; width: 50%; height: 100%; background:#EFF9FF;}
.about .about-block-inner .text-block {max-width: 400px;}
.about .about-block-inner .text-block h2:before {left: auto; right: 0;}
.about .about-block-bottom {z-index: 1; position: relative;}
.about .number-wrap{margin-bottom: .25rem; margin-left: 0.25rem; height: calc(100% - 0.25rem); width: calc(100% - 0.25rem);  color: rgb(var(--color_white));}
.about .number-wrap .number {font-size: clamp(2.125rem, 1.55rem + 2.875vw, 5rem); font-family: var(--baseFontLight); color: rgb(var(--color_white)); display: inline-block; position: relative; line-height: 1.2;}
.about .number-wrap .number::after{content: "+"; position: absolute; right: -15px; top: -15px; font-size: 2.43rem; font-family: var(--baseFontMedium);}
.about .number-wrap .text{font-size: clamp(1rem, 0.8625rem + 0.6875vw, 1.6875rem); padding-top: 1rem; display: block; position: relative;}
.about .number-wrap .text::before{content: ""; width: 100%; height: 2px; background-color: rgb(var(--color_white)); display: block; position: absolute; top: 0; left: 0; right: 0; margin: 0 auto;}

.solutions .solutions-block-inner:before {content: ''; position: absolute; right: 0; top: -240px; width: 50%; height: calc(100% + 240px); background: #FFF3F8;}
.solutions .solutions-block-inner:after{content: ""; position: absolute; width: 50%; height: calc(100% + 241px); background-image: url('../images/shape02.png'); background-repeat: no-repeat; background-position: right top; top: -241px; right: 0; z-index: 0; background-size: cover;}
.solutions .block-wrapper {width: 370px;}
.solutions .block-wrapper .col-6:first-child {margin-top: 80px;}


.pic {overflow: hidden;}
.pic img {transition: 0.4s;}
.pic:hover img {transform: scale(1.08);}
.ratio img {object-fit: cover;}

.block {width: 140px; height: 170px; background: rgb(var(--color_white)); box-shadow: 0px 15.581px 23.971px 0px rgba(0, 0, 0, 0.08); display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0 auto var(--mb); transition: 0.4s; z-index: 1;}
.block .caption {font-size: 1.125rem; text-align: center; line-height: 1.2; transition: transform 0.4s;}
.block:hover {background: linear-gradient(45deg,  #0a98e2 0%,#a83099 51%,#f58825 100%) !important;  color: rgba(var(--color_white));}
.block:hover .icon {fill: rgb(var(--color_white)); transform: translateY(5px); transition: 0.4s;}
.block:hover .icon img {filter: brightness(0) invert(1);}
.block:hover .caption {transform: translateY(-5px);}

/* application-block */
.application-block {background: url('../images/application-bg.webp') center top / cover no-repeat; position: relative;}
.application-block h2.title.has-line:before{margin: 0 auto; right: 0;}
.app-item * {transition: all .3s linear;}
.app-item .pic-wrap{height: 200px; display: flex; justify-content: flex-end;}
.app-item .pic-wrap img{width: auto; display: block; margin: 0 auto;}
.app-item::before{content: ""; transition: all .3s linear; display: block; height: 115px;  left: 0; top: 0; width: 100%; position: absolute; z-index: 0;}
.app-item.item01::before{background-color: rgb(var(--primary1));}
.app-item.item02::before{background-color: #D5216E;}
.app-item.item03::before{background-color: #7837B2;}
.app-item.item04::before{background-color: #109EEB;}
.app-item .item-inner{position: relative; z-index: 1; padding: 20px;}
.app-item .item-inner .icon{content: ""; position: absolute; right: 15px; bottom: 15px;}
.app-item .item-inner .icon svg {width: 22px;}
.app-item .item-inner .icon img{filter: var(--imgPrimary4);}
.app-item .item-inner .application-name{font-size: clamp(1rem, 0.8875rem + 0.5625vw, 1.5625rem); line-height: normal;}
.app-item:hover::before{height: 170px;} 
.app-item:hover .pic-wrap img{transform: scale(1.1);}
.application-block .view-link{margin-top: 5.5rem;}
.application-block .view-link:hover{font-family: var(--baseFontBold);}
.application-block .style01 .owl-nav {position: absolute; left: 0; right: 0; text-align: center; bottom: calc(var(--padding) * -1); margin: 0 auto; display: flex; justify-content: center;}

/* solutions-block */
.solutions-block .ratio{position: relative; z-index: 2;}
.solutions-block .ratio img{width: 100%;}
.solutions-block .ratio:last-child{margin-bottom: 0 !important;}
.solutions-block .ratio *{transition: all .3s linear;}
.solutions-block .ratio:hover img{transform: scale(1.1);}
.solutions-block .first-block::after{content: ""; z-index: 0; position: absolute; right: 0; top: 0; width: 130px; height: 100%; background-color: rgb(var(--color_white));}
.solutions-block .first-block ul{margin: 0 0 1rem; padding: 0; list-style: none;}
.solutions-block .first-block ul li{position: relative; padding-right: 1rem;}
.solutions-block .first-block ul li::after{content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 9px; height: 9px; background-color: #5C62BC;}
.solutions-block .first-block .btn-custom{background-color: transparent !important; color: rgb(var(--color_black));}
.solutions-block .first-block .btn-custom:hover{color: rgb(var(--color_white)) !important;}
.solutions-block .second-block{flex-direction: column;}
.solutions-block .second-block .read-more{right:1.5rem; top: 2rem;}
.solutions-block .second-block .read-more img {filter: var(--imgPrimary4);}

/* technology-slider */
.technology-slider .item .text{ padding: 1.5rem; font-size: clamp(0.875rem, 0.8rem + 0.375vw, 1.25rem); position: absolute; left: 0; bottom: 0;}
.technology-slider .owl-nav {display: none !important;}
.technology-slider.owl-carousel.style01 .owl-dots{right: 2rem; bottom: 2rem;} 

/* news-block */
.news-block{position: relative; margin-bottom: var(--padding);}
.news-block::before{content: ""; display: block; width: 42vw; position: absolute; left: 0; top: 0; height: 100%; max-width:820px; background-color: rgb(var(--primary4));}
.news-block::after{content: ""; position: absolute; width: 100%; height: 100%; background-image: url('../images/shape.png'); background-repeat: no-repeat; background-position: 0 0; top: 0; left: 0; z-index: 0;}
.news-content{position: relative; z-index: 1; width: 390px; margin-left: auto; text-align: left;}
.news-block h2.title.has-line:before{background-color:rgb(var(--color_white));}
.news-block .view-link{right: 20%; top: calc(var(--padding) * -1); z-index: 1;}
.news-content .btn-custom{background-color: transparent !important; padding: 0; color: rgb(var(--color_white)); text-transform: uppercase;}
.news-content .btn-custom:hover,.news-content .btn-custom:focus,.news-content .btn-custom:active{background-color: transparent !important; color: rgb(var(--color_black));}
.news-content .btn-custom::before{display: none;}


.news-slider .item{padding: 20px; position: relative; z-index: 2;}
.news-wrapper{padding: 20px; position: relative; z-index: 2;}
.news-item::before{ content: ""; width: 100%; height: 100%; position: absolute; left: 0; right: 0; top: 70px; background-color: #EFF9FF; z-index: -1;}
.news-wrapper .news-item::before{height: calc(100% - 70px);}
.news-item:hover .ratio img{transform: scale(1.1);}
.news-item .date{font-size: 14px;}
.news-item p{font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);}
.news-item *{transition: all .3s linear;}
.news-item .btn{white-space: nowrap;}
.news-item .btn::before{display: none;}
.news-item .btn:hover{color: rgb(var(--primary1)) !important;}
.news-item .btn-custom img {width: 22px; height: 22px; vertical-align: middle; filter: var(--imgPrimary4);}
.news-slider .owl-nav{position: absolute; bottom: calc(var(--padding) * -1); right: 20% !important; left:auto !important; display: flex;}

/* footer */
.totop {bottom: 30px; cursor: pointer; display: flex; align-items: center; justify-content: center; transform: rotate(-90deg); width: 45px; height: 45px; position: fixed; right: -60px; z-index: 99; background-color: rgb(var(--color_white)); text-align: center; opacity: 0; border-radius: 50%; box-shadow: 0px 10px 29.7px 3.3px rgba(0, 0, 0, 0.2);}
.totop img {filter: var(--imgPrimary2);}

.footer .top .container{background-repeat: no-repeat; background-position: center top; background-size: cover; height: 256px; display: flex; align-items: center;}
.footer .top .info{padding: 0 70px;}
.footer .top .info .btn-custom{background-color: rgb(var(--color_white)); color: rgb(var(--color_black));}
.footer .top .info .btn-custom:hover{color: rgb(var(--color_white)) !important;}
.footer .middle .f-logo{display: block;}
.footer .middle p{color: #5C6574; text-align: justify;}
.footer .middle p a{display: block; text-decoration: underline; color: #5C6574; text-underline-offset:4px}
.footer .middle p a:hover{color:rgb(var(--color_black));}
.footer .middle h3{text-transform: uppercase; font-size: 14px; color: #101A24;}
.footer .middle h3 a{color: #101A24; text-decoration: none;}
.footer .middle ul li{margin-bottom: 1rem;}
.footer .middle ul li a{position: relative; left: 0; transition: all .2s linear; text-decoration: none; color: #5C6574;}
.footer .middle ul li a:hover,.footer .middle ul li a:focus{color: rgb(var(--color_black)); left: 5px;}

.footer .bottom .bottom-block{padding: 30px 0; border-top: 1px solid rgba(var(--color_black),0.5);}
.footer .bottom {font-size: 1rem;}
.footer .bottom .social-media li{margin: 0 10px;}
.footer .bottom .social-media li a{width: 35px; height: 35px; border-radius: 50px; display: flex; align-items: center; justify-content: center; border: 1px solid transparent; transition: all .2s linear;}
.footer .bottom .social-media li a:hover{border:1px solid rgb(var(--color_black));}

.footer .bottom a{color:#5C6574; text-decoration: none;}
.footer .bottom .bottom-block a:hover{color:rgb(var(--color_black));}
.footer .bottom .links a{ margin-left: 20px; text-underline-offset: 5px; font-family: var(--baseFontMedium);}

/* inner pages styles */
.breadcrumb {--bs-breadcrumb-divider-color: rgba(var(--color_white)); --bs-link-color: rgba(var(--color_white)); --bs-link-hover-color: rgba(var(--color_white)); position: relative; z-index: 1;}
.breadcrumb .breadcrumb-item a {text-decoration: none; text-underline-offset: 4px;}
.breadcrumb .breadcrumb-item.active {color: rgb(var(--color_white));}
.breadcrumb .breadcrumb-item a:hover {text-decoration: underline;}
.blog-page .breadcrumb-wrapper{position: relative;}
.blog-page .breadcrumb-wrapper::before{content: "";
    position: absolute;
    top: -100%;
    height: 200%;
    display: block;
    width: 100%;
    z-index: 0;
    background: linear-gradient(45deg, #0a98e2 0%, #a83099 51%, #f58825 100%);}
.main-top-bg:before{content: "";
    position: absolute;
    top: -100%;
    height: 200%;
    display: block;
    width: 100%;
    z-index: 0;
    background: linear-gradient(45deg, #0a98e2 0%, #a83099 51%, #f58825 100%);
  }
.main-top-bg::after{
    content: "";
    position: absolute;
    top: -80%;
    right: 0;
    background-image: url(../images/shape.png);
    background-repeat: no-repeat;
    background-size: cover;
    min-width: 821px;
    height: 594px;
    background-position: center bottom;
    display: none;
}

.highlight-text{min-height: 100px;}

.img-text-block {width: 110%;}

.address-wrapper .icon img{filter: var(--imgPrimary1);}

.address-wrapper p a{color: inherit; text-decoration: none;}

ul.style1 li {position: relative; padding-left: 24px; margin-bottom: 10px;}
ul.style1 li:before {content: ''; position: absolute; left: 0; top: 4px; background: url('../images/check-sign-icon.svg') left top no-repeat; width: 15px; height: 15px; filter: var(--imgPrimary2);}
ul.style1.half-list{display: flex; flex-wrap: wrap;}
ul.style1.half-list li{width: 48%;}


.border-clr-1{border: 1px solid rgb(var(--primary1));}
.border-clr-2{border: 2px solid rgb(var(--primary1));}


.package-item{box-shadow: 0px 15.581px 23.971px 5px  rgba(var(--color_black),0.05); border-radius: 0;}
.package-item .row{height: 100%;}
.package-item .icon{height: 100%; display: flex; align-items: center; justify-content: center;}

/* product-block */
.product-block .item * {transition: all .3s linear;}
.product-block .item{margin-bottom: var(--padding); height: calc(100% - var(--padding)); box-shadow: 0px 15.581px 23.971px 7px rgba(var(--color_black), 0.05);}
.product-block .item .pic-wrap{height: 280px; display: flex; align-items: flex-end;}
.product-block .item .pic-wrap img{width: auto; padding: 1.5rem; height: 100%; display: block; margin: 0 auto; margin-top: auto;}
.product-block .item::before{content: ""; transition: all .3s linear; display: block; height: 190px; background-color: rgb(var(--primary4)); left: 0; top: 0; width: 100%; position: absolute; z-index: 0;}
.product-block .item .item-inner{position: relative; z-index: 1; padding: 20px;}
.product-block .item .item-inner .icon{content: ""; position: absolute; right: 15px; bottom: 15px;}
.product-block .item .item-inner .icon svg {width: 22px;}
.product-block .item .item-inner .icon svg path {width: auto; fill: rgba(var(--primary1));}
.product-block .item .item-inner .application-name{font-size: clamp(1rem, 0.8875rem + 0.5625vw, 1.5625rem);}
.product-block .item:hover::before{height: 250px;} 

.infra-list li{font-size: clamp(1rem, 0.8875rem + 0.5625vw, 1.5625rem); font-family: var(--baseFontBold);}

.product-block.style02 .item{margin-bottom1: 1.5rem; height1: auto;}
.product-block.style02 .item .pic-wrap img{height: 100%;}
.product-block.style02 .item .item-inner .icon{position: relative; right: 0; bottom: 0;}
.product-block.style02 .item .item-inner .icon img{filter: var(--imgPrimary4);}
.product-slider.style01 .itme .pic-wrap img{height: auto;}
.product-slider.style01 .item .item-inner .icon{position: relative; right: 0; bottom: 0;}
.product-slider.style01 .item .item-inner .icon img{filter: var(--imgPrimary4);}


.cust-tabs-outer{position: relative;}
.cust-tabs-outer::before{content: ""; position: absolute; background-color: rgb(var(--color_white)); height: var(--padding); left: 0; top: 0; width: 100%; display: block;}
.cust-tabs .block{height: 170px; margin-bottom: 0;}
.cust-tabs .block .caption{font-size:1.125rem;}
.cust-tabs .nav-link{color: inherit; background-color: rgb(var(--color_white)); position: relative; }
.cust-tabs .nav-link.active,.cust-tabs .nav-link.active .block,.cust-tabs .nav-link:hover,.cust-tabs .nav-link:focus{color: rgb(var(--color_white));
  background: linear-gradient(45deg,  #0a98e2 0%,#a83099 51%,#f58825 100%) !important; 
}
.cust-tabs .nav-link.active .block .icon img{filter: brightness(0) invert(1);}
.cust-tabs .nav-link.active .block .caption{color: rgb(var(--color_white));}
.cust-tabs .nav-link.active .block .caption{transform: translateY(-5px);}
.cust-tabs .nav-link.active .block .icon{transform: translateY(5px);}

.cust-tabs.style02 li{position: relative;}
.cust-tabs.style02 li::after{content: ""; background: url('../images/arrow-right.png') no-repeat 0 0; filter: var(--imgPrimary2); width: 27px; height: 22px; display: block; position: absolute; right: -40px; top: 50%; transform: translateY(-50%);}
.cust-tabs.style02 li:last-child::after{display: none;}
.cust-tabs.style02 .block{height: 185px;}
 
.cust-tabs.style03 .block{flex-direction: row; width: auto; height: 120px; padding: 1.2rem; margin: 0 auto; gap: 0.5rem; background-color: transparent;}
.cust-tabs.style03 .nav-link .block .caption{text-align: left;}

/* support-form */
.form-control{ border-radius: 0; border: none; border-bottom: 1px solid #676767; padding: 10px 0; background-color: transparent;}
.form-control:focus{box-shadow: none; background-color: transparent; border-color: rgb(var(--primary2));}
textarea.form-control{resize: none; height: 115px;}


form .input-group.custom-file-button {position: relative; border-bottom: 1px solid #676767;}
.input-group .input-group-text.upload-text {background-color: transparent; border: none; padding: 10px 0; height: auto; background-image: url(../images/upload-text.png); background-repeat: no-repeat; width: 93px; padding: 17px 0;}
.form-select{padding: 10px 5px;}
.custom-file-button input[type=file] {margin-left: -2px !important;}
.custom-file-button input[type=file]::-webkit-file-upload-button {display: none;}
.custom-file-button input[type=file]::file-selector-button {display: none;}
.custom-file-button:hover label {cursor: pointer;}


.quality-wrap{border: 5px solid #D4E1E9;}
.quality-wrap p{margin-bottom: 0;}

.img-block {position: relative; padding-top: 120%;}
.img-block img{ position: absolute; width: 100%; height: 100%; object-fit: cover; left: 0; top: 0;}

/* product-slider */
.product-item * {transition: all .3s linear;}
.product-item { margin: 1rem; box-shadow: 0px 6px 12px 5px rgba(var(--color_black), 0.05); height: calc(100% - 2rem);}
.product-item .pic-wrap{height: 200px; display: flex; justify-content: flex-end;}
.product-item .pic-wrap img{width: auto; display: block; margin: 0 auto;}
.product-item::before{content: ""; transition: all .3s linear; display: block; height: 115px;  left: 0; top: 0; width: 100%; position: absolute; z-index: 0;}
.product-item.item01::before{background-color: rgb(var(--primary1));}
.product-item.item02::before{background-color: #D5216E;}
.product-item.item03::before{background-color: #7837B2;}
.product-item.item04::before{background-color: #109EEB;}
.product-item .item-inner{position: relative; z-index: 1; padding: 20px;}
.product-item .item-inner .icon img{filter: var(--imgPrimary4);}
.product-item .item-inner .application-name{font-size: clamp(1rem, 0.925rem + 0.375vw, 1.375rem); line-height: normal;}
.product-item:hover::before{height: 170px;} 
.product-item:hover .pic-wrap img{transform: scale(1.1);}
.product-slider.style01 .owl-nav {position: absolute; left: 0; right: 0; text-align: center; bottom: 0; margin: 0 auto; display: flex; justify-content: center;}
.product-slider.product-block .item{margin:1rem 1rem var(--padding); box-shadow: 0px 6px 12px 5px rgba(var(--color_black), 0.03);}
.product-slider.product-block .item .pic-wrap{height: 220px; display: flex; justify-content: center;}
.product-slider.product-block .item .pic-wrap img {margin-top: 0; margin-bottom: auto;}
.product-slider.product-block .item .item-inner .application-name{font-size: clamp(1rem, 0.925rem + 0.375vw, 1.375rem); line-height: normal;}


.application-list a{color: inherit; padding: 0 16px; margin-bottom: 20px; text-decoration: none; border-right: 1px solid rgba(var(--color_black),0.2);}
.application-list a:last-child{border-right: none;}
.application-list a .icon img{filter: var(--imgPrimary4);}

.experience-block .item{box-shadow: 0px 15.581px 23.971px 5px  rgba(var(--color_black),0.05); margin-bottom: calc(var(--padding) / 3); height: calc(100% - calc(var(--padding) / 3));}
.experience-block .item .title{font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);}

.product-pic img{aspect-ratio: 800/600; object-fit: contain;}

.common-slider.style01 .owl-dots{
  left: 0; justify-content: center; margin: 0 auto;
}