.nav{
  margin-top:15px;
  float:right;
}
.nav li{
  float:left;
  margin:20px;
  font-size:22px;
}
/* greek-ext */
@font-face {
  font-family: 'Taviraj';
  /*src:url(../fonts/taviraj.ttf);*/
}

/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: local('Roboto'), local('Roboto-Regular'), local('sans-serif'), url(../fonts/kfomcnqeu92fr1mu72xkktu1kvnz.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: local('Roboto'), local('Roboto-Regular'), local('sans-serif'), url(../fonts/kfomcnqeu92fr1mu5mxkktu1kvnz.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: local('Roboto'), local('Roboto-Regular'), local('sans-serif'), url(../fonts/kfomcnqeu92fr1mu7mxkktu1kvnz.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: local('Roboto'), local('Roboto-Regular'), local('sans-serif'), url(../fonts/kfomcnqeu92fr1mu4wxkktu1kvnz.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: local('Roboto'), local('Roboto-Regular'), local('sans-serif'), url(../fonts/kfomcnqeu92fr1mu7wxkktu1kvnz.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: local('Roboto'), local('Roboto-Regular'), local('sans-serif'), url(../fonts/kfomcnqeu92fr1mu7gxkktu1kvnz.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: local('Roboto'), local('Roboto-Regular'), local('sans-serif'), url(../fonts/kfomcnqeu92fr1mu4mxkktu1kg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: auto;
  src: local('Roboto Medium'), local('Roboto-Medium'), local('sans-serif-medium'), url(../fonts/kfolcnqeu92fr1mmeu9fcrc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: auto;
  src: local('Roboto Medium'), local('Roboto-Medium'), local('sans-serif-medium'), url(../fonts/kfolcnqeu92fr1mmeu9fabc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: auto;
  src: local('Roboto Medium'), local('Roboto-Medium'), local('sans-serif-medium'), url(../fonts/kfolcnqeu92fr1mmeu9fcbc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: auto;
  src: local('Roboto Medium'), local('Roboto-Medium'), local('sans-serif-medium'), url(../fonts/kfolcnqeu92fr1mmeu9fbxc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: auto;
  src: local('Roboto Medium'), local('Roboto-Medium'), local('sans-serif-medium'), url(../fonts/kfolcnqeu92fr1mmeu9fcxc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: auto;
  src: local('Roboto Medium'), local('Roboto-Medium'), local('sans-serif-medium'), url(../fonts/kfolcnqeu92fr1mmeu9fchc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: auto;
  src: local('Roboto Medium'), local('Roboto-Medium'), local('sans-serif-medium'), url(../fonts/kfolcnqeu92fr1mmeu9fbbc4amp6lq.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: auto;
  src: local('Roboto Bold'), local('Roboto-Bold'), local('sans-serif'), url(../fonts/kfolcnqeu92fr1mmwulfcrc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: auto;
  src: local('Roboto Bold'), local('Roboto-Bold'), local('sans-serif'), url(../fonts/kfolcnqeu92fr1mmwulfabc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: auto;
  src: local('Roboto Bold'), local('Roboto-Bold'), local('sans-serif'), url(../fonts/kfolcnqeu92fr1mmwulfcbc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: auto;
  src: local('Roboto Bold'), local('Roboto-Bold'), local('sans-serif'), url(../fonts/kfolcnqeu92fr1mmwulfbxc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: auto;
  src: local('Roboto Bold'), local('Roboto-Bold'), local('sans-serif'), url(../fonts/kfolcnqeu92fr1mmwulfcxc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: auto;
  src: local('Roboto Bold'), local('Roboto-Bold'), local('sans-serif'), url(../fonts/kfolcnqeu92fr1mmwulfchc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: auto;
  src: local('Roboto Bold'), local('Roboto-Bold'), local('sans-serif'), url(../fonts/kfolcnqeu92fr1mmwulfbbc4amp6lq.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: local('Roboto Black'), local('Roboto-Black'), local('sans-serif-black'), url(../fonts/kfolcnqeu92fr1mmyutfcrc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: local('Roboto Black'), local('Roboto-Black'), local('sans-serif-black'), url(../fonts/kfolcnqeu92fr1mmyutfabc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: local('Roboto Black'), local('Roboto-Black'), local('sans-serif-black'), url(../fonts/kfolcnqeu92fr1mmyutfcbc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: local('Roboto Black'), local('Roboto-Black'), local('sans-serif-black'), url(../fonts/kfolcnqeu92fr1mmyutfbxc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: local('Roboto Black'), local('Roboto-Black'), local('sans-serif-black'), url(../fonts/kfolcnqeu92fr1mmyutfcxc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: local('Roboto Black'), local('Roboto-Black'), local('sans-serif-black'), url(../fonts/kfolcnqeu92fr1mmyutfchc4amp6lbbp.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: local('Roboto Black'), local('Roboto-Black'), local('sans-serif-black'), url(../fonts/kfolcnqeu92fr1mmyutfbbc4amp6lq.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


h1.logo{
  margin:0px;
  text-indent:-999999px;
}
h2.icons-logoblue{
  margin: 0;
    display: inline-block;
  text-indent:-999999px;
}

.icons-logoblue {
    background-position: 0 -467px;
    height: 27px;
    width: 149px;
}

.icons-sprite, .icons-chk1, .icons-chk1Y, .icons-close, .icons-fb, .icons-fb2, .icons-job, .icons-lefta, .icons-leftb, .icons-link, .icons-location, .icons-logoblue, .icons-mail, .icons-mobile, .icons-pad, .icons-pc, .icons-plus, .icons-radio1, .icons-radio1Y, .icons-refresh, .icons-right, .icons-righta, .icons-rightb, .icons-search, .icons-twitter {
    background-image: url(../images/icons-s27d8cf56c0.png);
    background-repeat: no-repeat;
}
.icons-tel{ width: 25px; height: 25px; background:url(../images/sina.png) no-repeat; background-size: 100%;}
.icons-QQ{ width: 25px; height: 25px; background:url(../images/qq.png) no-repeat; background-size: 100%;}
.icons-wx{ width: 25px; height: 25px; background:url(../images/weixin.png) no-repeat; background-size: 100%;}
.icons-mail{width: 25px; height: 25px; background:url(../images/emailnew.png) no-repeat; background-size: 100%;}
.icons-map{width: 25px; height: 25px; background:url(../images/postionmap.png) no-repeat; background-size: 100%; }
.icons-icp{ width: 25px; height: 25px; background:url(../images/icp.png) no-repeat; background-size: 100%;  }
.icons-ipv6{width: 25px; height: 25px; background:url(../images/ipv6.png) no-repeat; background-size: 100%;}
.icons-QQ-wap{ display: none; }
@media (max-width: 641px) {
.icons-QQ-wap { display: block; }
.icons-QQ-pc { display: none; }

}

footer .icons-logoblue{ background: url(../images/logoblue.png) no-repeat; height: 30px; width: 90px; background-size: 100%;}
.projectbtn {
  margin-top: 40px;
  border-bottom: 1px solid #eee;
  position: fixed;
  width: 100%;
  bottom: 0;
  z-index: 1001;
  background: rgba(255, 255, 255, 0.9);
  -webkit-box-shadow: 0px -10px 20px -10px rgba(0, 0, 0, 0.18);
  -moz-box-shadow: 0px -10px 20px -10px rgba(0, 0, 0, 0.18);
  box-shadow: 0px -10px 20px -10px rgba(0, 0, 0, 0.18);
}
.projectbtn a:nth-child(2) {
  height: 40px;
  line-height: 40px;
  margin: 10px 160px;
}
.banner>.linear {
  opacity: 0.90;
  background: #2575fc;
  background: -webkit-linear-gradient(left, #2575fc, #37ecba);
  background: -o-linear-gradient(right, #2575fc, #37ecba);
  background: -moz-linear-gradient(right, #2575fc, #37ecba);
  background: linear-gradient(to right, #2575fc, #37ecba);
}
p.en {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
}
.about>div, .hidepc2>div {
  max-width: none;
}
.indexzone1 li:nth-child(2) {
  background: url(../images/servicebanner.png);
}
.ox>li>div a {
  width: 100%;
  height: 360px;
  display: block;
}
footer {
  
  border-top: 1px solid #eee;
  margin-top: 0px;
}
.container.white>div {
  padding-bottom: 0px;
}
header .logo {
  top: calc(8% + 40px);
  left: 16px;
}
header .hamburger {
  top: calc(8% + 40px);
}
.borders.left, .borders.top {
  top: 0;
  left: 0
}
.borders.bottom {
  bottom: 0;
  left: 0
}
.borders.right {
  top: 0;
  right: 0
}
.borders, .loader {
  position: fixed;
  z-index: 99999;
  background-color: #fff
}
/*************/
header.down .hamburger-inner, header.down .hamburger-inner:after, header.down .hamburger-inner:before {
  background-color: #000000;
}
header.down {
  background-color: #fff;
  z-index: 999999;
  color:#000;
  height:90px;
}
header.down>div {
  margin-top: 5px;
  height: 110px;
}
header.down>div .logo {
  top: 4px;
  left: 16px;
  background-image: url(../images/logoblue.png);
  background-size: cover;
  background-position: 0;
}
header.down>div .hamburger {
  top: calc(8% + 0px);
}
header.inside.down {
  background-color: rgba(255,255,255,1);
  z-index: 999999;
  border-bottom: 1px solid #f6f6f6;
  height:120px;
}
header.down>div {
  margin-top: 5px;
  height: 70px;
}
header.inside .logo {
  background-image: url(../images/logow.png);
  background-size: cover;
  background-position: 0;
}
.casebtns {
  margin-bottom: 40px;
}
h2.slogan {
  margin-left: calc((100% / 12 ));
  margin-top: 30px;
  font-size: 90px;
}
.container>div.project>img {
  padding-top: 20px;
  padding-bottom: 5px;
}
.ques.q2>ul>li textarea, .ques.q2>ul>li input[type='text'], .ques.q4>ul>li textarea, .ques.q4>ul>li input[type='text'] {
  padding: 10px 10px;
}
/***border4*************/
@media (max-width: 1700px) {
header .logo {
  left: 5%;
}
header .hamburger {
  right: 4%;
}
header.down>div .logo {
  left: 5%;
}
.container.grey>div {
 width: calc( 90% - ( 8px * 2 ) );
  padding-bottom: 30px;
}
}
 @media (max-width: 1600px) {
}
@media (max-width: 1500px) {
.ques.q4>ul {
  margin-top: 0;
  padding: 0;
  background-color: transparent;
}
.ques {
  padding-left: 0;
  padding-right: 0;
}
h2.slogan {
  margin-left: 0;
  margin-top: 30px;
  font-size: 80px;
}
.case-top{
  margin-left: 0;
}
}
 @media (max-width: 1200px) {
h2.slogan {
  font-size: 50px;
}
.servicei {
  margin-top: 50px;
}
}
@media only screen and (max-width:1024px) {
.ques hr {
  margin: 10px 0 20px 0;
}
.borders {
  display: none
}
footer {
  margin-bottom: 0px;
}
header>div {
  margin-top: 0px
}
.banner>.linear+div h2 {
  text-align: left;
  /*padding: 0 100px;*/
}
.casebtns {
  margin-bottom: 40px;
}
.container.grey>div {
 width: calc( 100% - ( 8px * 2 ) );
}
}
.borders.bottom, .borders.top {
  width: 100%;
  height: 20px
}
@media (max-width: 761px) {
header .hamburger {
  padding-top: 7px;
  padding-right: 8px;
  right: 0;
  top: 16px;
}
header .logo {
  left: 16px;
  top: 16px;
}
.banner>.linear+div h2 {
  /*padding: 0 40px;*/
}
header>div {
  margin-top: 16px;
}
h2.slogan {
  margin-left: 0;
  font-size: 32px;
}
.projectbtn {
  background: rgba(255, 255, 255, 1);
  margin-top: 40px;
}
.projectbtn a:nth-child(2) {
  width: 70px;
  margin: 10px 30px;
  height: 40px;
  line-height: 40px;
}
#menu>nav>ul>li>a {
  font-size: 30px;
  color: #ffffff;
  line-height: 180%;
}
.servicei {
  margin-top: 30px;
}
.container.white>div{
  padding-top: 30px;
}
.caseindex.inside {
    margin-top: 30px;
}
.btns.btn2, .btns.btn3{
  width:100%;
}
}
@media (max-width: 641px) {
header .logo {
  left: 16px;
  top: 8px;
}
header .hamburger {
  top: 8px;
}
header.down>div {
  margin-top: 5px;
  height: 54px;
}
header.down>div .logo {
       background-image: url(../images/mobile-logoblue.png) !important;
        background-size:100% !important;
        width:39px; 
        height:36px;
  }
.ldt>a>div {
  font-size: 50px;
}
.servicei>li {
  height: 340px;
}
.servicei>li article {
  padding: 30px 10px
}
.servicei>li article h1 {
  font-size: 25px;
}
.servicei>li article p {
  margin-top: 0px;
}

}
 @media only screen and (min-width:1280px) {
.total-wrapper {
  padding: 30px
}
.borders.bottom, .borders.top {
  height: 30px
}
}
@media only screen and (min-width:1441px) {
.total-wrapper {
  padding: 40px
}
.borders.bottom, .borders.top {
  height: 40px
}
}
.borders.left, .borders.right {
  width: 20px;
  height: 100%
}
@media only screen and (min-width:1280px) {
.borders.left, .borders.right {
  width: 30px
}
}
@media only screen and (min-width:1441px) {
.borders.left, .borders.right {
  width: 40px
}
}
.indexw{
  text-indent:-9999px;
      display: block;
    width: 100%;
    height: 1px;
    overflow: hidden;
}



ul.knowledge>li:first-child>article p {
   line-height: 180%;
   margin-bottom: 18px;
}

@media (max-width: 1024px){
  ul.knowledge>li:first-child>article p {
     line-height: 160%;
     margin-bottom: 18px;
  }

  ul.knowledge>li:first-child>article>h1 {
     font-size: 30px;
  }
}

.tags i a {
   background-color: #696969;
   padding: 5px 10px 3px 10px;
   margin-bottom: 8px;
   font-weight: normal;
   color: #f4f4f4;
   font-size: 12px;
}
.tags i a:hover{
  background: #604094;
}
ul.knowledge>li:nth-child(2) h3+ul+h3 {
   color: #604094;
}
ul.knowledge>li:nth-child(2) h3 {
   color: #604094;
}


@media (max-width: 1024px){
   ul.knowledge>li:first-child>article h2 {
       margin-bottom:18px;
       color: #0bbdc7
    }
}



.blogs {
   margin-top: 40px;
  margin-bottom: 30px;
}
.blogs>li {
   margin-bottom: 20px;
   overflow: hidden;
}
.blogs>li>a{
  border-top: 5px solid #333;
}
.blogs>li:hover {
   background: #fff;
   transition: all 0.6s ease;
   box-shadow: 0px 20px 50px -10px rgba(0,0,0,0.3);
}


.blogs ul{
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
        margin-top: 40px;
    margin-bottom: 30px;
  }
  .blogs ul li {
    margin-bottom: 20px;
    overflow: hidden;
        -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: calc(100% / 3);
    padding: 20px;
    text-align: left;
}
.blogs ul li a {
    border-top: 5px solid #333;
}
.blogs ul li span {
    font-family: "Taviraj","serif","arial","微軟正黑體";
    font-size: 12px;
}
.blogs ul li h4, .blogs ul li p {
    font-size: 18px;
    line-height: 140%;
    width: 100%;
    margin-left: 0;
}
.blogs ul li:hover {
    background: #fff;
    transition: all 0.6s ease;
    box-shadow: 0px 20px 50px -10px rgba(0,0,0,0.3);
}


@media (max-width: 1024px){
  ul.knowledge>li:nth-child(2) {
     margin-top: 40px;
  }
}

ul.knowledge>li:first-child>article{
   margin-bottom: 80px;
}
@media (max-width: 1024px){
  ul.knowledge>li:first-child>article {
     margin-bottom: 0;
  }
}

h2.slogan.clientname{
   line-height: 100%;
}
h3.projectIntro{
   font-size: 18px;
   line-height: 150%;
   margin-top: 15px;
}

@media (max-width: 1200px){
  h2.slogan.clientname{
    font-size: 50px;
  }
}
.links{  height: 24px; position: relative; float: right }
.link-con{ width: 100px; float:left; border:1px solid #444; margin-right: 0; margin-top: 5px; }
.links p{ float: left; display: inline-block; }
.links::after{ width:10px; height:4.7px;position: absolute; content: "";left: 78px; top: 15px; background: url(../images/jt-up.png) no-repeat; background-size: 100%; }
.links1::after{ width:10px; height:4.7px;position: absolute; content: "";left: 78px; top: 15px; background: url(../images/jt-up1.png) no-repeat; background-size: 100%;}
.link-con a{ margin-right: 0; font-size: 12px;}
.link-con .cn{ display: block; text-align: left; line-height: 20px; padding-left: 18px;}
.link-con .cn a{ color: #444; display: block;}
.link-con .en a:hover{ text-decoration: underline !important; color: #444;}
.link-con .links-box{ position: absolute; bottom:18px; width:100px; height: 124px; border:1px solid #444; padding:10px 0; left:0; }
.links-box-s{ overflow-y: scroll; height: 100px; padding-right: 8px; position: relative; display: inline-block;}
.links-box-s::-webkit-scrollbar{width: 1px !important; height:124px;  background-color: #F0F0F0;}   
.links-box-s::-webkit-scrollbar-track{ width: 1px !important;height:20px !important; background-color: #444 !important;}   
.links-box-s::-webkit-scrollbar-thumb{ width: 1px !important; height:20px !important; background-color: #444 !important} 
.link-con .en{ width:90px;  line-height:20px;-webkit-transition-duration:.6s;transition-duration:.6s;top:24px; left: 5px;} 
.link-con .en a{display:block;width:85px;color:#555;height:auto;cursor:pointer;text-align:center;text-indent:12px;-webkit-transition-duration:.6s;transition-duration:.6s;word-break: break-all; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
@media (max-width: 1200px){
  .links{ display: none; }

}
.FiveM{ width: 25%; float: left; padding: 0px 0;}
.FiveM .img{ display: inline-block; width: 149px; height: 149px; }
.FiveM .imggif,.FiveM:hover .imggif{ background: none; }
.FiveM .imggif{ position: relative; width: 106px;  height: 106px; }
.FiveM .imggif img{ position: absolute; width: 100%; max-width: 106px; left: 0; top: 0;bottom: 0;  right: 0;  margin: auto; -webkit-transition: all .3s ease-in-out;transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;}
.imggif1,.imggif:hover .imggif2,.Fon .imggif2{opacity:1;-webkit-opacity:1;-moz-opacity:1;filter:alpha(opacity=100); }
.imggif2,.imggif:hover .imggif1,.Fon .imggif1{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:alpha(opacity=0); }
.servicei2>li {
    width: calc( ( 100% - (16px * 4) ) /4 );
    margin: 0;
    margin-bottom: 55px;
    margin-right: 16px;
    height: auto;
    display: inline-block;
}
.servicei2>li article{ padding:0 27px !important; }
.servicei2>li div{ color: #000 !important; font-size: 20px !important; }
.servicei2>li article .img{ height: 106px !important; }
.servicei2>li:first-child,.servicei2>li:nth-child(2),.servicei2>li:nth-child(3),.servicei2>li:nth-child(4),.servicei2>li:last-child{ background-color: #fff !important; }

.mtnew{
  margin-top: 60px !important;
}
.mt40news{
  /*position: absolute;
  bottom: 0;*/
}
.mt40case{
  margin-top: -20px;
}

.caseindex>li:last-child, .caseindex>li:nth-last-child(2),{
    margin-bottom: 0;
}
.blogs>li:nth-child(28n), .blogs>li:nth-child(29n), .blogs>li:nth-child(30n) {
    margin-bottom: 0;
}
.blogs>li:last-child, .blogs>li:nth-last-child(2), .blogs>li:nth-last-child(3) {
    margin-bottom: 0;
}

@media screen and (max-width: 641px) {
  .FiveM { width: 100%;  padding: 10px 0; }
  .servicei2>li article{ padding:0 !important; }
  .mtnew{
    margin-top: 60px !important;
  }
  .container.grey>div{
    padding-bottom: 0;
  }

}
@media (max-width: 1200px) {
  .servicei2>li { width: calc( ( 100% - (16px * 2) ) /3 );  margin: 0;   margin-bottom: 60px;    margin-right: 16px;  }
}


@media (max-width: 1024px) {
  .servicei2>li article .img{ width: 100%; }
  .servicei2>li { width: 50%; margin: 0;  margin-bottom: 16px;  }
  .servicei2>li div{ font-size: 16px !important; }
}

@media ( max-width: 641px ) {
  footer .copyright>div {
    height: 110px;
    margin-top: -10px;
  }
  footer .copyright>div a{
    width: 100%;
    text-align: center;
    line-height: 1;
    color: #333;
  }

}
@media (max-width: 1700px) {
  .mtnew{
    margin-top: 30px !important;
  }
  .container.grey>div{
    padding-bottom: 30px;
  }
}

@media (max-width: 1200px) {
  .mt40news .casebtns{
    text-align: right !important;
  }
}
@media (max-width: 761px) {
  .mt40news{
    position: initial;
  }
  .mt40case{
    margin-top: -10px !important;
  }

}

/*2019-05-21新增*/
.case3 {
  width:1500px;
  display:table;
  padding:0 30px;
}
.case3 .left-box {
  width:45%;
  min-height:805px;
  float:left;
  padding-top:100px;
  padding-bottom:150px;
  position:relative;
}
.case3 .left-box .t-box {

}
.case3 .left-box .t-box .t1 {
  font-size:18px;
  color:#999;
  line-height:1;
}
.case3 .left-box .t-box .t2 {
  font-size:14px;
  line-height:26px;
  color:#222;
  margin-top:12px;
}
.case3 .left-box .sj-ewm {
  display:table;
  margin-top:54px;
}
.case3 .left-box .sj-ewm span {
  text-align:center;
  display:block;
  font-size:14px;
  line-height:26px;
  color:#222;
  margin-top:6px;
}
.case3 .left-box .goback {
  width:150px;
  height:50px;
  background:#222 url(../images/icon45.png) 30px center no-repeat;
  border-radius:25px;
  display:block;
  font-size:14px;
  line-height:50px;
  color:#fff;
  padding-left:58px;
  position:absolute;
  left:20px;
  bottom:90px;
}

.case3 .right-box {
  width:49%;
  float:initial;
  margin:auto;
  padding-top:20px;position: relative;
}
.case3 .txt-box { width: auto !important;  padding: 44px 0 44px!important;}

.images-scroll-wrap {
  width:396px;
  height:722px;
  background:url(../images/img24.png) center center no-repeat;
  overflow:hidden;
}
.images-scroll-wrap .item-list {
  width:360px;
  height:560px;
  margin:68px 18px;
  overflow:hidden;
  position:relative;
}
.images-scroll-wrap .item-list .swiper-slide-image {
  z-index:1;
    position:absolute;
    top:0;
    width:100%;
    opacity:0;
    transition:opacity .6s ease-in-out;
}
.images-scroll-wrap .item-list .swiper-slide-image.active { z-index:2;opacity:1;}
.work-buttons {
  position:absolute;
  right:0;
  top:239px;
  width:60px;
}
.work-buttons .count {
  width:100%;
  text-align:center;
  font-size:16px;
  color:#999;
  font-family: 'Gotham-Bold';
}
.work-buttons .count .current {
  color:#222;
}
.work-buttons .count .total {

}
.work-buttons .prograss-bar {
  margin-top:60px;
}
.work-buttons .prograss-bar .iconfont {
  width:60px;
  height:60px;
  border-radius:50%;
  margin-bottom:20px;
  display:block;
}
.work-buttons .prograss-bar .prev {
  background:#222 url(../images/icon46.png) center center no-repeat;
}
.work-buttons .prograss-bar .prev:hover {
  background:#21abd7 url(../images/icon46.png) center center no-repeat;
}
.work-buttons .prograss-bar .next {
  background:#222 url(../images/icon47.png) center center no-repeat;
}
.work-buttons .prograss-bar .next:hover {
  background:#21abd7 url(../images/icon47.png) center center no-repeat;
}

.left-case {
    width: 49%;
    float: left;
    padding: 30px;margin-right:1%;height:auto;
}
.right-case{ margin-left:1%;   width: 49%;
    float: right;padding: 30px;height:auto;}

.left-case .list li{    width: 100%;
    padding: 10px 0;}
.right-case .list li{    width: 100%;
    padding: 10px 0;}
.left-case .list li .t2,.right-case .list li .t2 {
    ,font-size: 14px;
    line-height: 24px;
    color: #222;
    margin-top: 0;
}
.left-case .list li .t2 em,.right-case .list li .t2 em{ width: 68%; float: left; font-style: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.left-case .list li .t2 i,.right-case .list li .t2 i{width: 30%; float: right;    text-align: right; }
.right-case .list li .tbox,.left-case .list li .tbox {
    padding-left: 0;
}
.left-case .list li:hover .t2,.right-case .list li:hover .t2{ text-decoration: underline !important;}
i{font-style:normal;}
.swiper-wechat{ display: none; }
/*2019-06-05新增案例*/
.case-top {
    margin-top: 20px;
    margin-bottom: -40px;
    margin-left: calc((100% / 12 ));
    overflow: hidden;
}
.case-top li {
    float: left;
    margin: 0 10px 2px 0;
    *margin-right: 10px;
    display: inline-block;
    position: relative;
    overflow: hidden;
    word-wrap: break-word;
}
.case-top li a{    
  height: 30px;
    display: inline-block;
    font-weight: bold;
    font-size: 15px;
    line-height: 30px;
    color: #383838;
    border: 1px solid #d2d2d2;
    padding: 0px 10px;
}
.case-top li a:hover,.case-top li a.on{background: #000;border: 1px solid #000;color: #fff;}
/*2019-06-15新增*/
.device h5{ 
  font-size: 14px;
  line-height: 100%;
  display: inline-block;
  position: relative;
  top:-4px;
}


@media screen and (max-width:761px) {

  .case3{ width: 100%; padding: 0 0; }
  .case3 .right-box{ width: 100%; }
  .info-img{ display: none; }
  .images-scroll-wrap{ width: 100%; height: auto; }
  .images-scroll-wrap .item-list{ width: 100%; height: auto;    margin: 0 0; }
  .swiper-wechat{ display: block; width: 100%; height: auto }
  .swiper-wechat img{ width: 100%; }
  .swiper-pagination-bullet-active{ background-color: #00a4ff !important;}


  .blogs ul li {
    width: 100%;
    padding: 20px 0 0;
  }
 .blogs>li:nth-last-child(2), .blogs>li:nth-last-child(3){
    margin-bottom: 20px;
  }
  .blogs>li:nth-child(28n), .blogs>li:nth-child(29n), .blogs>li:nth-child(30n){ margin-bottom: 20px; }

}


@media (max-width: 1500px){
    .case-top { margin-left: 0; }
}