﻿@charset "UTF-8";

@font-face {
  font-family: "SSP-Regular";
  src: url("../../fonts/SourceSansPro/SourceSansPro-Regular.ttf");
}
@font-face {
  font-family: "SSP-SemiBold";
  src: url("../../fonts/SourceSansPro/SourceSansPro-SemiBold.ttf");
}
@font-face {
  font-family: "Cabin-Regular";
  src: url("../../fonts/Cabin/Cabin-Regular.ttf");
}
@font-face {
  font-family: "Cabin-Medium";
  src: url("../../fonts/Cabin/Cabin-Medium.ttf");
}
@font-face {
  font-family: "Cabin-SemiBold";
  src: url("../../fonts/Cabin/Cabin-SemiBold.ttf");
}
@font-face {
  font-family: "Cabin-Bold";
  src: url("../../fonts/Cabin/Cabin-Bold.ttf");
}
@font-face {
  font-family: "Mt-Regular";
  src: url("../../fonts/Montserrat/Montserrat-Regular.ttf");
}
/**{font-family:ss,arial;}*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
html {color: #666666; height: 100%; overflow-x: auto; overflow-y: scroll; background:#FFFFFF;}
br{opacity: 0;background: transparent;color: transparent;}
img{ border:0;}
ol,ul,li{list-style:none;}
h1,h2,h3,h4,h5,h6 {font-size:100%;}
.tgd-technology{/*padding-bottom: 100px;*/}
.tgd-technology p{margin-bottom: 30px; font-size:18px; line-height: 24px; color:rgb(11, 11, 11); font-family: "SSP-Regular";}
.tgd-technology img{max-width: 100%; height: auto;}
.fullscreen,.tgd-wrapper{margin: 0 auto; width: 100%;}
.w1200{max-width: 1200px;}
.w1920,.tgd-wrapper{max-width: 1920px;}
.tgd-banner{position: relative;}
.tgd-subject{position: absolute; left:10%; top:29%;}
.tgd-subject .icon{margin-bottom: 10px; width:34px; height:39px; background: url(../images/circle.png); no-repeat; background-size: 100% auto;}
.tgd-subject h1{margin-bottom: 20px; padding-left: 5px; font-size: 87px; font-family: "SSP-SemiBold"; font-weight: bold; color: #fff; }
.tgd-subject p{font-size: 40px; font-family: "SSP-Regular"; color: #fff; padding-left: 5px;}
.tgd-bar{position: absolute; left: 0px; bottom: 0px; right: 0px;}
.tgd-mouse{position: absolute; left: 0px; right: 0px; bottom: 0px; text-align: center; animation: move 4s infinite linear;}
.tgd-title{margin-bottom: 30px;}
.tgd-title h2{display: flex; align-items: center; justify-content: center;  flex-direction: row; background: linear-gradient(90deg, rgba(40, 206, 234, 1) 0%, rgba(0, 103, 226, 1) 100%); -webkit-background-clip: text !important; -webkit-text-fill-color: transparent; font-family: "SSP-SemiBold"; font-weight: bold; font-size: 40px; text-transform: uppercase;}
.tgd-title h3{padding-bottom: 15px; font-size: 32px; color: #rgb(55, 55, 55); text-transform: uppercase; background: url(../images/line.png) no-repeat left bottom; font-family: "SSP-SemiBold";}
.tgd-photo{text-align: center;}
.tgd-intro{margin-bottom: 50px; width: 100%; display: table;}
.tgd-intro .text{width: 75%; display: table-cell; vertical-align: middle;}
.tgd-intro .img{width: 25%; display: table-cell; vertical-align: middle;}
.tgd-intro .text p:last-child{margin-bottom: 0px;}
.tgd-intro .text ul.desc{margin-bottom: 30px;}
.tgd-intro .text ul.desc li{padding-left: 20px; color: rgb(129, 129, 129); font-size: 16px; line-height: 24px; background: url(../images/dot.png) no-repeat 0px 10px;}
.tgd-video{margin:0 auto; width:100%; max-width:1000px; position: relative;}
.tgd-video iframe{width: 100%; height: 100%; position: absolute; left: 0px; top: 0px;}
.tgd-video span{position: absolute; left: 50%; top: 50%; margin-left:-50px; margin-top:-35px; width: 100px; height: 70px; cursor: pointer; background: url(../images/play.png) no-repeat;}
.active-deterrence{width: 100%; display: table;}
.active-deterrence .img1{width: 55%; display: table-cell; vertical-align: middle; text-align: center;}
.active-deterrence .img2{width: 45%; display: table-cell; vertical-align: middle; text-align: center;}
.tgd-table{width: 100%; display: table;}
.tgd-table .img1{width: 60%; display: table-cell; vertical-align: bottom; text-align: center;}
.tgd-table .img2{width: 40%; display: table-cell; vertical-align: bottom; text-align: center;}
.tgd-table .img3{width: 50%; display: table-cell; vertical-align: bottom; text-align: center;}
.tgd-table p{margin-bottom: 0px; margin-top: 5px; font-family: "Cabin-Medium";}
ul.tgd-challenge:before,
ul.tgd-challenge:after,
.solution-network ul:before,
.solution-network ul:after,
.tgd-application ul:before,
.tgd-application ul:after {
  display: table;
  content: " ";
}
ul.tgd-challenge:after,
.solution-network ul:after,
.benefit-container:after,
.tgd-application ul:after {
  clear: both;
}
.tgd-application{padding: 80px 0px 120px; background-color: rgb(250, 253, 255);}
.tgd-application p{text-align: center;}
.tgd-application .body{width: 100%; overflow: hidden;}
.tgd-application .pd20{padding-bottom: 20px;}
.tgd-application li{float: left; width: 50%; display: inline; text-align: center;}
.tgd-application li.c3{float: left; width: 33.3333%; display: inline; text-align: center;}
.tgd-application li p{margin-top: 8px; font-size: 16px; font-family: "Cabin-Medium";}
.tgd-application li p.desc{margin-top: 20px; font-size: 14px; color: #818181; text-align: left;}
.tgd-application li .story-name{margin: 0 auto; width: 100%; max-width:330px; text-align:left; clear: both;}
.tgd-application li .story-name p{margin-bottom: 0px; font-size: 16px; text-align: left;}
.tgd-application li p.country{float: right; width: 60%; text-align:right; font-size: 12px; line-height: 20px; font-family: "SSP-Regular"; border-top: 1px solid #333; color: #828282;}
.tgd-application .swiper-pagination{text-align: left;}
.tgd-application .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin:0px;}
.tgd-application .swiper-pagination-bullet-active{ background: #0b0b0b;}
.tgd-application .swiper-pagination-bullet{width: 80px; height: 2px; background: #c4c4c4; border-radius: 0px;}

.font-gradient{background: linear-gradient(90deg, rgba(1, 105, 226, 1) 0%, rgba(40, 206, 234, 1) 100%); -webkit-background-clip: text !important; -webkit-text-fill-color: transparent; letter-spacing: -0.3px;}
ul.tgd-challenge{width:100%;}
ul.tgd-challenge li{float: left; width:33.3333%; height:300px;  display: inline; box-sizing: border-box;}
ul.tgd-challenge li .block{margin: 0 auto; padding:50px 10px 20px; width: 260px; background-color:#fff;box-shadow: 0px 20px 30px #eee; border-radius: 10px; box-sizing: border-box; min-height: 330px;}
ul.tgd-challenge li .img{margin-bottom:20px; text-align:center; height:45px;}
ul.tgd-challenge li .img img{max-width:100%; height:auto;}
.tgd-technology ul.tgd-challenge li h3{margin-bottom: 10px; font-size:16px; color:#0b0b0b; font-family: "SSP-Regular";}
.tgd-technology ul.tgd-challenge li p{font-size:16px; line-height: 24px; color:#6f6f6f; font-family: "Mt-Regular";}
.tgd-text{max-width: 1000px; text-align: center;}
.tgd-overview p:last-child{margin-bottom: 60px;}
.sl-news{padding-top: 30px; width: 100%; display: table;}
.sl-news img{max-width: 100%; height: auto;}
.sl-news .photo{width: 40%; display: table-cell; vertical-align: top;}
.sl-news .text{width: 60%; display: table-cell; vertical-align: top; font-family: "SSP-Regular";}
.sl-news .text h3,.sl-news .text p{margin-left: 30px;}
.sl-news .text h3{margin-bottom: 10px; font-size: 20px; }
.sl-news .text p{margin-bottom: 10px; font-size: 16px; line-height: 24px;}
.sl-news .text a{font-size: 16px; font-weight: bold; background: linear-gradient(90deg, rgba(1, 105, 226, 1) 0%, rgba(40, 206, 234, 1) 100%); -webkit-background-clip: text !important; -webkit-text-fill-color: transparent; letter-spacing: -0.3px;}
.vcs-mask{position: absolute; left:0px; bottom:0px; top: 0px; right:0px; background: rgba(0, 0, 0, .5);}
.vcs-text{position: absolute; left:50%; top: 50%; margin-left: -100px; margin-top: -60px; padding: 10px 0px; color: #fff; font-size: 20px; font-family: "Mt-Regular"; text-align: center; line-height: 40px; border:2px solid #fff; border-radius: 8px; width:200px; height: 80px;}
.vcs-text strong{font-size: 32px; font-family: "SSP-SemiBold"; color: #fff;}

.ch-application,.product-links{margin: 0px auto;width: 100%;max-width: 1200px;}
.ch-application .appItem {margin-bottom: 60px;width: 100%;display: table;}
.ch-application .img {width: 43%;display: table-cell;vertical-align: top;}
.ch-application .textbox {width: 57%;display: table-cell;vertical-align: top;padding: 10px 0px 0px 55px;color: #333;}
.ch-application .img img {max-width: 100%;height: auto;border: 1px solid #ccc;}
.ch-application h3 {margin-bottom:15px; font-size: 24px;color: #0082cc; font-weight:normal;}
.ch-application h4 {margin: 25px 0px 10px;font-size: 16px;}
.ch-application h4:first-child {margin: 0px 0px 10px;}
.ch-application p {margin:0; padding-left: 18px;font-size: 16px;line-height: 30px;background: url(https://global.uniview.com/tres/images/colorhunter/ico_square_orange.png) no-repeat 2px 12px;}

.product-links ul{width:100%; display:table; vertical-align:top;}
.product-links li{width:33.3333%; display:table-cell; vertical-align:top;}
.product-links li a{margin:0 10px 10px; padding-bottom:20px; display:block; text-align:center; text-decoration:none; border:1px solid #eee;}
.product-links li a .btn-more{margin:10px auto 0px; width:90px; height:28px; font-size:14px; line-height: 28px; color: #fff; border-radius: 14px; text-decoration: none; text-align: center; background: linear-gradient(90deg, rgba(1, 106, 226, 1) 0%, rgba(39, 204, 234, 1) 100%);}
.product-links li a:hover{box-shadow: 0px 0px 20px #eee;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb50{margin-bottom: 50px;}
.mb80{margin-bottom: 80px;}
.mb100{margin-bottom: 100px;}
.mb150{margin-bottom: 150px;}
.mb200{margin-bottom: 200px;}

.cp-fecture{margin:0 auto; width:100%; max-width:1200px; display:table;}
.cp-fecture-item{width:30%; display:table-cell; text-align:center;}
.cp-fecture-item p{margin:0px; padding:30px 0px 20px; min-height:72px;}
.cp-fecture-item strong{font-size:18px; line-height: 24px; color:rgb(11, 11, 11);}
.cp-fecture-item img{max-width:100%; height:auto;}
@keyframes move {
  0% {
    bottom: 16%;
    opacity: 1;
  }
  50% {
    bottom: 18%;
    opacity: 0.7;
  }
  100% {
    bottom: 16%;
    opacity: 1;
  }
}
@-webkit-keyframes move {
  0% {
    bottom: 16%;
    opacity: 1;
  }
  50% {
    bottom: 18%;
    opacity: 0.7;
  }
  100% {
    bottom: 16%;
    opacity: 1;
  }
}
@media (max-width: 767px) {
.fullscreen{padding: 0px 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.tgd-title h2{font-size: 32px;}
.tgd-title h3{font-size: 24px;}
.tgd-technology p{margin-bottom: 30px; font-size:14px; line-height: 20px;}
.ch-application p {margin:0;}
.tgd-intro .text p.desc{font-size:14px;}
.tgd-subject h1{font-size: 48px;}
.tgd-subject p{font-size: 32px;}

.pd{padding: 0 20px;}

.customer_story{margin-bottom:50px; width:100%; display:block;}
.customer_story .photo, .customer_story .info{width:100%; display:block;}
.customer_story .photo{margin-bottom:30px;}
.customer_story .info .body{padding-left:0px; text-align:center;}

.cp-fecture{display:block;}
.cp-fecture-item{margin-bottom:50px; width:100%; display:block; text-align:center;}
.cp-fecture-item p{margin:0px; padding:10px 0px; min-height:auto;}
.cp-fecture-item:last-child{margin-bottom:0px;}
.mb80{margin-bottom: 50px;}
.mb150{margin-bottom: 100px;}
}
@media (max-width: 480px) {
.tgd-technology{padding-bottom: 50px;}
.tgd-title h2{font-size: 24px;}
.tgd-title h3{font-size: 18px; background-size: 36px auto;}
.tgd-subject .icon{margin-bottom: 0px; width: 14px; height: 16px;}
.tgd-subject h1{font-size: 28px; margin-bottom: 0px;}
.tgd-subject p{font-size: 16px;}
.tgd-mouse{animation: none;}
.tgd-mouse img{width: 20px; height: auto;}
.tgd-intro .text{width: 100%; display:block;}
.tgd-intro .img{width: 100%; display:block; text-align: center;}
.tgd-intro .img img{width: 60%;}
.tgd-intro .text ul.desc li{font-size: 14px; line-height: 20px;}
.tgd-table p{font-size: 12px;}
.tgd-application{padding: 30px 0px 50px;}
.tgd-application li p{font-size: 11px; line-height: 12px;}
.tgd-application li.c3{margin-top: 20px; float: none; width: 100%; display: block; text-align: center; clear: both;}

.tgd-application .swiper-pagination-bullet{width: 30px;}
ul.tgd-challenge li{float: none; margin-bottom: 20px; width:100%; height:auto;  display: block;}
ul.tgd-challenge li .block{width: 100%; min-height: auto;}

.sl-news{padding-top: 0px; width: 100%; display: block;}
.sl-news .photo,.sl-news .text{width: 100%; display: block;}
.sl-news .text h3,.sl-news .text p{margin-left: 0px;}
.sl-news .text h3{margin-bottom: 10px; margin-top: 10px; font-size: 20px; }
.sl-news .text p.more{text-align: center;}
.vcs-text{margin-left: -80px; margin-top: -50px; padding: 10px 0px; color: #fff; font-size: 16px; line-height: 30px; width:160px; height: 60px;}
.vcs-text strong{font-size: 24px;}

.customer_story{margin-bottom:50px;}
.customer_story .info h2{margin-bottom:20px; font-size:24px; line-height:32px;}

.ch-application .appItem {display: block;}
.ch-application .img {width: 100%;display: block;vertical-align: top;text-align: center;}
.ch-application .textbox {width: 100%;display: block;vertical-align: top;padding: 10px 0px 0px 0px;}
.product-links ul{display:block;}
.product-links li{width:100%; display:block;}
.product-links li a{margin:0px 0px 20px; padding-bottom:20px;}


.mb80{margin-bottom: 30px;}
.mb100{margin-bottom: 50px;}
.mb150{margin-bottom: 60px;}
}