@charset "utf-8"; .swiper-pagination-bullet-active { background-color:#F4C117; } .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom:60px; } body{ font-family:"微软雅黑","arial","sans-serif"; color:#333; font-size:14px; line-height:2; } a { text-decoration:none; color:#333; blr:expression(this.onFocus=this.blur()); outline: none; } a:hover { color:#316DBF; } a:hover { text-decoration:none; -moz-transition-duration: 0.3s;-webkit-transition-duration: 0.3s;-o-transition-duration: 0.3s; transition-duration:0.3s; -webkit-transition-property:color, background-color, background, width, height, top, left, bottom, right, display, borderr,opacity;-moz-transition-property:color, background-color, background, width, height, top, left, bottom, right, display, borderr,opacity; -o-transition-property:color, background-color, background, width, height, top, left, bottom, right, display, borderr,opacity; transition-property:color, background-color, background, width, height, top, left, bottom, right, display, border,opacity; } .full { width:expression(document.body.clientWidth <= 1200? "1200px": "auto");;min-width:1200px; } .clear { clear:both; } .red { color:#CB1500; } .yellow { color:#F0FF00; } .gray { color:#999; } .space10 { clear:both; height:10px; overflow:hidden; } .space20 { clear:both; height:20px; overflow:hidden; } .f20 { font-size:20px; } .f16 { font-size:16px; } .pzoom { overflow:hidden; } .pzoom img { transition: all 0.3s; } a:hover .pzoom img { transform: scale(1.2); } .btn-primary { background-color:#FF9900; border-color:#FF9900; } .btn-primary:hover { background-color:#FF9900; border-color:#FF9900; } .swiper-button-next { width:22px; background-color:#FFF; background-image:url('../images/ico-arrowr.png'); background-size: auto 50%; border-radius:22px 0 0 22px; outline:none; } .swiper-button-prev { width:22px; background-color:#FFF; background-image:url('../images/ico-arrowl.png'); background-size: auto 50%; border-radius:0 22px 22px 0; outline:none; } /* head ,footer */ .top { height:120px; } .top .container { } .top-logo { padding:30px 0 0 0px; } .top-search { padding:50px 0 0; } .top-search-box { background:#EFF7FD; width:310px; height:40px; float:right; border-radius:20px; padding:0 0px; } .top-search-box .input { border:none; background:none; font-size:14px; line-height:40px; height:40px; padding:0 20px; width:250px; float:left; outline:0px; } .top-search-box .btn-search { border:none; background:none; font-size:24px; line-height:40px; height:40px; padding:0; width:60px; float:left; } .top-link { float:right; margin-left:10px; background-image:linear-gradient(to bottom,#50A9EB 0px,#316DBF 100%); background-repeat:repeat-x; background-position:left top; width:40px; height:40px; border-radius:20px; } .top-link a { display:block; text-align:center; width:100%; font-size:14px; line-height:40px; color:#FFF; } .top-link:hover { -webkit-box-shadow: 0px 1px 5px 3px rgba(55,55,55,0.2); -moz-box-shadow: 0px 1px 5px 3px rgba(55,55,55,0.2); box-shadow: 0px 1px 5px 3px rgba(55,55,55,0.2); } nav.top-nav { line-height:1.7; position:relative; z-index:999; font-size:18px; margin:15px 0 0; padding:0px 0 0; background:#F6F6F6; } nav ul { margin:0; padding:0; } nav li { margin:0px 0px; padding:0 0px; height:auto; } .nav-pills > li + li { margin-left:0; } nav .nav>li:first-child>a { background-image:none; } nav .nav>li>a{ color:#333; width:auto; text-align:center; background:none; padding:0px 0px 0 0px; height:75px; line-height:75px; border-top:3px solid #F6F6F6; position:relative; outline: none; } nav .nav>li>a i { display:none; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 5px solid #316CBF; position:absolute; top:0; left:50%; margin-left:-10px; } nav .nav>li>a:after { content:'|'; color:#DDD; width:auto; text-align:center; background:none; float: right; font-size:14px; } nav .nav>li:last-child>a { } nav .nav>li:last-child>a:after { content:''; display:none; } nav .nav-pills>li.active:hover>a { color:#316CBF; background:none; margin-top:0px; } nav .nav-pills>li.active>a,nav .nav-pills>li.active>a:focus,nav .nav-pills>li>a:hover{ color:#316CBF; border-radius:0px; background:none; margin-top:0px; border-top:3px solid #316CBF; } nav .nav>li:hover>a { color:#316CBF; background:none; border-radius:0; border-top:3px solid #316CBF; } nav .nav>li.active>a>i,nav .nav>li.active>a:focus>i,nav .nav>li:hover>a>i { display:block; } nav .nav>li ul { display:none; list-style-type:none; margin:0 0 0 0px; padding:0px 0 0; z-index:8; background:rgba(255,255,255,0.8); border-radius:0px; position:absolute; left:0; top:75px; width:100%; z-index:4; border:none; } nav .nav>li ul li { margin:0; padding:0; width:100%; height:50px; border:none; animation-name:navdown; animation: navdown 0.5s ease 0s normal none; -moz-animation: navdown 0.5s ease 0s normal none; -webkit-animation: navdown 0.5s ease 0s normal none; -o-animation: navdown 0.5s ease 0s normal none; } nav .nav>li ul li a { display:block; width:100%; color:#333; text-align:center; font-size:16px; line-height:50px; height:50px; } nav .nav>li:hover ul { display:block; } nav .nav>li:hover li>a { color:#333; position:relative; } nav .nav>li:hover li>a:hover { color:#316DBF;} nav .nav>li:hover li>a:hover:after { content:''; width:100%; height:2px; display:block; background:#316CBF; position:absolute; bottom:0; left:0; animation-name:linemove; animation: linemove 0.5s ease 0s normal none; -moz-animation: linemove 0.5s ease 0s normal none; -webkit-animation: linemove 0.5s ease 0s normal none; -o-animation: linemove 0.5s ease 0s normal none; } @-webkit-keyframes linemove{from{width:0px;} to{width:100%;} } @-moz-keyframes linemove{from{width:0px;} to{width:100%;} } @keyframes linemove{from{width:0px;} to{width:100%;} } @-webkit-keyframes navdown{from{height:0px;} to{height:50px;} } @-moz-keyframes navdown{from{height:0px;} to{height:50px;} } @keyframes navdown{from{height:0px;} to{height:50px;} } .index-footer { text-align:center; color:#FFF; padding:30px 0 30px; background-image:linear-gradient(to right,#51AAEC 0px,#316DBF 100%); background-repeat:repeat-y; background-position:left top; } .index-footer .container { position:relative; } .index-footer a { color:#FFF; } .footer-qr { position:absolute; right:20px; top:-10px; width:auto; } .footer-qr img { float:left; width:102px; padding:4px; background:#FFF; } .footer-qr p { float:left; padding:5px 10px 0 15px; display:block; } .float-jijian { position:fixed; right:-70px; top:200px; width:150px; z-index:10000; } .float-jijian img { width:100%; } .float-jijian:hover { right:5px; transition: all 0.5s; } /* pages */ .page-turner { padding:20px 10px 0; font-family:Verdana, Geneva, sans-serif; } .page_btn { display:inline-block; background-color:#FFF; border:1px solid #EEE; width:auto; padding:0 12px; line-height:35px; color:#333; margin:0 2px; border-radius:0px; } .page_cur { display:inline-block; background-color:#316DBF; border:1px solid #316DBF; color:#FFF; width:auto; padding:0 12px; line-height:35px; margin:0 2px; border-radius:0px; } .page_disable { display:inline-block; background-color:#F7F7F7; border:1px solid #EEE; width:auto; padding:0 12px; line-height:35px; color:#333; margin:0 2px; border-radius:0px;} .page-turner li { list-tyle-type:none; margin:0; padding:0; display:inline-block; background-color:#FFF; border:1px solid #EEE; width:auto; padding:0 12px; color:#333; margin:0 2px; border-radius:0px; } .page-turner li a { display:block; width:100%; height:35px; line-height:35px; } .page-turner li.active { background-color:#316DBF; border:1px solid #316DBF; color:#FFF; } .page-turner li.active a { color:#FFF; } /*index*/ .index-banner { width:100%; z-index:1; overflow:hidden; position:relative; } .index-banner .swiper-wrapper { z-index:1; } .banner-container a { display:block; width:100%; outline:none; } .banner-container img { width:100%; } .index-banner .swiper-pagination { bottom:10px; z-index:1; } .swiper-pagination-bullet { opacity:0.5; background-color:#FFF; z-index:1;outline:none;} .swiper-pagination-bullet-active { background-color:#51AAEC; opacity:1; } .index-banner .swiper-button-next { background-color:transparent; background-image:url('../images/right.png'); background-size: auto 100%; outline:none; z-index:2; } .index-banner .swiper-button-prev { background-color:transparent; background-image:url('../images/left.png'); background-size: auto 100%;outline:none; z-index:2; } .index-title { padding:0px 0px 40px; margin:0 auto; position: relative; text-align:center; } .index-title h2 { margin:0 0 10px; padding:0 0px 0; font-size:30px; line-height:1em; color:#000; font-weight:normal; width:auto; display: inline-block; } .index-title h2:before { content:''; display: inline-block; width:48px; height: 24px; margin-right:15px; background-image:url('../images/dot.png'); background-repeat:repeat; background-position:left 0px; } .index-title h2:after { content:''; display: inline-block; width:48px; height: 24px; margin-left:15px; background-image:url('../images/dot.png'); background-repeat:repeat; background-position:left 0px; } .index-title small { color:rgba(50,109,191,0.2); font-weight:900; font-size:50px; font-family:"Times New Roman"; line-height:1em; } .index-title-type { text-align:left; border-bottom:1px solid #DDD; margin-bottom:30px; } .index-title-type a { display:inline-block; width:auto; padding:0 30px 5px; font-size:26px; font-weight:normal; line-height:50px; position:relative; margin-right:15px; border-bottom:3px solid #FFF; outline:none; } .index-title-type a:after { content:''; display:block; width:0px; height:0px; position:absolute; left:50%; bottom:0; margin-left:-6px; } .index-title-type a.active,.index-title-type a:hover { color:#316CBF; border-color:#316CBF; } .index-title-type a.active:after,.index-title-type a:hover:after { border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 5px solid #316CBF; } .index-more { padding:0px 0; text-align:center; } .index-more a { display:inline-block; width:120px; height:30px; color:#999; background:#FFF; font-size:14px; text-align:center; line-height:28px; border-radius:15px; border:1px solid #DDD; } .index-more a:hover { background:#316DBF; color:#FFF; border-color:#316DBF; } .index-news { padding:70px 0; position:relative; overflow:hidden; } .index-news .index-title:after { content:''; position:absolute; right:0; top:62px; width:80%; background:#EEE; height:2px; } .index-news .container { padding:0px; position:relative; } .index-news-pic { padding:0px 50px 0 0; } .index-news-pic-container { overflow:hidden; position:relative; } .index-news-pic-container-c a { display:block; width:100%; position:relative; height:480px; border-bottom:3px solid #316CBF; } .index-news-pic .pzoom { width:100%; height:0; padding-bottom:69%; margin:0 auto 10px; position: relative; overflow: hidden; } .index-news-pic .pzoom .pic-box { width:100%; height:100%; position: absolute; } .index-news-pic .pzoom .pic-box img { width:100%; height: 100%; object-fit: contain; } .index-news-pic h3 { color:#316CBF; height:40px; line-height:40px; padding:0 0px; margin:0; overflow:hidden; font-size:20px; } .index-news-pic small { color:#999; height:2em; line-height:2em; padding:0 80px 0 0px; margin:0; overflow:hidden; font-size:16px; display:block; text-align:justify; } .index-news-pic .item-more { display:block; float:right; width:37px; height:37px; line-height:37px; text-align:center; font-size:28px; color:#333; margin:-70px 0px 0 0px; } .index-news-pic-container .newsPre { left:0; height:50px; width:25px; background-size: auto 35%; background-position:2px center; border-radius:0 25px 25px 0; top:40%; outline:none; } .index-news-pic-container .newsNext { right:0; height:50px; width:25px; background-size: auto 35%; background-position:15px center; border-radius:25px 0 0 25px; top:40%; outline:none; } .index-news-box { padding:0px 0 0 0px; } .index-news .index-title-type { margin-bottom:20px; } .index-news-content { overflow:hidden; height:410px; position:relative; } .index-news-c { margin:10px 10px; padding:0; width:96.5%; position:absolute; left:0; top:0; list-style-type:none; animation-name:navdown; animation: newsshow 1s ease 0s normal none; -moz-animation: newsshow 1s ease 0s normal none; -webkit-animation: newsshow 1s ease 0s normal none; -o-animation: newsshow 1s ease 0s normal none; } @-webkit-keyframes newsshow{from{left:100%;} to{left:0;} } @-moz-keyframes newsshow{from{left:100%;} to{left:0;} } @keyframes newsshow{from{left:100%;} to{left:0;} } .index-news-c li { margin:0px; padding:0px 0 0px; } .index-news-c li a { display:block; width:100%; position:relative; padding:0px 10px 0; } .index-news-c li h3 { font-size:16px; margin:0 0px 7px 0; color:#333; font-weight:normal; line-height:32px; height:32px; overflow:hidden; } .index-news-c li small { font-size:16px; overflow:hidden; line-height:2em; max-height:4em; color:#999; display:block; text-align:justify; padding:0 0px 0 0; display:none; } .index-news-c li .item-time { color:#999; font-size:14px; line-height:32px; margin-right:15px; float:left; } .index-news-c li .pzoom { width:170px; height:120px; margin:0 20px 0 0; position: relative; overflow: hidden; display:none; float:left; } .index-news-c li .pzoom .pic-box { width:100%; height:100%; position: absolute; } .index-news-c li .pzoom .pic-box img { width:100%; height: 120px; } .index-news-c li h3 span { display:inline-block; width:auto; position:relative; line-height:32px; height:32px; margin-right:40px; } .index-news-c li a i { color:#FF0000; font-style:normal; position:absolute; top:0; right:-40px; font-size:12px; display:none; } .index-news-c li:nth-child(1) a i,.index-news-c li:nth-child(2) a i,.index-news-c li:nth-child(3) a i { display:block; } /*.index-news-c li.active a { background:#FFF; height:150px; border-radius:10px; padding:14px 20px 0px; margin-bottom:20px; -webkit-box-shadow: 0px 1px 10px 3px rgba(55,55,55,0.2); -moz-box-shadow: 0px 1px 10px 3px rgba(55,55,55,0.2); box-shadow: 0px 1px 10px 3px rgba(55,55,55,0.2); } .index-news-c li.active h3 { color:#316CBF; font-size:20px; } .index-news-c li.active small { display:block; } .index-news-c li.active .item-time { display:none; }*/ .index-news-c li.active h3 span { color:#316DBF;} .index-business { padding:200px 0; background: url('../images/bg1.png') no-repeat center top; height:800px; } .index-business .index-title { text-align:center; position:relative; z-index:1; } .index-business .index-title h2 { color:#FFF; font-size:40px; filter: brightness(1000%); } .index-business .index-title:after { content:''; width:24px; height:24px; display:block; margin:10px auto 0; background: url('../images/dot2.png') no-repeat center top; } .index-line1 { width: 350px; height: 100px; background: linear-gradient(to right bottom, transparent 49.5%, rgba(202,228,249,0.5), transparent 50.5%); position:absolute; top:-82px; left:50%; margin-left:-350px; z-index:0;} .index-line2 { width: 1px; height: 80px; background:rgba(202,228,249,0.5); position:absolute; top:-82px; left:50%; z-index:0; } .index-line3 { width: 350px; height: 100px; background: linear-gradient(to top right, transparent 49.5%, rgba(202,228,249,0.5), transparent 50.5%); position:absolute; top:-82px; left:50%; z-index:0; } .index-business .index-business-type { text-align:center; position:relative; margin:30px 30px 0; } .index-business .index-business-type dl { list-style-type:none; margin:0; padding:0 20px; } .index-business .index-business-type a { color:#FFF; padding:0 20px; display:block; width:100%; } .index-business .index-business-type dt { font-size:26px; font-weight:normal; } .index-business .index-business-type dt .item-icon { display:block; width:120px; height:120px; border-radius:60px; border:10px solid rgba(255,255,255,0.2); margin:0 auto 20px; } .index-business .index-business-type dt i { display:block; box-sizing: content-box; width:100px; height:100px; border-radius:50px; background:#FFF; text-align:center; font-size:70px; line-height:100px; color:#316DBF; } .index-business .index-business-type dd { } .index-business .index-business-type dd small { color:#666; text-align:center; font-size:16px; line-height:1.8em; display:none; margin-top:20px; } .index-business .index-business-type dd .pzoom { width:300px; height:120px; margin:40px auto 0; position: relative; overflow: hidden; border-radius:10px; -webkit-box-shadow: 0px 1px 10px 3px rgba(55,55,55,0.2); -moz-box-shadow: 0px 1px 10px 3px rgba(55,55,55,0.2); box-shadow: 0px 1px 10px 3px rgba(55,55,55,0.2); } .index-business .index-business-type dd .pzoom .pic-box { width:100%; height: 100%; position: absolute; } .index-business .index-business-type dd .pzoom .pic-box img { width:100%; height: 100%; object-fit: contain; } .index-business .index-business-type dl:hover a { background:#FFF; border-radius:10px; padding:20px 20px 30px; -webkit-box-shadow: 0px 1px 10px 3px rgba(15,15,15,0.2); -moz-box-shadow: 0px 1px 10px 3px rgba(15,15,15,0.2); box-shadow: 0px 1px 10px 3px rgba(15,15,15,0.2); transition:all 0.5s ease; } .index-business .index-business-type dl:hover dt { color:#316DBF; } .index-business .index-business-type dl:hover dt .item-icon { border:none; height:80px; margin-bottom:0px; } .index-business .index-business-type dl:hover dt .item-icon i { height:80px; line-height:80px; } .index-business .index-business-type dl:hover dd small { display:block; } .index-business .index-business-type dl:hover dd .pzoom img { transform: scale(1.2); } .index-case { padding:50px 0px; } .index-case .index-title { padding-bottom:20px; } .index-case .index-title h2 { font-size:40px; } .index-case .index-more { background-image:linear-gradient(to right,#DDD 0px,#DDD 100%); background-repeat:no-repeat; background-position:center 15px; background-size:550px 1px; margin-bottom:50px; } .index-case-c { width:100%; overflow:hidden; position:relative; padding:0px 20px; max-width:1640px; margin:0 auto; } .index-case-c ul { list-style-type: none; margin:0; padding:0 10px 0 0; } .index-case-c li { text-align: center; padding:0 0px 10px 10px; } .index-case-c li:nth-child(5),.index-case-c li:nth-child(6),.index-case-c li:nth-child(7),.index-case-c li:nth-child(8),.index-case-c li:nth-child(9) { width:20%; } .index-case-c li a { display:block; position:relative; border-radius:10px; overflow:hidden; } .index-case-c li .pzoom { width:100%; height:0; padding-bottom:68.9%; margin:0 auto; position: relative; overflow: hidden; } .index-case-c li .pzoom .pic-box { width:100%; height: 100%; position: absolute; } .index-case-c .pzoom .pic-box img { width:100%; height: 100%; object-fit: contain; } .index-case-c li h3 { height:50px; line-height:50px; font-size:18px; text-align:center; margin: 0; background:rgba(0,0,0,0.5); color:#FFF; width:100%; padding:0 15px; position:absolute; bottom:0; left:0; } .index-dangjian { padding:50px 0 70px; position:relative; overflow:hidden; } .index-dangjian-box { padding:0px 0px 0 0; position:relative; z-index:0; } .index-dangjian-box:first-child { padding-right:20px; } .index-dangjian-box:last-child { padding-left:20px; } .index-dangjian-box .index-title { border-radius:10px 10px 10px 50px; height:130px; text-align:left; -webkit-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.25); -moz-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.25); box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.25); background-image:linear-gradient(to right,#51AAEC 0px,#316DBF 50%); background-repeat:repeat-y; background-position:left top; padding:50px 0 0 40px; margin-bottom:30px; z-index:0; } .index-dangjian-box .index-title h2 { color:#FFF; margin-bottom:0; } .index-dangjian-box .index-title h2:before,.index-dangjian-box .index-title h2:after { display:none; } .index-dangjian-box .index-title:after { content:''; display:block; width:100%; height:130px; background:url('../images/t1.png') no-repeat right center; position:absolute; right:0 ;top:0; z-index:0; } .index-dangjian-box:last-child .index-title:after { background-image:url('../images/t2.png'); } .index-dangjian-box .index-title .index-more { display:inline-block; margin-left:20px; position:relative; z-index:1; } .index-dangjian-box .index-title .index-more a { color:#FFF; border-color:#FFF; background:none; border-radius:12px; width:80px; height:25px; line-height:23px; font-size:12px; } .index-dangjian-box .index-title .index-more a:hover { background:#316CBF; } .index-dangjian-box ul { list-style-type:none; margin:0; padding:0; } .index-dangjian-box li a { display:block; width:100%; padding:0px 10px 0 30px; } .index-dangjian-box li h3 { font-size:16px; line-height:40px; height:40px; overflow:hidden; padding:0; margin:0; overflow:hidden; } .index-dangjian-box li h3:before { content:''; display:inline-block; width:5px; height:5px; background:#316DBF; border-radius:2px; margin-right:15px; margin-bottom:3px; } .index-dangjian-box li i { font-size:14px; font-style:normal; color:#999; float:right; line-height:40px; margin-left:20px; } .index-dangjian-box li a:hover h3:before { margin-left:5px; } .index-dangjian-box li a:hover i { margin-left:15px; } .index-zhuanti { background: #EFF7FD; padding:50px 0 50px; position:relative; } .index-zhuanti .index-title h2:before { opacity:0.6; } .index-zhuanti .index-title h2:after { opacity:0.6; } .index-zhuanti-box { overflow:hidden; position:relative; margin:0 35px; } .index-zhuanti-box ul { list-style-type:none; margin:0; padding:0; } .index-zhuanti-box li { padding:0 5px; } .zhuantiPre { outline:none; left:0; background-size: auto 30%; background-position:5px center; -webkit-box-shadow: 0px 1px 5px 3px rgba(50,50,50,0.25); -moz-box-shadow: 0px 1px 5px 3px rgba(50,50,50,0.25); box-shadow: 0px 1px 5px 3px rgba(50,50,50,0.25); } .zhuantiNext { outline:none; right:0px; background-size: auto 30%; background-position:10px center; -webkit-box-shadow: 0px 1px 5px 3px rgba(50,50,50,0.25); -moz-box-shadow: 0px 1px 5px 3px rgba(50,50,50,0.25); box-shadow: 0px 1px 5px 3px rgba(50,50,50,0.25); } .friendlinks { background:#F8F8F8; color:#333; padding:0; font-size:18px; border-top:1px solid rgba(0,0,0,0.1); } .friendlinks-type .index-title { padding:0; line-height:50px; color:#316DBF; font-weight:bolder;} .friendlinks-type ul { list-style-type:none; margin:0; padding:0; border-left:1px solid rgba(0,0,0,0.1); } .friendlinks-type li { text-align:left; line-height:50px; border-right:1px solid rgba(0,0,0,0.1); cursor:pointer; font-size:16px; } .friendlinks-type li a { display:block; width:100%; } .friendlinks-type li.active { color:#316DBF; } .friendlinks-type li i { float:right; font-size:24px; } /*.friendlinks-type li.active i { animation-name:arrowmove; animation: arrowmove 0.8s ease 0s normal none; -moz-animation: arrowmove 0.8s ease 0s normal none; -webkit-animation: arrowmove 0.8s ease 0s normal none; -o-animation: arrowmove 0.8s ease 0s normal none; }*/ .friendlinks-c { padding:0px 0 0 100px; } .friendlinks-box { padding:20px 0; list-style-type:none; margin:0 0 0 -15px; display:none; } .friendlinks-box:nth-child(1) { } .friendlinks-box:nth-child(2) { margin-right:15px; } .friendlinks-box li { padding:0px 0 15px 15px; width:275px; float:left; } .friendlinks-c a { color:#666; font-size:14px; display:inline-block; padding:0 10px 0px; display: flex; justify-content: center; flex-direction: column; height:60px; line-height:1.6; text-align:center; border:1px solid #EEE; border-radius:5px; } .friendlinks-c a:hover { color:#316DBF; } /*@-webkit-keyframes arrowmove{from{transform:rotate(0deg);-ms-transform:rotate(0deg); -moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);} to{transform:rotate(360deg);-ms-transform:rotate(360deg); -moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);} } @-moz-keyframes arrowmove{from{transform:rotate(0deg);-ms-transform:rotate(0deg); -moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);} to{transform:rotate(360deg);-ms-transform:rotate(360deg); -moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);} } @keyframes arrowmove{from{transform:rotate(0deg);-ms-transform:rotate(0deg); -moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);} to{transform:rotate(360deg);-ms-transform:rotate(360deg); -moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);} }*/ /* css of sub pages */ .sub-banner { position:relative; width:100%; height:300px; overflow:hidden; text-align:center; z-index:0; } .sub-banner:before { content:''; display:block; position:absolute; left:0; top:0; width:100%; height:300px; background:rgba(0,0,0,0.4); z-index:0; } .col-title { font-size:36px; margin-top:100px; font-weight:bolder; color:#FFF; text-align:center; display:inline-block; padding:3px 30px 7px 40px; position:relative; z-index:1; } .col-title:before { content:''; display:block; position:absolute; left:0; bottom:0; width:60px; height:32px; background:url('../images/bg2.png') no-repeat left top; z-index:1; } .col-title:after { content:''; display:block; position:absolute; right:0; top:0; width:60px; height:32px; background:url('../images/bg2.png') no-repeat left top; z-index:1;transform:rotate(180deg);-ms-transform:rotate(180deg); -moz-transform:rotate(180deg);-webkit-transform:rotate(180deg);-o-transform:rotate(180deg); } .sub-type { padding:10px 0px 0 0; margin-top:-50px; background-image:linear-gradient(to right,#51AAEC 0px,#316DBF 100%); background-repeat:repeat-y; background-position:left top; height:100px; font-size:26px; color:#FFF; border-radius:10px; -webkit-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.25); -moz-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.25); box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.25); text-align:center; } .sub-type a { display:inline-block; width:auto; padding:0 15px; margin:0 10px; height:90px; line-height:85px; text-align:center; color:#B8DDF7; border-bottom:3px solid transparent; position:relative; outline: none; } .sub-type a:after { content:''; display:block; width:0px; height:0px; position:absolute; left:50%; bottom:0; margin-left:-6px; } .sub-type a.active,.sub-type a:hover { color:#FFF; border-color:#FFF; } .sub-type a.active:after,.sub-type a:hover:after { border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 5px solid #FFF; } .dir { height:50px; line-height:50px; color:#999; border-bottom:1px solid #EEE; background:#EEE; } .dir .container { } .dir a { color:#999; } .position { text-align:left; color:#666; } .position a { color:#666; } .position a:last-child, .position i { color:#316DBF; } .sub-main { padding:0px 0 50px; min-height:300px; margin-top:0px; } .sub-main .container { position:relative; } .sub-main .dir { background:#FFF; margin-bottom:15px; } .sub-title { padding:0px 0px 0; text-align:center; margin-bottom:20px; margin-top:100px; } .sub-title h1 { margin:0 0 0px; padding:0 0px 0; font-size:40px; line-height:1em; color:#000; font-weight:normal; width:auto; display: inline-block; } .sub-title h1:before { content:''; display: inline-block; width:48px; height: 24px; margin-right:15px; background-image:url('../images/dot.png'); background-repeat:repeat; background-position:left 0px; } .sub-title h1:after { content:''; display: inline-block; width:48px; height: 24px; margin-left:15px; background-image:url('../images/dot.png'); background-repeat:repeat; background-position:left 0px; } .sub-info { text-align:center; color: #999; padding: 0 0 20px;} h1.title { text-align:center; font-size:30px; margin:0; padding:30px 50px 20px; margin-top:50px; color:#333; } .sub-main article { height:auto; font-size:16px; line-height:2.2em; padding:0 20px; } .sub-main article p { margin:0; } .sub-main article img { max-width:100%; padding:15px; } .article-relative { border-top:1px solid #DDD; padding-top:15px; color:#999; margin-top: 50px; font-size:16px; } .article-relative-item { padding:15px 20px; line-height:20px; } .article-relative-item i { font-size:14px; margin:0px 0px 0 0px; } .article-relative-item a { color:#316DBF; outline:none; } .article-relative-item:hover { background:#FFF; -webkit-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); -moz-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); } .about-group { background-image:linear-gradient(to right,#51AAEC 0px,#316DBF 100%); background-repeat:repeat-y; background-position:left top; position:relative; } .about-group:before { content:''; display:block; position:absolute; width:100%; height:100%; bottom:0; left:0; background:url('../images/bg3.png') no-repeat center bottom; } .about-group-box { text-align:center; color:#FFF; padding:70px 0 50px; font-size:24px; font-weight:bolder; line-height:1em; } .about-group-box strong { font-size:60px; margin-right:10px; font-weight:normal; } .about-group-box h5 { font-size:16px; font-weight:normal; margin:20px 0 0; padding:0; } .about-certs { padding:50px 0 50px; background:#F4F4F4; } .business-project { padding:30px 0; } .business-project ul { list-style-type: none; margin:0px 0; padding:30px 20px 30px 0; } .business-project li { text-align: center; padding:0 0px 20px 20px; } .business-project li a { display:block; position:relative; border-radius:10px; overflow:hidden; background:#F4F4F4; padding-bottom:30px; z-index:0; height:450px; } .business-project li .pzoom { width:100%; height:0; padding-bottom:68.9%; margin:0 auto; position: relative; overflow: hidden; } .business-project li .pzoom .pic-box { width:100%; height: 100%; position: absolute; } .business-project .pzoom .pic-box img { width:100%; height: 100%; object-fit: contain; } .business-project li h3 { height:40px; font-weight:bold; line-height:40px; font-size:20px; text-align:center; margin:40px 0 20px; width:100%; padding:0 25px; position:relative; z-index:1; } .business-project li h3 i { display:block; width:60px; height:60px; line-height:60px; border-radius:30px; text-align:center; color:#FFF; font-size:30px; background-image:linear-gradient(to bottom,#51AAEC 0px,#316DBF 100%); background-repeat:repeat-y; background-position:left top; margin-left:-30px; position:absolute; left:50%; top:-70px; } .business-project li h3:after { content:''; display:block; width:60px; height:1px; background:#316DBF; margin:5px auto 0px; } .business-project li small { font-size:16px; display: block; color:#666; padding:0px 25px; line-height:1.8em; max-height:3.6em; overflow: hidden; text-align:justify; z-index:1; position:relative; } .business-project li .mask { position:absolute; left:0; top:100%; width:100%; height:100%; background-image:linear-gradient(to bottom,rgba(80,163,234,0.9) 0px,rgba(49,109,191,0.9) 100%); background-repeat:repeat-y; background-position:left top; z-index:0; } .business-project .index-more a { width:160px; height:40px; color:#666; font-size:16px; line-height:38px; border-radius:20px; } .business-project .index-more a:hover { color:#FFF; } .business-project li:hover .mask { top:0px; top:0; transition: all 0.5s; } .business-project li:hover h3 { color:#FFF; margin-top:-100px; transition: all 0.5s; } .business-project li:hover h3 i { background:none; } .business-project li:hover small { color:#FFF; margin-top:0px; max-height:7.2em; transition: all 0.5s; } .business-project li:hover h3:after { background:#FFF; } .news-list { margin:20px 0 20px 0px; padding:0; list-style-type:none; } .news-list li { margin:0; padding:0px 0px; position:relative; } .news-list li a { display:block; width:100%; padding:40px 20px; min-height:250px;background:#FFF; } .news-list li:after { content:''; width:100%; height:3px; left:0; bottom:0; position:absolute; background:#EEE; } .news-list li .list-item-pic { padding-left:10px; padding-right:40px; } .news-list li .pzoom { width:100%; height:0; padding-bottom:69%; margin:0 auto 5px; position: relative; overflow: hidden; border-radius:10px; } .news-list li .pzoom .pic-box { width:100%; height: 100%; position: absolute; } .news-list li .pzoom .pic-box img { width:100%; height: 100%; object-fit: contain; border-radius:10px; } .news-list li h3 { font-size:22px; margin:0 0 10px; padding:0px 0 0px 0px; line-height:1.8; color:#333; } .news-list li:hover h3 { color:#316CBF; font-weight:bold; } .news-list li small { font-size:16px; display: block; color:#666; padding:0px; line-height:2em; max-height:4em; overflow: hidden; margin-bottom: 10px; margin-right:200px; text-align:justify; } .news-list li .item-time { color:#999; font-size:16px; line-height:1em; margin-bottom:10px; } .news-list li .item-time i { color:#CCC; font-size:18px; margin-right:5px; } .news-list li .item-more { font-size:16px; color:#666; float:right; width:160px; height:40px; line-height:38px; border-radius:20px; border:1px solid #EEE; text-align:center; margin-top:-60px; } .news-list li .item-more i { font-size:18px; margin-left:5px;} .news-list li:hover .item-more { color:#FFF; background:#316CBF; border-color:#316CBF; } .news-list li:hover:after { background:#316DBF; animation-name:linemove; animation: linemove 0.8s ease 0s normal none; -moz-animation: linemove 0.8s ease 0s normal none; -webkit-animation: linemove 0.8s ease 0s normal none; -o-animation: linemove 0.8s ease 0s normal none; } .news-list li.news-top a { border-radius:10px; padding:30px 40px; margin-top:50px; margin-bottom:50px; -webkit-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); -moz-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); } .news-list li.news-top .list-item-pic { padding-left:0px; padding-right:50px; } .news-list li.news-top h3 { font-size:24px; } .news-list li.news-top small { color:#999; max-height:6em; margin-right:0; margin-top:10px; } .news-list li.news-top .item-time { color:#333; border-bottom:3px solid #316DBF; display:inline-block; line-height:35px; } .news-list li.news-top .item-more { margin-top:25px; float:left; } @-webkit-keyframes linemove{from{width:0;} to{width:100%;} } @-moz-keyframes linemove{from{width:0;} to{width:100%;} } @keyframes linemove{from{width:0;} to{width:100%;}} .photo-list { margin:70px 0 0 -40px; padding:0; list-style-type:none; } .photo-list li { padding:0px 0 50px 40px; margin: 0; } .photo-list li a { display:block; width:100%; padding:20px; border-radius:10px; background:#FFF; min-height:41em; position:relative; outline:none; } .photo-list li .pzoom { width:100%; height:0; padding-bottom:69%; margin:0 auto 10px; position: relative; overflow: hidden; } .photo-list li .pzoom .pic-box { width:100%; height: 100%; position: absolute; } .photo-list li .pzoom .pic-box img { width:100%; height: 100%; object-fit: contain; } .photo-list li h3 { max-height:3.2em; line-height:1.6em; font-size:20px; text-align:justify; margin: 0 0 10px; color:#333; overflow:hidden; } .photo-list li small { font-size:16px; display: block; color:#999; padding:0px; line-height:2em; max-height:4em; overflow: hidden; margin-bottom: 10px; text-align:justify; } .photo-list li .item-time { color:#FFF; font-size:16px; text-align:center; line-height:1em; position:absolute; left:0; top:10px; width:123px; height:35px; line-height:35px; background:url('../images/bg4.png') no-repeat left top; } .photo-list li a:hover { -webkit-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); -moz-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); } .photo-list li a:hover h3 { color:#316DBF; } .notice-list { margin:20px 0 20px 0px; padding:0; list-style-type:none; } .notice-list li { margin:0; padding:30px 20px; position:relative; } .notice-list li:after { content:''; width:100%; height:1px; left:0; bottom:0; position:absolute; background:#EEE; } .notice-list li a { display:block; width:100%; padding:0px 0px; outline:none; } .notice-list li h3 { font-size:22px; margin:0 0 10px; padding:0px 0 0px 0px; line-height:30px; color:#333; } .notice-list li h3 i { margin-right:0px; font-size:26px; color:#999; } .notice-list li small { font-size:16px; display: block; color:#666; padding:0px 50px 0 38px; line-height:2em; max-height:4em; overflow: hidden; text-align:justify; } .notice-list li .item-time { color:#999; font-size:16px; margin-left:38px; } .notice-list li:hover h3 { color:#316CBF; } .notice-list li:hover h3 i { margin-left:10px; } .notice-list li:hover:after { background:#316DBF; animation-name:linemove; animation: linemove 0.8s ease 0s normal none; -moz-animation: linemove 0.8s ease 0s normal none; -webkit-animation: linemove 0.8s ease 0s normal none; -o-animation: linemove 0.8s ease 0s normal none; } .hr { padding:20px 0; } .hr-pic img { max-width:100%;} .hr-c { line-height:2em; font-size:16px; padding:50px; } .hr-c h5 { color:#316CBF; font-size:20px; margin:0 0 10px; padding:0; font-weight:bold; } .case-list ul { margin:0 0 0 -40px; padding:0; list-style-type:none; } .case-list li { padding:0px 0 100px 40px; margin: 0; } .case-list li a { display:block; width:100%; background:#FFF; padding:20px; -webkit-box-shadow: 0px 5px 10px 3px rgba(40,40,40,0.1); -moz-box-shadow: 0px 5px 10px 3px rgba(40,40,40,0.1); box-shadow: 0px 5px 10px 3px rgba(40,40,40,0.1); } .case-list li a:hover { -webkit-box-shadow: 0px 5px 10px 3px rgba(40,40,40,0.1); -moz-box-shadow: 0px 5px 10px 3px rgba(40,40,40,0.1); box-shadow: 0px 5px 10px 3px rgba(40,40,40,0.1); } .case-list li .pzoom { width:100%; height:0; padding-bottom:67%; margin:0 auto 5px; position: relative; overflow: hidden; } .case-list li .pzoom .pic-box { width:100%; height: 100%; position: absolute; } .case-list li .pzoom .pic-box img { width:100%; height: 100%; object-fit: contain; } .case-list li h3 { height:30px; line-height:30px; font-size:18px; text-align:center; margin: 0; } .case-list li .case-more { width:160px; height:50px; text-align: center; margin: 10px auto; border:1px solid #FF9900; color:#FF9900; font-size:16px; line-height: 50px; } .case-list li a:hover .case-more { color:#FFF; background:#316CBF; } .contact-c { text-align:left; padding:50px 0 50px; margin:-200px 0 0;} .contact-item { padding:0px 20px; } .contact-box { padding:40px 30px 0; height:300px; background:#FFF; border-radius:10px; -webkit-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); -moz-box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); box-shadow: 0px 1px 10px 3px rgba(50,50,50,0.1); } .contact-item-i { border-radius:40px; width:80px; height:80px; background:#F8F8F8; text-align:center; display: flex; justify-content: center; flex-direction: column; color:#316CBF; font-size:40px; margin:0 auto 15px; } .contact-item-c { padding:0px 0 0px; text-align:center; } .contact-c h3 { font-size:20px; font-weight: normal; padding: 0 0 20px; margin: 0; text-align:center; color:#316CBF; } .contact-c p { margin:0; line-height: 1.6em; font-size:24px; color:#333; } .map { padding:0px 0;} .map img { max-width: 100%;} .content-qr { text-align:left; padding:0px 0 20px 50px; } .contact-qr-c { text-align:center; display: inline-block; } .content-qr img { width:120px; border:1px solid #E0E0E0; padding:10px; } /* box */ .box-bg { background-color:rgba(0,0,0,0.6); position:fixed; width:100%; height:100%; left:0; top:0; z-index:10; display:none; } .box { background-color:#FFF; position:fixed; width:930px; height:667px; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:11; padding:10px 30px; display:none; } .box-close { text-align:right; padding-right:30px; background:url('../images/ico_close.png') no-repeat right center; cursor:pointer; } .box-c { text-align:center; max-width:100%; max-height:640px; } /* update 2021.6.10 */ .sub-left { padding:20px 0 100px; margin-top:30px; background-image:linear-gradient(to bottom,#FFF 0px,#DDD 70px,#DDD 80%, #FFF 100%); background-repeat:repeat-y; background-position:right top; background-size:1px auto; } .sub-left dl { list-style-type:none; margin:0; padding:0; } .sub-left dt { font-size:24px; font-weight:bolder; border-bottom:3px solid #316CBF; color:#316CBF; text-align:center; line-height:60px; height:75px; position:relative; } .sub-left dt:after { content:''; display:block; width:0px; height:0px; position:absolute; left:50%; bottom:0; margin-left:-6px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 5px solid #316CBF; } .sub-left dd a { display:block; width:100%; font-size:18px; line-height:60px; height:60px; border-bottom:1px solid #DDD; text-align:center; outline:none; } .sub-left dd.active a { color:#316CBF; font-weight:bold; } .sub-right { padding:10px 0 0 50px; }