
.container-fluid{ padding:0 6%;}
.fadein {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    position: fixed;
    left: 0;
    z-index: 999999999;
    top: 0;
    display: none;
}
.contact-msg {
    position: fixed;
    left: 50%;
    bottom: 50%;
    z-index: 3;
    transform: translate(-50%,50%);
    /* display: none; */
}
.banner-img{width:100%;}
header{position:fixed; top:0; z-index:1000; width:100%;}
header.nav-scroll{ background:rgba(1,1,1,0.5); }
.nav-container{ padding-top:1rem; padding-bottom:1rem;}
.nav-container .navbar-nav .nav-item{ padding-left:0.5rem; padding-right:0.5rem;}
.navbar-brand{
	position: relative;
    z-index: 11;
}
.hamburger {
	position: relative;
    z-index: 11;
    padding: 0;
    display: inline-block;
    cursor: pointer;
    transition-property: opacity, -webkit-filter;
    transition-property: opacity, filter;
    transition-property: opacity, filter, -webkit-filter;
    transition-duration: 0.75s;
    transition-timing-function: linear;
    font: inherit;
    color: inherit;
    text-transform: none;
    background-color: transparent;
    border: 0;
    margin: 0;
	opacity: 0.55;
    -webkit-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -moz-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -ms-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -o-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
}
.hamburger-box {
    width: 30px;
    height: 13px;
    display: block;
    margin: 0 auto;
    position: relative;
}
.hamburger--elastic .hamburger-inner {
    -webkit-transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -moz-transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -ms-transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -o-transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 24px;
    height: 1px;
    background-color: #ffffff;
    position: absolute;
	right: 0;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-duration: 0.15s;
    transition-timing-function: ease;
}
.hamburger-inner::before, .hamburger-inner::after {
    content: '';
    display: block;
}
.hamburger-inner::before {
    width: 15px;
    top: 0px;
}
.hamburger--elastic .hamburger-inner::before {
    top: 5px;
    -webkit-transition: opacity .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -moz-transition: opacity .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -ms-transition: opacity .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -o-transition: opacity .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    transition: opacity .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
}
.hamburger-inner::after {
    width: 9px;
    bottom: 0px;
	
}
.hamburger--elastic .hamburger-inner::after {
    top: 10px;
    -webkit-transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -moz-transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -ms-transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -o-transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    transition: all .275s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
}

.hamburger:hover{
	opacity: 1;
}
.hamburger:hover .hamburger-inner, .hamburger:hover .hamburger-inner::before, .hamburger:hover .hamburger-inner::after {
    width: 24px;
}
.hamburger--elastic.is-active .hamburger-inner {
    -webkit-transform: translateY(4px) rotate(135deg);
    -moz-transform: translateY(4px) rotate(135deg);
    -ms-transform: translateY(4px) rotate(135deg);
    -o-transform: translateY(4px) rotate(135deg);
    transform: translateY(4px) rotate(135deg);
}
.hamburger--elastic.is-active .hamburger-inner,.hamburger--elastic.is-active .hamburger-inner::after {
    width: 28px;
}
.hamburger--elastic.is-active .hamburger-inner::before {
    transition-delay: 0s;
    opacity: 0;
}
.hamburger--elastic.is-active .hamburger-inner::after {
    -webkit-transform: translateY(-10px) rotate(-270deg);
    -moz-transform: translateY(-10px) rotate(-270deg);
    -ms-transform: translateY(-10px) rotate(-270deg);
    -o-transform: translateY(-10px) rotate(-270deg);
    transform: translateY(-10px) rotate(-270deg);
}
#menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #0b0b0b;
    z-index: 10;
    display: none;
    opacity: 0;
}

.menu-container{ height:100%;}
.menu-contain{position:relative; color:#ffffff; height:100%; padding:100px 0;
/* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
	  /*
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
	  */
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
	  }
.menu-con{max-width:1200px; width:100%; padding-right:150px;}

.menu-left{ width:50%; float:left; padding-right:30px;}
.menu-right{ width:50%; float:right; padding-left:30px;}

.menu-contact{ font-size:16px;}
.menu-contact h1{ margin-bottom:2rem;}

.menu-navber{ list-style:none; color:#ffffff;}
.menu-navber .nav-item{ padding-left: 60px; margin-right:30px; position:relative; margin-bottom:60px;  display:inline-block;}
.menu-navber .nav-item:before{ content:""; border-bottom:1px solid #ffffff;display:block; width:0; position:absolute; left:0; top:50%;
	transition: width 0.5s;
	-moz-transition: width 0.5s; /* Firefox 4 */
	-webkit-transition: width 0.5s; /* Safari 和 Chrome */
	-o-transition: width 0.5s; /* Opera */}
.menu-navber .nav-item.is-hover:before{ width:35px;}
.menu-navber .nav-item .nav-link{ color:#ffffff; font-size:22px; display:inline-block;}
.menu-navber .nav-item img{ display:none;}

.menu-by{ position:absolute; text-transform:uppercase; max-width:90px; font-size:16px; bottom:80px; left:10px;}

.menu-img{ position:absolute; height:50%; width:25%; right:0; bottom:25%; z-index:-1;}
.menu-img img{ height:100%; width:auto; max-width:none;}
#menu-img{
  background: #000;
  position: absolute;
  z-index: 20;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
}

.banner-con{ position:relative; overflow:hidden;}
.banner-con-img{position:absolute; top:0; left:0; width:100%; height:100%; background-size:cover; background-repeat:non-repeat; background-position:center center;transform:scale(1.1,1.1); 
	transition: transform 2s;
	-moz-transition: transform 2s; /* Firefox 4 */
	-webkit-transition: transform 2s; /* Safari 和 Chrome */
	-o-transition: transform 2s; /* Opera */}
.banner-con:hover .banner-con-img{transform:scale(1.15,1.15);}

.banner-txt{ font-size:42px; color:#ffffff; position:absolute; line-height:64px;}

.banner-1-con{
	 /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
	  flex-direction: column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
}
.banner-1-txt{ text-align:center;}

.banner-pagination{ position:absolute; width:25%; bottom:5%; right:10%; color:#ffffff; z-index:100;
	display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
}
.pagination-point{
	width:100%; 
	display: flex;
    flex-wrap: inherit;
    align-items: center;
	justify-content: flex-end;
	position:relative;
}
.point-items {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    cursor: pointer;
    flex-wrap: wrap;
    position: relative;
    width: calc(80vw/4);
	max-width:100px;
}

.point-items .dot {
	display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    line-height: 7px;
    text-align: center;
	background-color: #ffffff;
    /*border:1px solid #ffffff;*/
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
}
.point-items.is-active .dot {
	background-color: #b00f13;
}
.point-items .pre-line {
    position: absolute;
    top: 5px;
    width: 100%;
    height: 1px;
    left: 50%;
	z-index:-1;
}

.point-items .pre-line:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #ffffff;
  animation-fill-mode: both;
  animation-duration: 2.8s;
  animation-timing-function: linear;
}
.point-items.is-active .pre-line-on {
	opacity:1;
}
.point-items .pre-line-on {
    position: absolute;
    top: 5px;
    width: 100%;
    height: 1px;
    left: 50%;
	z-index:-1;
	opacity:0;
}

.point-items.is-active .pre-line-on:after {
  animation-name: line_1;
}
.point-items .pre-line-on:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #b00f13;
  animation-fill-mode: both;
  animation-duration: 2.8s;
  animation-timing-function: linear;
}
.point-items:last-child .pre-line,.point-items:last-child .pre-line-on {
    display:none;
}
.point-items.go .pre-line-on {
  opacity: 1;
}
.point-items.go .pre-line-on:after {
  right: 0;
  left: auto;
  animation-duration: 0.8s;
  animation-name: line_2;
}

.banner-links{position:absolute; left:6%; bottom:30%; z-index:100;}
.banner-links-item{ position:relative; margin-bottom:1rem; background:rgba(12,12,12,0.6); color:#ffffff; font-size:16px; width:53px; height:53px; border-radius:100%; text-align:center; line-height:53px; cursor:pointer;}
.banner-links-item:hover{ background:#b00f13;}
.banner-links-item a{ color:#ffffff;}
.banner-scrolldown{ margin-bottom:2rem; background:#b00f13;}
.banner-scrolldown i{display:block; background:url(../images/icon-jt.png) no-repeat; background-size:cover; display:inline-block; width:15px; height:16px; }
.social-weixin .hover-img{ position:absolute; left:50px;width: 100px;max-width: none;top:0px; opacity:0;
	transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -ms-transition: all 1s;}
.social-weixin:hover .hover-img{ opacity:1; left:70px;}



@keyframes line_1 {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
@keyframes line_2 {
  0% {
    width: 100%;
  }
  100% {
    width: 0%;
  }
}
#mySVG {
  overflow: visible !important;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  // outline: 1px dotted #666;
  animation: rotate 20s linear infinite;
  opacity: 0.4;
}

path {
  stroke: #fff;
  stroke-width: 2px;
  fill: none;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}

.banner-2-txt{position:absolute; left:20%; bottom:30%;}
.container-title{ margin-bottom:1.5rem;}
.container-title h2{ font-weight:bolder; color:#111111;}

#application{ overflow:hidden;}
.application-container{ padding-top:100px;padding-bottom:100px;}
.application-p{ padding-right:200px; position:relative; padding-bottom:100px;}
.application-p-con{ max-width:1200px;}

.application-icon{ position:absolute; right:10px; top:0;position: absolute; width: 130px; height: 130px;  background: url(../images/icon-cicle.png) no-repeat; background-size: cover; 
	webkit-animation: rotate 16s linear infinite;
    animation: rotate 16s linear infinite;}

.application-items-con{
	display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    position: relative;
	}
	.app-items-nav{width: 300px; position:relative;}
	.app-items-lists{width: calc(100% - 300px);}

.app-items-lists-con{width: 200%;}
.app-item .app-details{display:none;}
.app-img img{ width:100%;}

.app-items-control{position:absolute; bottom:0;}
.app-items-btns{margin-bottom:1rem;}
.app-items-btns .app-button{ display:inline-block; font-size:22px; margin-right:30px; cursor:pointer;}
.app-items-name-en{ font-size:18px; text-transform:uppercase; letter-spacing:5px;}
.app-items-num{ font-size:18px; letter-spacing:5px;}
.app-items-line{
	position:relative;
    width: 96px;
    height: 1px;
	background-color: #eeeeee;
	display:inline-block;
	vertical-align: middle;
}

.app-items-line .pre-line:after {
  content: "";
  position: absolute;
  width: 0;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #b00f13;
  animation-fill-mode: both;
  animation-duration: 6s;
  animation-timing-function: linear;
}
.app-items-line.is-active .pre-line:after {
  animation-name: line_1;
}

.application-items-details{ margin-top:4rem; display:flex; width: calc(100% - 300px);    float: right;}
.app-details-name{ width:36%; text-align:center; font-weight:bolder; font-size:22px; }
.app-details-p{ width:64%; padding-left:30px; }
@-webkit-keyframes rotate {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}

	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn);
	}
}
@keyframes rotate {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}

	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn);
	}
}

#ggy{position:relative; background:url(../images/ggy-bg.jpg) center center no-repeat; background-size:cover; height:100vh; overflow:hidden;
		
}
.ggy-svg{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#ggy svg {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  will-change: transform;
}

#ggy svg text {
  font-weight: 700;
  font-size: 5px;
  
	dominant-baseline:middle;
	text-anchor:middle;
}

#ggy svg rect {
  fill: white;
}

#ggy svg > rect {
  -webkit-mask: url(#mask);
  mask: url(#mask);
}

.ggy-con{ background:rgba(0,0,0,0.6); width:100%; height:100%;
	  text-align: center;
	  color:#ffffff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;}
.solution .container-p{
	max-width:520px;
	margin-top:15px;
}
.solution .container-title h2{
	 color:#ffffff;
}
.solution-btns{ margin-top:3rem;}
.solution-btns .solution-btn{ display:inline-block; padding:10px; text-align:center;}
.solution-btns .solution-btn a{ display:block; background:#838383; color:#ffffff; min-width:130px; border-radius:6px; padding:5px;}
.solution-btns .solution-btn.contact a{ background:#b00f13;}


.case-container{ overflow:hidden; padding-top:100px; padding-bottom:100px;}
.case-serise ul{ padding-left:0;}
.case-serise ul li{ list-style:none; display:inline-block; margin-right:10px;}
.case-serise ul li a{ display:block; background:#eeeeee; color:#333333; text-align:center; padding:5px 10px; min-width:56px;}
.case-serise ul li a:hover,.case-serise ul li a.active{background:#b00f13; color:#ffffff;}

.case-items{ margin-left:-15px; margin-right:-15px; margin-top:30px;}
.case-item{ width:33.3%; float:left; padding:15px;}
.case-item a{ color:#333333;}
.case-item a .case-img{ overflow:hidden;}
.case-item a .case-img img{ width:100%;
    transition: transform 0.3s ease-out;
    -webkit-transition: transform 0.3s ease-out;
    -moz-transition: transform 0.3s ease-out;
    -o-transition: transform 0.3s ease-out;
    -ms-transition: transform 0.3s ease-out;}
.case-name{ font-size:16px; padding:10px 0; position:relative;}
.case-name p{ font-size:12px;}
.case-more{ position:absolute; right:0; top:30px; font-size:12px; text-transform:uppercase; padding-left:5px;}
.case-more i{}
.case-more i:after{content:""; position:absolute; top: 50%; right:100%; display:block; width:9px; border-bottom:1px solid #727272;
	transition: width 0.3s ease-out;
    -webkit-transition: width 0.3s ease-out;
    -moz-transition: width 0.3s ease-out;
    -o-transition: width 0.3s ease-out;
    -ms-transition: width 0.3s ease-out;
	}

.case-item a:hover .case-img img{ transform:scale(1.1);}
.case-item a:hover .case-more{ color:#b00f13; }
.case-item a:hover .case-more i:after{ width:30px; border-color:#b00f13;}

.case-viewall{ text-align:center; margin-top:20px;}
.case-viewall a{ display:inline-block; border-bottom:1px solid #333333; color:#333333; padding:5px 5px 5px 36px; position:relative;}
.case-viewall a:before{ content:""; position:absolute; top: 50%; left:0; display:block; width:9px; border-bottom:1px solid #727272;
	transition: width 0.3s ease-out;
    -webkit-transition: width 0.3s ease-out;
    -moz-transition: width 0.3s ease-out;
    -o-transition: width 0.3s ease-out;
    -ms-transition: width 0.3s ease-out;}
.case-viewall a:hover{ color:#b00f13;border-color:#b00f13;}
.case-viewall a:hover:before{width:30px; border-color:#b00f13;}

#case-brand{position:relative; height:600px; width:100%; overflow:hidden; background:#000;}
#case-brand .main, #case-brand .main div {
  width:100%;
  height:100%;
  max-height:880px;
  overflow:hidden;
  background:#000;
  position:absolute;
}

.case-brand-con{ color:#ffffff; position:absolute; z-index:10; top:30%; left:6%;}
.case-brand-con .container-title h2{ color:#ffffff;}
.case-brand-conner{ width:100%;}
.case-brand-conner .container-p{ max-width:380px;}

.news-container{ padding-top:100px; padding-bottom:60px;}
.news-items{ overflow:hidden;}
.news-item:first-child{ border-top:1px solid #eeeeee; }
.news-item{ border-bottom:1px solid #eeeeee; padding: 20px 0; position:relative; }
.news-item a{ color:#333333;}
.news-item a:hover .news-name,.news-item a:hover .news-time{ color:#b00f13;}
.news-item-con{ position:relative; display:flex;}
.news-item-con .news-img{ width:320px; }
.news-item-con .news-img-con{ overflow:hidden; }
.news-item-con .news-conner{ width:calc(100% - 320px); }
.news-item-con .news-img img{ width:280px; transition: transform 0.3s ease-out;
    -webkit-transition: transform 0.3s ease-out;
    -moz-transition: transform 0.3s ease-out;
    -o-transition: transform 0.3s ease-out;
    -ms-transition: transform 0.3s ease-out;}
.news-item a:hover .news-item-con .news-img img{ transform: scale(1.1);}
.news-conner .news-time{ font-size:16px;}
.news-conner .news-name{ font-size:18px; margin-bottom:10px;}

.news-item:hover>i{ 
	position: absolute;
	bottom: 0;
	left: 0;
    right: 0;
    height: 2px;
    transform: translateX(100%) translateX(3.75rem);
    -webkit-animation: bleamVAnimation infinite 4.3s cubic-bezier(0.77, 0, 0.175, 1);
    animation: bleamVAnimation infinite 4.3s cubic-bezier(0.77, 0, 0.175, 1);}
	
.news-item>i:before {
    content: "";
    transform: translateX(-100%);
    position: absolute;
    top: 0;
    left: 0;
    width: 3.75rem;
    height: 2px;
    background-color: #b00f13;
	margin-bottom: -1px;
}

@-webkit-keyframes bleamHAnimation {
  0% {
    transform: translateY(101%) translateY(3.75rem); }
  30% {
    transform: translateY(-1%); }
  100% {
    transform: translateY(-1%); } }

@keyframes bleamHAnimation {
  0% {
    transform: translateY(101%) translateY(3.75rem); }
  30% {
    transform: translateY(-1%); }
  100% {
    transform: translateY(-1%); } }

@-webkit-keyframes bleamVAnimation {
  0% {
    transform: translateX(-1%); }
  30% {
    transform: translateX(101%) translateX(3.75rem); }
  100% {
    transform: translateX(101%) translateX(3.75rem); } }

@keyframes bleamVAnimation {
  0% {
    transform: translateX(-1%); }
  30% {
    transform: translateX(101%) translateX(3.75rem); }
  100% {
    transform: translateX(101%) translateX(3.75rem); } }

footer{ background:#111111;}
.foot-container{ padding-top:60px; color:#ffffff;}
.foot-container a{ color:#ffffff;}
.foot-container a:hover{ color:#b00f13;}
.foot-1{ display:flex; border-bottom:1px solid #393939; padding-bottom: 30px;}
.foot-item{ width:20%; padding:15px;}
.foot-logo{ width:30%; }
.foot-link{ width:30%; }


.foot-item:first-child{ padding-left:0;}
.foot-item:last-child{ padding-right:0;}
.foot-case{ text-align:left;}
.foot-case a{ color:#ffffff; border-color:#ffffff;}
.foot-title{ margin-bottom:15px; text-transform:uppercase;}
.foot-link-con select{ width:100%; max-width:280px; border-radius:0; padding:5px 15px; background:none; color:#ffffff;
                border: solid 1px rgba(255,255,255,0.4);
                appearance:none;
                -moz-appearance:none;
                -webkit-appearance:none;
                background: url("../images/right-select.jpg") no-repeat scroll right top transparent;
                background-size: 38px 35px;
                padding-right: 0;
				}
.foot-link-con select option{color:#333333;}
.foot-service-con ul{ padding-left:0;}
.foot-service-con ul li{list-style:none;}
.foot-service-con ul li a{list-style:none; display:inline-block; border:1px solid #ffffff; padding:5px 15px;}
.foot-service-con ul li a:hover{ border-color:#b00f13;}
.foot-2{ display:flex; border-bottom:1px solid #393939; padding:60px 0;}
.foot-contact{ width:50%;}
.foot-nav{ width:50%; text-align:right; margin-top:10px;}
.foot-nav ul{ padding-left:0;}
.foot-nav ul li{list-style:none; display:inline-block; margin-left:15px;}
.foot-copyright{ padding:20px 0;}


.contact-con{ width:100%; height:100vh;}
.contact-map{ position:absolute; left:-50%; right:0; top:0; bottom:0;}
.contact-mess{
	width: 41.354%;
    position: absolute;
    right: 13.54%;
    top: 50%;
    transform: translateY(-50%);
    margin-top: .6rem;
    
	}
.contact-mess-con{ position:relative;
	background-color: #b00f13;
    color: #fff;
    padding: 10%;}
.contact-mess-con:before{ 
	position:absolute;
	content:"";
	left:-40px;
	transform: translateY(-50%);
	top:50%;
	width: 0;
    height: 0;
    border-right: 40px solid #b00f13;
    border-bottom: 20px solid transparent;
    border-top: 20px solid transparent;}
.contact-mess .contact-title h2{color: #fff;}
.contact-mess .contact-title p{ margin-top:1.5rem; max-width:330px;}

.news-serise{margin-bottom:2rem;}

.banner-news-view{ max-height:60vh;}
.banner-news-view-con{height:60vh !important;}

.container-con{ padding-top:100px; padding-bottom:120px;}

.news-view-title{ border-bottom:1px solid #eeeeee; padding-bottom:2rem; position:relative;}
.news-view-share{ position:absolute; right:0; top:26px;}
.news-view-share ul li{ list-style:none; display:inline-block; margin-left:10px;}
.news-view-share ul li a{ color:#333333; display:block; width:46px; height:46px; border:1px solid #eeeeee; font-size:16px; text-align:center; line-height:46px; border-radius:100%;}
.news-view-share ul li a:hover{ background:#b00f13; color:#ffffff; text-decoration:none;}

.news-view-more{ margin-top:2rem; border-top:1px solid #eeeeee; padding-top:1rem; display:flex; justify-content: space-between;align-items: center;}
.news-view-more-con{ font-weight:bolder; color:#111111; font-size:14px; line-height:30px;}
.news-view-more-con a:hover{ color:#b00f13;}
.news-view-ewm{ text-align:right;}
.news-view-ewm .news-view-ewm-name{font-weight:bolder; color:#111111; font-size:16px; margin-bottom:0.5rem;}

.case-view-container{ padding-bottom:200px !important;}
.case-view-img{ position:absolute; right:5%; z-index:10; bottom:8%; width:80%; text-align: right;}
.case-view-name{position:absolute; left:20%; z-index:11; top:30%; color:#ffffff; }
.case-view-name:before{content:""; display:block; width:60px; border-bottom:1px solid #ffffff; left:-100px; top:32px; position:absolute;}
.case-view-name p{ font-size:18px;}
.case-view-name a.case-view-link { width:52px; height:52px; display:block; border:1px solid #ffffff; border-radius:50%; overflow:hidden; margin-top:2rem}
.case-view-name a.case-view-link i{ font-size:18px;width:52px; height:52px; display:block; background:url(../images/icon-link.png) no-repeat; background-size:cover;; }
.case-view-name a.case-view-link:hover{background:#b00f13; border-color:#b00f13;}

.case-view-intro{ max-width:1200px; margin:auto;}
.case-view-txt{ padding-bottom:60px;}

.case-view-btns{ position:absolute; width:100%; z-index:100; left: 0; margin-top:60px;}
.more-fixed{ position:fixed; bottom:30px; -webkit-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -moz-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -ms-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -o-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;}
.more-fixed .container-fluid{ padding:0 2%; -webkit-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -moz-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -ms-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    -o-transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;
    transition: all .25s cubic-bezier(0.615, 0.19, 0.305, 0.91) 0s;}
.case-view-btns-con{display:flex;justify-content: space-between;align-items: center;}
.case-view-btns-con .btns{}
.case-view-btns-con .btns a{ display:inline-block; background:rgba(17,17,17,0.6); min-width:46px; height:46px; text-align:center; line-height:24px; padding:10px; border-radius:23px; color:#ffffff;}
.case-view-btns-con .btns a i{display:inline-block; width:24px; height:24px; background-repeat:no-repeat; background-size:cover; vertical-align: middle;}
.case-view-btns-con .btns-l a i{background-image:url(../images/icon-jt-left.png);}
.case-view-btns-con .btns-r a i{background-image:url(../images/icon-jt-right.png);}
.case-view-btns-con .btns-m a{ min-width:172px; margin-left:5px; margin-right:5px;}
.case-view-btns-con .btns-m a i{margin-right:10px;}
.case-view-btns-con .btns-m a.web i{background-image:url(../images/icon-web.png);}
.case-view-btns-con .btns-m a.xj i{background-image:url(../images/icon-kf.png);}
.case-view-btns-con .btns-m a.xj{background:rgba(176,15,19,0.9);}

.banner-about-txt span{
  display:block;
  vertical-align:middle;
  color: #fff;
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  border-right: .15em solid #ffffff; /* The typwriter cursor */
  white-space: nowrap; /* Keeps the content on a single line */
  -webkit-animation: 
    typing 2s steps(10, end),
    blink-caret 1s step-end infinite;
  animation: 
    typing 2s steps(10, end),
    blink-caret 1s step-end infinite;
}

/* The typing effect */
@-webkit-keyframes typing {
  from { width: 0 }
  to { width: 100% }
}
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

/* The typewriter cursor effect */
@-webkit-keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: white }
}
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: white }
}

.about-intro-container{ padding-bottom:0;}

.about-num-con{ display:flex; flex-direction:row;}
.num-item{flex: 1; text-align:center; position:relative; border-right:1px solid #eeeeee; padding:5rem 3rem;}
.num-item:last-child{border-right:none;}
.num-item .num-item-title{ position:absolute; left:2rem; top:1rem;}
.num-item .num-item-title:before{ content:""; width:9px; border-bottom:1px solid #727272; display:inline-block; vertical-align:middle; margin-right:15px;}
.num-item h2{ font-size:66px; font-weight:bolder; color:#111111;}

.about-ban{ width:90%; overflow:hidden; position:relative;}
.about-ban .bgimg{ height:646px;}
.bgimg-img{width:100%; height:100%; background-size:cover; background-repeat:no-repeat; }
.about-culture-txt{ float:none; max-width:1200px; margin-left:auto; margin-right:auto; margin-bottom:4rem;}
.partner-ban-img{height:730px; background-size:cover; background-repeat:no-repeat; background-position:25% center; }
.about-honor .about-ban{ margin-left:10%;}

.partner-logos-title{ text-align:center;}
.swiper-partnerlogo{ text-align:center;}

.banner-solution-txt{ width:100%; position:relative;}
.banner-solution-num{ width:80%; max-width:991px; margin-top:3rem; }
.banner-solution-num .num-item{ border-right:none; color:#ffffff;}
.banner-solution-num .num-item h2{ color:#ffffff;}
.banner-solution-num .num-item .num-item-title:before{ border-color:#ffffff;}

.solution-item:nth-child(even) .about-ban{margin-left:10%;}
.solution-viewall{ text-align:left;}

.solution-item-icons{ margin-top: 1rem;}
.solution-item-icons ul{ padding-left:0; }
.solution-item-icons ul li{ list-style:none; text-align:center; display:inline-block; padding:1rem 1rem 1rem 0;}

#about-partner{ padding-top: 3rem;}

#navbar-bottom{ position:fixed; bottom:0; width:100%; display:none; z-index:100000;}
.navbar-bottom-con ul{padding-left:0;}
.navbar-bottom-con ul li{ list-style:none; width:30%; float:left;background:#1f1f1f; border-right:1px solid #333333;}
.navbar-bottom-con ul li a{ color:#ffffff; padding:15px; display:block;}
.navbar-bottom-con ul li a:hover{ color:#ffffff; padding:15px; text-decoration:none;display:block;}
.navbar-bottom-con ul li.foot-nav-tel{width:40%; background:#97171a;border-right:none;}
.navbar-bottom-con ul li.foot-nav-tel a span{ margin-right:5px;}

.clear1{ display:block;}
.clear2{ display:none;}
@media screen and (max-width: 1200px){
	
.container-fluid{ padding-left:3%; padding-right:3%;}

	.banner-txt{ font-size:36px; line-height:46px;}
	
	.case-brand-con{ left:3%;}
	
	.case-view-name p{ font-size:16px;}
}

@media screen and (max-width: 991px){
	
	.nav-container .navbar-nav-collapse{display:none;}
	.menu-left{ width:100%; float:none; padding-right:0px; margin-top:20px; padding-left:98px;}
	.menu-right{ width:100%; float:none; padding-left:0px;}
	.menu-navber .nav-item{ margin-bottom:20px;}
	.menu-navber .nav-item .nav-link{ font-size:16px;}
	.menu-contact{ font-size:14px;}
	.menu-contact h1 { margin-bottom: 0.5rem; font-size:30px; }
	.banner-txt{ font-size:30px; line-height:40px;}
	#demo{ display:none;}
	.application-p { padding-bottom: 60px; }
	.app-items-nav{display:none;}
	.app-items-lists{width: 100%;}
	.application-items-details{width: 100%; float:none;}
	.app-items-lists-con{width: 100%;}
	.application-items-details {margin-top: 3rem;}
	
	#ggy{ height:400px;}
	.ggy-svg{ display:none;}
	.ggy-con{ text-align:left;}
	.solution{ width:100%;}
	.solution-btns .solution-btn {
    padding-right: 20px;
	padding-left:0;
	}
	
	.case-items{ margin-top:20px;}
	.case-item{ width:50%;}
	
	.case-container{ padding-top:60px; padding-bottom:60px;}
	
	.news-item-con{ display:block;}
	.news-item-con .news-img{ width:100%;}
	.news-item-con .news-img img{ width:100%;}
	.news-item-con .news-conner{ width:100%; margin-top:15px; }	
	.news-container{ padding-top:60px; padding-bottom:60px;}
	
	.contact-map{ position:absolute; width:100%; left:0; right:0; top:-50%;}
.contact-mess{
	width: 100%;
    position: absolute;
    right: 0;
    top: auto;
	bottom:0;
    transform: translateY(0);
    margin-top: 0;
    
	}
	.contact-mess-con{padding:5% 5% 5% 20%;}
	
	.container-con{ padding-top:60px; padding-bottom:80px;}
	
	.news-view-more{ display:block;}
	.news-view-ewm{ text-align:center; margin-top:2rem;}
	
	.banner-case-view-con{ height:60vh !important;}
	
	.case-view-name{}
	.case-view-name:before{ width:30px; left:-50px;}
	.case-view-name p{ font-size:14px;}
	.case-view-name a.case-view-link{
		width: 36px;
		height: 36px;
	}
	.case-view-name a.case-view-link i {
		width: 36px;
		height: 36px;
	}
	
	.num-item h2{ font-size:50px; }
	
	.about-culture-txt{ margin-bottom:3rem;}
	
	.about-ban .bgimg{ height:446px;}
	.partner-ban-img{height:446px;}
	
	.banner-solution-num .num-item h2{ font-size:36px;}
	
	footer { margin-bottom: 54px; }
	#navbar-bottom{ display:block;}
		
	.clear1{ display:none;}
.clear2{ display:block;}
}

@media screen and (max-width: 768px){
	.banner-txt{ font-size:26px; line-height:36px;}
	.application-icon{ width:100px; height:100px; top:-60px;}
	.application-p{ padding-right:15px; }
	.case-items{ margin-left:-10px; margin-right:-10px;}
	.case-item{ padding:10px;}
	
	.foot-1{ display:block;}
	.foot-item{ padding-left:0; padding-right:0;}
	.foot-ewm{ display:none;}
	.foot-service{ display:none;}
	.foot-logo{ width:100%;}
	.foot-link{ width:100%;}
	
	.foot-2{ display:block;}
	.foot-contact{ width:100%;}
	.foot-nav{ width:100%; text-align:left;}
	.foot-nav ul li{ margin-left:0; margin-right:15px;}
	
	.banner-links-item{ width:36px; height:36px; line-height: 36px; font-size: 12px;}
	
	.case-view-img{ position:absolute; right:5%; z-index:10; bottom:5%; width:90%;}
	
	.case-view-name{ top:25%;}
	
	.about-num-con{ flex-direction:column;}
	.num-item{ border-right:0; border-bottom:1px solid #eeeeee; padding: 3rem 3rem 2rem;}
	
	.about-intro-container{ padding-bottom:60px;}
	
	.banner-solution-num .num-item{ border-bottom:none; padding: 3rem 1rem;}
	.banner-solution-num .num-item .num-item-title{ left:1rem;}
	.banner-solution-num .about-num-con{ flex-direction:row;}
}
@media screen and (max-width: 576px){
	.banner-txt{ font-size:22px; line-height:30px;}
	
	.case-items{margin-top:10px;}
	.case-item{ width:100%; float:none;}
	.banner-solution-num .num-item{ border-bottom:none; padding: 3rem 0.5rem;}
	.banner-solution-num .num-item .num-item-title{ left:0.5rem;}
	.banner-solution-num .num-item h2{ font-size:26px;}
}