/* CSS Document */
*{margin:0; padding:0; font-family:Arial, Helvetica, 微软雅黑, sans-serif; touch-action: pan-y;}
a{ color:#333; text-decoration:none;}
ul, ol{list-style-type:none;}
img{border:0; max-width:100%;  vertical-align: middle;}
input, textarea,select, button{outline:medium; blr:expression(this.onFocus=this.blur());}

/***************侧导航************/
 #fp-nav ul li, .fp-slidesNav ul li{ margin:16px 6px; width:18px; height:18px;}
#fp-nav ul li a span, .fp-slidesNav ul li a span{ border:2px solid #fff;     width: 14px;  height: 14px; top:0; left:0;}
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span{ background:#fff; margin:0;}
/*#fp-nav ul{ position:relative;}
#fp-nav ul::before{ content:url(../images/page-nav-topline.png); display:inline-block; position:absolute; width: 18px; height:114px;  top: -143px; right: 6px; -webkit-animation: pulse 2s infinite;   animation: pulse 2s infinite;}
#fp-nav ul::after{ content:url(../images/page-nav-bottomline.png); display:inline-block; position:absolute; width: 18px; height:114px;  top: 278px; right: 6px; -webkit-animation: pulses 2s infinite;   animation: pulses 2s infinite;}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }

  50% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }

  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); } }

@keyframes pulse {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }

  50% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }

  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); } }

@-webkit-keyframes pulses {
  0% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }

  50% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }

  100% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); } }

@keyframes pulses {
  0% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }

  50% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }

  100% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }  } */

.container{ width:1200px; margin:0 auto; display: table;}
.box-eight .container{ position:relative; height:100%;}

/* .box-one{ background:url(../images/box-one-bg.jpg) no-repeat center; background-size:cover;} */
.box-two{ background:url(../images/box-two-bg.jpg) no-repeat center #f6f4f5; background-size:cover;}
.box-three{ background:url(../images/box-three-bg.jpg) no-repeat center; background-size:cover;}
.box-four{ background:url(../images/box-four-bg.jpg) no-repeat center; background-size:cover;}
.box-five{ background:url(../images/box-five-bg.jpg) no-repeat center; background-size:cover;}
.box-six{ background:url(../images/box-six-bg.jpg) no-repeat center; background-size:cover;}
.box-seven{ background:url(../images/box-seven-bg.jpg) no-repeat center; background-size:cover;}
.box-eight{ background:url(../images/box-eight-bg.jpg) no-repeat center; background-size:cover;}


.header{ position:absolute; top:16px; left:0; width:100%; height:68px; z-index: 1;}
.header .logo{ float:left;}
.header .nav{ float:left; margin-left:140px;}
.header .nav li{ float:left; line-height:68px; margin: 0 10px; }
.header .nav li a{ font-size:16px; color:#fff; display:inline-block; padding:0 20px; line-height:35px; border-radius:50px;}
.header .nav li:hover a{ background:#103d87;}
.header .search{ float:right; line-height:68px; }
.header .search button{ line-height:30px; border:1px solid #fff; color:#fff; font-size:16px; background:url(../images/search.png) no-repeat 12px;  padding: 0 12px 0 38px; border-radius:30px; background-size: 16px; cursor:pointer;}
/*.header .search button:hover{ background:url(../images/search.png) no-repeat 12px #103d87; background-size: 16px;}*/

.search-tc{ position:relative; padding:30px 40px !important;}
.search-tc input[type="text"]{ width: 100%;    height: 45px;    border: none;    background: transparent;    border-bottom: 2px solid #fff; font-size:16px; color:#fff;}
.search-tc input[type="submit"]{ position:absolute; background:url(../images/search.png) no-repeat center; width: 40px; height: 45px; border: none; top: 30px;  right: 40px; cursor:pointer;}
.search-tc button{ border: 0; background: transparent; color: #fff; margin: 16px 0 0;}

/* .banner-text{}
.banner-text .p1{ font-size:36px; color:#fff; font-weight:bold;}
.banner-text .p1 span{ margin-right:20px;}
.banner-text .p2{ font-size:60px; color:#f7da13; font-weight:bold; margin-top:10px; padding-bottom:10px; background:url(../images/box-one-line.png) no-repeat left bottom;}
.banner-text .p3{ width:435px; height:40px; line-height:40px; text-align:center; background:#103d87; color:#fff; font-size:20px; margin-top:20px;} */

.banner{ position: relative; z-index: 0;}
.banner, .banner .swiper-container, .banner .swiper-slide, .banner .swiper-slide a{ width: 100%; height: 100%;}
.banner .swiper-slide a{ display: inline-block;}
.banner .swiper-pagination-bullet{ width: 30px; border-radius: 4px; opacity: 1; background: #fff; margin: 0 6px !important;}
.banner .swiper-pagination-bullet-active{ background: #103d87;}

.index-about{}
.index-about .img{ float:left; width:605px;}
.index-about .text{ float:right; width:540px;}
.index-about .text .title{ font-size:30px; color:#333; font-weight:bold; margin-top:10px;}
.index-about .text .p{ margin-top:10px;}
.index-about .text .p p{ font-size:14px; color:#333; text-indent:2em; text-align:justify; line-height:24px;}
.index-about .text .btn{ text-align:right; margin-top:44px;}
.index-about .text .btn a{ display:inline-block; width:120px; height:40px; line-height:40px; text-align:center; border-radius:4px; background:#103d87; color:#fff; font-size:14px;}
.index-about .text .btn a:hover{ background:#317e44;}

.box-two .index-title{ margin-bottom:60px;}
.box-two .index-title .text{ float:none;}

.index-ys{ height:160px; margin-top:60px; position:relative;}
.index-ys-list{ width:1200px; margin:0 auto;}
.animate-box{float:left;    width: 240px; text-align:center; padding: 34px 0;}
.fh5co-counter{ font-size:68px; color:#103d87;font-family:"Arial Black"; font-weight:bold; line-height:68px;display: inline-block;    margin-left: -10px;}
.animate-box i{ color:#103d87; font-size:20px;font-family:"Arial Black"; font-style:normal;  position: absolute;}
.animate-box p{color: #333;font-size: 18px; line-height: 24px;text-align: center; margin-top:6px;}

.index-title{}
.index-title .title{ font-size:30px; font-weight:bold; color:#fff; text-align:center; position:relative;  padding-bottom: 18px;}
.index-title .title i{ display:inline-block; position:absolute; width:60px; height:4px; background:#fff; left:50%; margin-left:-30px; bottom:0;}
.index-title .text{ font-size:14px; color:#fff; text-align:center; width: 680px;    margin: 15px auto 0;}

.box-two .index-title .title, .box-four .index-title .title, .box-six .index-title .title{ color:#103d87;}
.box-two .index-title .title i, .box-four .index-title .title i, .box-six .index-title .title i{ background:#333;}
.box-two .index-title .text, .box-four .index-title .text, .box-six .index-title .text{ color:#333;}

.iproduct-list{ margin-top:100px;}
.iproduct-list li{ float:left; padding:24px 25px; background:#fff; width:238px; margin-right:15px; }
.iproduct-list li:last-child{ margin-right:0;}
.iproduct-list li .img{ width:240px; height:240px; overflow:hidden; position: relative;}
.iproduct-list li .img img{ transition: all 0.3s linear 0s; position: absolute; height: 100%; left: 50%; transform: translateX(-50%); top: 0;  max-width: inherit;}
.iproduct-list li:hover .img img{ transform: translateX(-50%) scale(1.1,1.1);}
.iproduct-list li .text .title{ font-size:20px; color:#103d87; font-weight:bold; text-align:center; margin:20px 0 10px;}
.iproduct-list li .text .p{ font-size:14px; color:#333; line-height:24px; height:120px; overflow:hidden;}
.iproduct-list li .text .icon{ background:url(../images/product-icon.png) no-repeat center; width:33px; height:33px; margin:0 auto;}

.iys{ padding: 15px 58px; overflow:hidden; margin-top:75px; box-shadow:0 0 29px rgba(205,205,205,.3); background:#fff;}
.iys li{ width:240px; height:150px; float:left; padding:15px 60px; border-right:1px solid #e8e8e8; margin:40px 0; transition: all 0.2s linear 0s;}
.iys li:nth-child(3n){ border-right:none;}
.iys li .num{ font-size:50px; font-family:Impact; text-align:center; line-height: 44px;}
.iys li .title{ font-size:16px; color:#103d87; text-align:center; font-weight:bold; margin:10px 0 8px;}
.iys li .text{ font-size:14px; color:#333; line-height:24px;}
.iys li:hover{ background:url(../images/ys-bg.png) no-repeat center;}

.icase-list{ height:610px; width:1200px; overflow:hidden; margin-top:40px;}
.icase-list .hot-case{ width:590px; height:400px; position:relative; float:left; clear:left;}
.icase-list .hot-case .img{ display:block; position:relative; z-index:0;}
.icase-list .hot-case .img img{ width:100%; height:100%;}
.icase-list .hot-case .text{ position:absolute; top:0; left:0; width:100%; height:100%; background: transparent;}
.icase-list .hot-case .text .title{ font-size: 20px; color: #fff; text-align: center;    letter-spacing: 2px; position:relative; z-index:2; opacity:0; top:20px; transition: all 0.3s linear 0s;}
.icase-list .hot-case .text .logo{ text-align:center;  margin: 120px 0 20px; position:relative; z-index:2; opacity:0; top:20px; transition: all 0.3s linear 0s;}
.icase-list .hot-case:hover .text .title{  top:0; opacity:1;}
.icase-list .hot-case:hover .text .logo{ top:0; opacity:1;}
.icase-list .hot-case .text .line{ position:absolute; width:100%; height:100%; z-index:1; top:0; left:0;}
.icase-list .hot-case .text .line i{ display:inline-block; width:0; height:0; background:#fff; position:absolute; transition: all 0.3s linear 0s;}
.icase-list .hot-case .text .line .l1{ top:20px; left:20px; height:1px; width:0;}
.icase-list .hot-case .text .line .l2{ right:20px; top:40px; height:0; width:1px;}
.icase-list .hot-case .text .line .l3{ bottom:20px; right:20px; height:1px; width:0;}
.icase-list .hot-case .text .line .l4{ left:20px; bottom:40px; height:0; width:1px;}

.icase-list .hot-case:hover .text .line .l1{ top:20px; left:20px; height:1px; width:550px;}
.icase-list .hot-case:hover .text .line .l2{ right:20px; top:40px; height:320px; width:1px;}
.icase-list .hot-case:hover .text .line .l3{ bottom:20px; right:20px; height:1px; width:550px;}
.icase-list .hot-case:hover .text .line .l4{ left:20px; bottom:40px; height:320px; width:1px;}
.icase-list .hot-case .text::after{ content:""; display:inline-block; background:#103d87; width:100%; height:100%; position:absolute; top:0; left:0; z-index:0; opacity:0; transition: all 0.3s linear 0s; -webkit-clip-path: ellipse(25% 40% at 50% 50%); clip-path: ellipse(25% 40% at 50% 50%);}
.icase-list .hot-case:hover .text::after{ opacity:1; -webkit-clip-path: ellipse(100% 100% at 50% 50%);clip-path: ellipse(100% 100% at 50% 50%);}

.icase-list ul{}
.icase-list li{ width:285px; height:190px; position:relative; float:left; overflow:hidden; margin-left:20px; margin-bottom:20px;}
.icase-list li:nth-child(5){ margin-left:0;}
.icase-list li .img{ display:block; position:relative; z-index:0;}
.icase-list li .img img{ width:100%; height:100%;}
.icase-list li .text{ position:absolute; top:0; left:0; width:100%; height:100%; background: transparent;}
.icase-list li .text .title{ font-size: 16px; color: #fff; text-align: center;    letter-spacing: 2px; position:relative; z-index:2; opacity:0; top:20px; transition: all 0.3s linear 0s;}
.icase-list li .text .logo{ text-align:center;  margin: 50px 0 10px; position:relative; z-index:2; opacity:0; top:20px; transition: all 0.3s linear 0s;}
.icase-list li .text .logo img{ width:60%;}
.icase-list li:hover .text .title{ top:0; opacity:1;}
.icase-list li:hover .text .logo{ top:0; opacity:1;}
.icase-list li .text .line{ position:absolute; width:100%; height:100%; z-index:1; top:0; left:0;}
.icase-list li .text .line i{ display:inline-block; width:0; height:0; background:#fff; position:absolute; transition: all 0.3s linear 0s;}
.icase-list li .text .line .l1{ top:20px; left:20px; height:1px; width:0;}
.icase-list li .text .line .l2{ right:20px; top:40px; height:0; width:1px;}
.icase-list li .text .line .l3{ bottom:20px; right:20px; height:1px; width:0;}
.icase-list li .text .line .l4{ left:20px; bottom:40px; height:0; width:1px;}

.icase-list li:hover .text .line .l1{ top:20px; left:20px; height:1px; width:245px;}
.icase-list li:hover .text .line .l2{ right:20px; top:40px; height:110px; width:1px;}
.icase-list li:hover .text .line .l3{ bottom:20px; right:20px; height:1px; width:245px;}
.icase-list li:hover .text .line .l4{ left:20px; bottom:40px; height:110px; width:1px;}
.icase-list li .text::after{ content:""; display:inline-block; background:#103d87; width:100%; height:100%; position:absolute; top:0; left:0; z-index:0; opacity:0; transition: all 0.3s linear 0s; -webkit-clip-path: ellipse(25% 40% at 50% 50%); clip-path: ellipse(25% 40% at 50% 50%);}
.icase-list li:hover .text::after{ opacity:1; -webkit-clip-path: ellipse(100% 100% at 50% 50%);clip-path: ellipse(100% 100% at 50% 50%);}

.ilink{ margin-top:80px;}
.ilink li{ float:left; margin-right:12px; margin-bottom:12px; width:230px; height:130px; overflow:hidden; position:relative; background:#fff; top:0; transition: all 0.2s linear 0s;}
.ilink li:nth-child(5n){ margin-right:0;}
/* .ilink li img{-webkit-filter: grayscale(100%);    -moz-filter: grayscale(100%);    -ms-filter: grayscale(100%);    -o-filter: grayscale(100%);     filter: grayscale(100%);	    filter: gray;}
.ilink li:hover img{-webkit-filter: grayscale(0%);    -moz-filter: grayscale(0%);    -ms-filter: grayscale(0%);    -o-filter: grayscale(0%);     filter: grayscale(0%);	    filter: none;} */
.ilink li:hover{ box-shadow:0 3px 10px rgba(0,0,0,.35); top:-10px;}

.inews-left{ width:550px; float:left; margin-top: 28%;}
.inews-left .title{ font-size:30px; color:#fff; position:relative; font-weight:bold; padding-bottom:20px;}
.inews-left .title i{ display:inline-block; width:60px; height:4px; background:#fff; left:0; bottom:0; position:absolute;}
.inews-left .text{ font-size:14px; color:#fff; margin-top:16px;}
.inews-left .icon{ margin-top:16px; width:39px; height:39px; transition: all 0.2s linear 0s;}
.inews-left .icon:hover{ transform:rotate(180deg);-ms-transform:rotate(180deg); -moz-transform:rotate(180deg); 	-webkit-transform:rotate(180deg); -o-transform:rotate(180deg); }

.inews-right{ width:460px; float:right; padding:0 120px 0 70px;}
.inews-right li{ overflow:hidden; position:relative; padding:28px 0;}
.inews-right li .num{ float:left; font-size:30px; color:#fff; font-weight:bold; line-height:50px; margin-right:30px;}
.inews-right li .text{ float:left; color:#fff;}
.inews-right li .text .title{ font-size:18px; width:370px; text-overflow: ellipsis; display: -webkit-box;    -webkit-line-clamp: 1;    -webkit-box-orient: vertical;    overflow: hidden;}
.inews-right li .text .date{ font-size:14px; margin-top:10px;}
.inews-right li .text i{ display:inline-block; position:absolute; width:15px; height:15px; background:#afafaf; border-radius:15px; top:44px; right:0; transition: all 0.2s linear 0s;}
.inews-right li:hover .text .title{ color:#3563c0;}
.inews-right li:hover .text i{ right:10px;}

.footer{ width:440px; height:625px; background:#333; padding:30px; position:absolute; bottom:0; right:120px;}
.footer .title{ font-size:30px; color:#fff; font-weight:bold; padding-bottom:20px; position:relative;}
.footer .title i{ display:inline-block; width:60px; height:4px; background:#fff; left:0; bottom:0; position:absolute;}
.footer dl{ margin:25px 0 30px;}
.footer dt.name{ background:url(../images/footer-icon1.png) no-repeat center left; font-size:14px; color:#fff; font-weight:bold; padding-left:40px; line-height:35px;}
.footer dd{ font-size:14px; color:#fff; line-height:35px; padding-left:40px; margin-bottom:6px;}
.footer dd.mail{ background:url(../images/footer-icon2.png) no-repeat center left;}
.footer dd.add{ background:url(../images/footer-icon3.png) no-repeat center left;}
.footer dd.tel{ background:url(../images/footer-icon4.png) no-repeat center left;}
.footer ul{ overflow:hidden;}
.footer li{ float:left; margin-right:30px; width:186px;}
.footer li p{ font-size:14px; color:#fff; text-align:center; margin-top:10px;}
.footer .copy{ font-size:14px; color:#fff; border-top:1px solid #9a9a9a; line-height:28px; padding-top:14px; margin-top:40px;}
















