.banner .slider { position: relative; width: 1440px; margin: 0 auto; height: 550px; overflow: hidden; } .banner .slides { height: 100%; /* Simple clear fix */ overflow: hidden; list-style: none; -webkit-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000); -moz-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000); -ms-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000); -o-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000); transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000); } .simple-article{ font-size:16px; } .banner .slide { height: 100%; float: left; clear: none; background: url(../images/banner.png) no-repeat center; background-size: cover !important; } .banner .slide a{ width: 100%; height: 100%; display: block; } .banner .slider-arrows {} .banner .slider-arrow { position: absolute; display: block; text-decoration: none; width: 100px; height: 100%; top: 0; text-indent: 999px; opacity: 0; overflow: hidden; } .banner .slider:hover .slider-arrow{ opacity: 1; } .banner .slider-arrow--left:before{ position: absolute; left: 0; top:0; content: ''; width:100%; height:100%; background:url(../images/banner_left.png) no-repeat center; background-size:cover; } .banner .slider-arrow--right:before{ position: absolute; left: 0; top:0; content: ''; width:100%; height:100%; background:url(../images/banner_right.png) no-repeat center; background-size:cover; } .banner .slider-arrow--right { right: 0;background: url(../images/banner_left2.png) no-repeat center; } .banner .slider-arrow--right:hover { right: 0;background: url(../images/banner_left22.png) no-repeat center; } .banner .slider-arrow--left { left: 0; background: url(../images/banner_left1.png) no-repeat center; } .banner .slider-arrow--left:hover { left: 0; background: url(../images/banner_left11.png) no-repeat center; } .banner .slider-nav { position: absolute; bottom: 30px; } .banner .slider-nav__item { width: 11px; height: 11px; border-radius: 50%; clear: none; border: 1px solid #fff; display: inline-block; margin: 0 7px; } .banner .slider-nav__item:hover { background: #fff;} .banner .slider-nav__item--current { background: #fff;} .in_top{ margin-top: 50px; } .in_top .banner{ width: 550px; height: 374px; float: left; } .in_top .banner .slider{ width: 100%; height: 100%; } .in_top .banner p{ background: rgba(0,0,0,0.6); position: absolute; left: 0; bottom: 0; width: 100%; line-height: 45px; color: #fff; text-indent: 15px; } .in_top .banner .slide{ position: relative; } .in_top .banner p span{ padding-right: 140px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; } .in_top .banner .slider-nav{ bottom: 10px; left: inherit !important; margin-left: 0 !important; right: 10px; } .in_top .tab a{ font-size: 20px; float: left; line-height: 50px; width: 140px; text-align: center; background: #fafcfd; } .in_top .font{ width: 600px; float: right; } .in_top .tab{ background: #fafcfd; } .in_top .tab a.active, .in_top .tab a:hover{ color: #247bd7; } .in_top .tab a span{ padding-left: 22px; display: inline-block; } .in_top .tab a .ico1{ padding-left: 25px; background: url(../images/in_top_ico1.png) no-repeat left; } .in_top .tab a .ico2{ padding-left: 25px; background: url(../images/in_top_ico2.png) no-repeat left; } .in_top .tab a.active .ico1, .in_top .tab a:hover .ico1{ background: url(../images/in_top_ico11.png) no-repeat left; } .in_top .tab a.active .ico2, .in_top .tab a:hover .ico2{ background: url(../images/in_top_ico22.png) no-repeat left; } .in_top .main .a1{ font-size: 24px; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 15px; } .in_top .main .a1:hover{ color: #247bd7; } .in_top .main .p1{ color: #999; font-size: 14px; margin: 5px 0 30px; line-height: 18px; } .in_top .main li{ line-height: 28px; margin-top: 8px; position: relative; } .in_top .main li a{ margin-left: 15px; width: 520px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; float: left; color: #333; font-size: 15px; } .in_top .main li a:hover{ color: #1b6bc0; } .in_top .main li:before{ content: ''; position: absolute; left: 0; top: 0; height: 30px; width: 20px; background: url(../images/in_top_dot.png) no-repeat left; } .in_top .main li span{ float: right; font-size: 12px; color: #999; } .in_top{ margin-bottom: 50px; } .in_mid{ margin-top: 50px; } .in_mid .left{ width: 810px; float: left; } .in_mid .left dl{ width: 370px; margin-bottom: 40px; float: left; margin-right: 70px; } .in_mid .left dl:nth-of-type(2n){ margin-right: 0; } .in_mid .left dl dt{ background: #ebf5ff; color: #247bd7; line-height: 40px; margin-bottom: 20px; border-radius: 40px; font-size: 20px; } .in_mid .left dl dt a{ float: right; font-size: 14px; margin-right: 23px; } .in_mid .left dl dt a:hover{ text-decoration: underline; } .in_mid .left dl dt span{ margin-left: 23px; display: inline-block; padding-left: 30px; } .in_mid .left dl dt .ico1{ background: url(../images/in_mid1.png) no-repeat left; } .in_mid .left dl dt .ico2{ background: url(../images/in_mid2.png) no-repeat left; } .in_mid .left dl dt .ico3{ background: url(../images/in_mid3.png) no-repeat left; } .in_mid .left dl dt .ico4{ background: url(../images/in_mid4.png) no-repeat left; } .in_mid .left dl dd{ padding-left: 13px; line-height: 30px; margin-top: 4px; background: url(../images/in_top_dot.png) no-repeat left; } .in_mid .left dl dd a{ float: left; font-size: 15px; color: #333; white-space:nowrap; overflow: hidden; text-overflow: ellipsis; width: calc( 100% - 40px ); } .in_mid .left dl dd a:hover{ color: #247bd7; } .in_mid .left dl dd .date{ float: right; color: #999; font-size: 12px; } .in_mid .right{ width: 322px; float: right; } .in_mid .right a{ position: relative; margin-bottom: 40px; } .in_mid .right a p{ position: absolute; left: 0; bottom: 0; line-height: 50px; color: #fff; font-size: 20px; text-align: center; width: 100%; } .in_mid .right img{ width: 322px; height: 225px; } .in_title{ background: #f7fbff; line-height: 50px; } .in_title span{ background: #247bd7; color: #fff; float: left; width: 140px; text-align: center; } .in_title span i{ font-size: 20px; color: #fff; padding-left: 25px; } .in_title span .ico1{ background: url(../images/in_end1.png) no-repeat left; } .in_title span .ico2{ background: url(../images/in_end2.png) no-repeat left; } .in_title em{ color: #333; float: left; font-size: 16px; margin-left: 25px; } .in_title a{ color: #71869b; float: right; margin-right: 10px; } .in_end{ margin-top: 60px; } .in_end:nth-of-type(1){ margin-top: 20px; } .in_end .list{ margin-top: 35px; } .in_end .list li{ margin-right: 15px; float: left; overflow: hidden; width: 228px; position: relative; } .in_end .list li img{ width: 228px; height: 150px; } .in_end .list li:last-child{ margin-right: 0; } .in_end .list li p{ position: absolute; bottom: 5px; width: 100%; text-align: right; font-size: 24px; color: #fff; z-index: 2; } .in_end .list li p span{ text-align: right; margin-right: 15px; padding-right: 36px; background: url(../images/in_end_dot.png) no-repeat right; } .in_end .list .show{ position: absolute; left: 0; top: 100%; width: 100%; height: 100%; transition: 0.3s all; background: rgba(66,153,245,0.7); text-align: center; } .in_end .list li:hover .show{ top: 0; } .in_end .list li:hover p{ display: none; } .in_end .list .show em{ position: absolute; top: 50%; width: 100%; left: 0; transform: translate(0,-50%); } .in_end .list .show i{ width: 26px; height: 26px; display: block; margin: 0 auto; background: url(../images/in_end_dot.png) no-repeat center; } .in_end .list .show span{ font-size: 26px; color: #fff; margin-top: 15px; display: block; } .in_end .list .mask{ position: absolute; bottom: 0; width: 100%; height: 50%; background-image: linear-gradient(rgba(0,0,0,0.01), rgba(0,0,0,0.7)); } .in_end .main{ font-size: 15px; color: #333; margin-top: 30px; } .in_end .main a{ display: inline-block; line-height: 36px; } .in_end .main a:hover{ color: #247bd7; } .in_end .main span{ margin: 0 15px; } .all_left{ width: 300px; margin-top: -45px; } .left_title{ background: #1b6bc0; color: #fff; padding: 15px 0 15px 50px; margin-bottom: 3px; } .left_title .p1{ font-size: 26px; line-height: 40px; font-weight: bold; } .left_title .p2{ opacity: 0.5; font-size: 12px; font-weight: "Arial"; line-height: 20px; } .all_left { float: left; width: 300px; } .all_left .main .btn{ background: #f4faff; line-height: 60px; font-size: 16px; color: #333; position: relative; } .all_left .main li{ position: relative; } .all_left .main li:before{ content: ''; position: absolute; left: 0; top: 0; height: 100%; width: 4px; z-index: 2; transition: 0.3s all; background: #1b6bc0; } .all_left .main .btn span{ margin-left: 30px; padding-left: 25px; display: inline-block; line-height: 30px; background: url(../images/all_left.png) no-repeat left; } .all_left .main .btn i{ position: absolute; right: 0; top: 0; width: 60px; display: none; height: 60px; transition: 0.3s all; background: url(../images/all_left1.png) no-repeat center #e0eaf2; background-size: 10px; } .all_left .main li.active1 .btn i, .all_left .main li.active .btn i, .all_left .main li:hover .btn i{ background: url(../images/all_left2.png) no-repeat center #105fb4; background-size: 10px; } .all_left .main li.active1:before, .all_left .main li.active:before, .all_left .main li:hover:before{ background: #ffa200 } .all_left .main li.active1 .btn, .all_left .main li.active .btn, .all_left .main li:hover .btn{ background: #1b6bc0; color: #fff; } .all_left .main li.active1 .btn span, .all_left .main li.active .btn span, .all_left .main li:hover .btn span{ background: url(../images/all_left11.png) no-repeat left; } .all_left .main li .show a{ text-indent: 65px; line-height: 48px; color: #333; border-top: 1px solid #e8f0f9; } .all_left .main li .show a:hover{ color: #1b6bc0; } .all_left .main li .show a.active{ color: #1b6bc0; } .all_right{ width: 850px; float: right; margin-top: 60px; } .all_left .main li .show{ display: none; } .all_left .main li.active .show{ display: block; } .all_right .title em{ font-size: 24px; font-weight: bold; color: #1b6bc0; line-height: 40px; padding-left: 30px; background: url(../images/all_right_title.png) no-repeat left; } .all_right .title{ border-bottom: 1px solid #1b6bc0; padding-bottom: 10px; } .all_right .bread span, .all_right .bread a:last-child{ display: inline-block; color: #333; } .all_right .bread a{ color: #999; display: inline-block; } .all_right .bread{ padding-left: 20px; line-height: 40px; background: url(../images/home.png) no-repeat left; } .all_right .bread a:hover{ color: #1b6bc0; } .about .simple-article{ margin-top: 50px; } .about .simple-article .p1{ color: #333; font-weight: bold; margin-bottom: 30px; font-size: 30px; } .about .simple-article .p2{ font-size: 16px; line-height: 30px; color: #333; } .team .all_right .main{ position: relative; margin: 50px 0 40px; } .team .all_right .main .mask{ position: absolute; left: 0; top: 0; width: 100%; cursor: pointer; height: 100%; text-align: center; opacity: 0; transition: 0.3s all; visibility: hidden; background: rgba(0,0,0,0.4); } .team .all_right .main:hover .mask{ opacity: 1; visibility: visible; } .team .all_right .main .mask i{ width: 50px; height: 50px; display: block; margin: 0 auto; background: url(../images/view.png) no-repeat center; } .team .all_right .main .mask .p1{ color: #fff; font-size: 18px; font-weight: bold; margin-top: 20px; display: block; } .team .all_right .main .mask p{ position: absolute; left: 0; width: 100%; top: 50%; transform:translate(0,-50%); } .show_big{ position: fixed; left: 50%; top: 50%; z-index: 3; display: none; transform:translate(-50%,-50%); } .show_big img{ width: inherit; max-width: inherit; height: 100%; } .show_big_mask{ position: fixed; left: 0; width: 100%; display: none; height: 100%; background: rgba(0,0,0,0.5); top: 0; z-index: 2; } #map{ width: 100%; height: 280px; } #map img{ max-width: inherit; } .contact .all_right .main{ margin-top: 50px; } .contact .all_right .main dl{ margin-top: 30px; margin-bottom: 65px; } .contact .all_right .main dl dd{ width: 50%; line-height: 30px; margin-top: 10px; float: left; } .contact .all_right .main dl dd span{ color: #999; font-size: 14px; } .contact .all_right .main dl dd em{ color: #333; font-size: 16px; } .contact .all_right .main .title{ border-bottom: 0; } .contact .all_right .main input{ width: 48%; margin-right: 4%; border: 1px solid #d6dde5; color: #1b6bc0; text-indent: 15px; line-height: 48px; font-size: 14px; box-sizing: border-box; float: left; } .contact .all_right .main input:nth-of-type(2){ margin-right: 0; } .contact .all_right .main textarea:-ms-input-placeholder, .contact .all_right .main input:-ms-input-placeholder{ color: #1b6bc0; } .contact .all_right .main textarea::-moz-placeholder, .contact .all_right .main input::-moz-placeholder{ color: #1b6bc0; } .contact .all_right .main textarea:-moz-placeholder, .contact .all_right .main input:-moz-placeholder{ color: #1b6bc0; } .contact .all_right .main textarea::-webkit-input-placeholder, .contact .all_right .main input::-webkit-input-placeholder { color: #1b6bc0; } .contact .all_right .main textarea{ width: 100%; border: 1px solid #d6dde5; text-indent: 15px; padding-top: 10px; font-size: 14px; margin-top: 25px; line-height: 20px; height: 170px; } .contact .all_right .main .btn1{ width: 410px; line-height: 50px; border: 1px solid #1b6bc0; box-sizing: border-box; background: inherit; color: #1b6bc0; font-size: 18px; margin-top: 45px; } .contact .all_right .main .btn1:hover{ background: #1b6bc0; color: #fff; } .news_detail .main .p1{ text-align: center; font-size: 30px; font-weight: bold; color: #333; margin-top: 50px; } .news_detail .main .p2{ text-align: center; margin-bottom: 50px; margin-top: 20px; } .news_detail .main .p2 span{ display: inline-block; margin: 0 10px; color: #999; } .news_detail .main .p2 em{ color: #333; } .np a{ display: inline-block; color: #333; } .np a:hover{ color: #266dba; } .np{ margin-top: 40px; } .news .main .list li{ line-height: 58px; border-bottom: 1px solid #e7eff7; } .news .main .list li:hover{ background: #f4faff; } .news .main .list li a{ float: left; color: #333; white-space: nowrap; overflow: hidden; width: calc( 100% - 105px ); text-overflow: ellipsis; font-size: 16px; margin-left: 10px; } .news .main .list li a:hover{ color: #1b6bc0; } .news .main .list li span{ float: right; margin-right: 10px; color: #999; } .paging { text-align:center; padding: 50px 0 0; } .paging li { display:inline-block; border-radius: 2px; margin-right:4px; } .paging li p{ font-size: 14px; } .paging li.style { height:23px; width: 23px; display: inline-block; text-align:center; line-height:23px; border: 1px solid #dcdcdc; color: #999; } .paging li.active a, .paging li.style a:hover { border: 1px solid #146ee8; color: #146ee8; } .paging li.style a { color:#666; font-size: 12px; } .paging li.active a{ color: #146ee8; } .paging a { border-radius: 2px; display:block; } .code_list .list{ margin-top: 35px; } .code_list .list li{ width: 170px; float: left; margin-bottom: 45px; margin-right: 56px; } .code_list .list li:nth-of-type(4n){ margin-right: 0; } .code_list .list li img{ border:1px solid #c9c9c9; } .code_list .list li p{ font-size: 16px; color: #1b6bc0; text-align: center; margin-top: 15px; } .code_list .paging{ padding-top: 0; } .business_work .all_right{ width: 100%; } .business_work .list li{ margin-top: 60px; } .business_work .list .img{ float: left; } .business_work .list .img img{ width: 44px; } .business_work .list .img p{ font-size: 26px; color: #1b6bc0; font-weight: bold; margin-top: 10px; } .business_work .list dl{ float: right; width: 986px; } .business_work .list dl dd{ width: 32%; margin-right: 2%; background: #f3f9ff; font-size: 16px; border-radius: 8px; overflow: hidden; float: left; color: #1b6bc0; text-align: center; height: 110px; margin-bottom: 10px; line-height: 110px; } .business_work .list dl dd:nth-of-type(3n){ margin-right: 0; } .business_work .list dl dd a:hover{ background: #1b6bc0; color: #fff; }