@charset "utf-8"; /* 浏览器样式初始化 */ html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;font-size:14px;font-family:"Microsoft Yahei";line-height:2em} article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; } html,body{color:#333;overflow-x: hidden;} body{background:#f4f4f4;min-width: 1200px;} ul,ol,li{list-style:none} a{color:#333;text-decoration:none;} a:hover{text-decoration:none;-webkit-transition: background-color .2s ease;-moz-transition: background-color .2s ease;-ms-transition: background-color .2s ease;-o-transition: background-color .2s ease;transition: background-color .2s ease; } img{border:0} em,i,b{font-style: normal;font-weight: normal;} h1,h2,h3,h4,h5{font-weight:normal} .clear:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; } .clear { zoom:1; } .left { float:left; } .right { float:right; } .hide{ display:none;} .w1200{width: 1200px;margin: 0 auto;} /*延迟加载*/ .lazy {background: url("loading.gif") 50% 50% no-repeat;} .inner{width: 1200px;margin: 0 auto} .no-margin-right{margin-right: 0 !important;} /*分页框架*/ .pager {width:100%; color:#333; line-height:30px; padding:0; font-size:12px; text-align:center;} .pager a,.pager span { border: #cccccc 1px solid; padding:0px 8px; color: #666; text-decoration: none; font-size:12px; height:26px;line-height:26px;display:inline-block;margin:0 3px} .pager a:hover { border: #006599 1px solid; color: #fff; background-color: #006599; } .pager a:active { color: #fff; border: #006599 1px solid; background-color: #006599; } .pager span.now { color: #fff; border: #006599 1px solid; background-color: #006599; } .pager span.disabled { color: #ccc; border: #ccc 1px solid } /* search */ .search_index{padding:50px;background:#fff;} .search-title span{font-size:24px;color:#333;} .search-list li{font-size:14px;margin-bottom:7px;padding:7px 0px;border-bottom:1px solid #fff;} .search-list li span{float:right;} .search-list li:hover{border-bottom: 1px dashed #ececec;color:#008ee6;} .search-list li:hover a{color:#008ee6;} /* header */ .header{position: absolute;top: 0;left: 0;width: 100%;min-width: 1200px;background: rgba(255,255,255,.9);z-index: 999;} .header-inner{height: 90px;} .header-inner .header-logo{width: 185px;height: 71px;margin-top: 9px;background: url(images/logo.png);} .header-nav{margin-top: 35px;margin-left: 20px;} .header-nav li{display: inline-block;width: 100px;text-align: center;} .header-nav li a{font-size: 18px;color: #333;} .header-search{margin-top: 30px;} .header-search form{font-size: 0;line-height: 0;} .header-search .search-keyword{text-indent: 4px;width: 110px;height: 23px;background: #fff;border: 1px solid #d8dee4;border-right: none;outline: none;line-height: 0;} .header-search .submit{position: relative;top: 7px;width: 27px;height: 25px;background: url(images/submit-btn.png) no-repeat;border: none;outline: none;} .header .header-bottom{height: 4px;background: url(images/header-line.png) no-repeat;} /* i-banner */ .i-banner{position: relative;width: 100%;min-width: 1200px;overflow: hidden;} .i-banner .bd ul{width: 100% !important;} .i-banner .bd ul li{height: 760px;width: 100% !important;background-position: center center;} .i-banner .btn{position: absolute;top: 425px;width: 52px;height: 52px;font-size: 40px;color: #f8fcfe;} .i-banner .prev{left: 25px;} .i-banner .next{right: 25px;} .i-banner .i-banner-text{margin-top: 270px;} .i-banner-text h3{font-size: 48px;font-weight: bold;color: #006599;} .i-banner-text p{font-size: 18px;color: #fff;width: 690px;} .i-banner-text .i-banner-more{display: block;width: 232px;height: 58px;margin-top: 60px;border-radius: 5px;background: #73cd6d;color: #fff;font-size: 15px;text-align: center;line-height: 58px;letter-spacing: 0.5px;text-transform:uppercase;} .i-banner-text .i-banner-more:hover{box-shadow: 2px 2px 10px #777;} .banner{height: 424px;} /* i-nav */ .i-nav{padding: 75px 0 98px;} .i-nav ul{} .i-nav ul li{float: left;position: relative;top: 0;width: 140px;height: 210px;margin: 0 5px;background: #fefefe;border-radius: 10px;-webkit-transition: all .3s ease;transition: all .3s ease;} .i-nav ul li a{display: block;width: 100%;height: 100%;} .i-nav ul li.i-nav-li1, .i-nav ul li:hover{position: relative;top: -5px;background: #006599;box-shadow: 4px 4px 8px #a4c2d1;} .i-nav ul .i-nav-li1 a{background: url(images/i-nav-li1.png) center center no-repeat;} .i-nav ul .i-nav-li2 a{background: url(images/i-nav-li2.png) center center no-repeat;} .i-nav ul .i-nav-li3 a{background: url(images/i-nav-li3.png) center center no-repeat;} .i-nav ul .i-nav-li4 a{background: url(images/i-nav-li4.png) center center no-repeat;} .i-nav ul .i-nav-li5 a{background: url(images/i-nav-li5.png) center center no-repeat;} .i-nav ul .i-nav-li6 a{background: url(images/i-nav-li6.png) center center no-repeat;} .i-nav ul .i-nav-li7 a{background: url(images/i-nav-li7.png) center center no-repeat;} .i-nav ul .i-nav-li8 a{background: url(images/i-nav-li8.png) center center no-repeat;} /* i-product */ .i-product{} .i-product .product-slide{position: relative;width: 100%;} /*.i-product .hd a{position: absolute;top: 306px;font-size: 36px;color: #fff;z-index: 99;} .i-product .hd .prev{left: 40px;} .i-product .hd .next{right: 40px;} .i-product .tempWrap{} .i-product .tempWrap ul{height: 675px;overflow: hidden;}*/ .i-product .product-slide li{position: relative;width: 25% !important;float: left !important;height: 324px;margin-right: 0 !important;} .swiper-button-prev, .swiper-button-next{background: none !important;font-size: 40px;color: #76e3cf;} .i-product .icon-prev{left: 40px;} .i-product .icon-next{right: 40px;} .i-product-info{position: absolute;width: 90%;height: 102px; left: 5%; bottom: -16%; top: auto; color: #fff; transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; border-top: 1px solid rgba(255, 255, 255, .4); } .i-product-info-text{position: absolute;width: 100%;height: 100%;} /*.i-product-info-text p{color: #fff;font-size: 24px; padding-top: 20px;}*/ .i-product-info-bg{position: absolute;width: 100%;height: 100%; background: -webkit-linear-gradient(left,#6fc9ed, #74f2a7); background: -o-linear-gradient(right,#6fc9ed, #74f2a7); background: -moz-linear-gradient(right,#6fc9ed, #74f2a7); background: linear-gradient(right,#6fc9ed, #74f2a7); opacity: .8; } .i-product-info p{opacity: 1;} .i-product .product-slide li:hover .i-product-info{ bottom: 3%; /*opacity: .9; background: -webkit-linear-gradient(left,#6fc9ed, #74f2a7); background: -o-linear-gradient(right,#6fc9ed, #74f2a7); background: -moz-linear-gradient(right,#6fc9ed, #74f2a7); background: linear-gradient(right,#6fc9ed, #74f2a7);*/ } .i-product-info .title{ text-align: left; padding-top: 20px; padding-left: 10px; font-size: 16px;color: #fff; line-height: 24px; } .i-product-info .subtitle{ text-align: left; padding-left: 10px; font-size: 12px;color: #fff; } .i-product-info .description { background: transparent; border-left: 1px solid rgba(255, 255, 255, .8); border-radius: 0; padding-left: 0; bottom: 60px; height: 20px; display: block; right: 0; width: 36px; position: absolute; } .i-product-info .description:after { content: ''; display: block; background: url(images/icon.png) no-repeat 0 -71px; width: 14px; height: 9px; display: block; margin: 6px 0 0 11px; } /* i-about */ .i-about{background: #dbedf4;height: 580px;} .i-about-inner{position: relative;padding-top: 116px;} .i-about-video{position: absolute;top: 150px;width: 611px;height: 326px;z-index: 99;box-shadow: -2px -2px 25px #999;} .i-about-main{position: absolute;top: 116px;left: 43px;width: 1157px;height: 307px; background: -webkit-linear-gradient(#5bf69a, #57c7f5); /* Safari 5.1 - 6.0 */ background: -o-linear-gradient(#5bf69a, #57c7f5); /* Opera 11.1 - 12.0 */ background: -moz-linear-gradient(#5bf69a, #57c7f5); /* Firefox 3.6 - 15 */ background: linear-gradient(#5bf69a, #57c7f5); /* 标准的语法 */ } .i-about-main-inner{margin: 20px 40px 0 640px;} .i-about-main .i-about-title{font-size: 36px;color: #fff;font-weight: bold;} .i-about-line{display: block;width: 55px;height: 1px;background: #d5f2e7;margin: 10px 0 30px;} .i-about-main .i-about-text{font-size: 14px;color: #fff;line-height: 26px;} .i-about-more{display: block;width: 140px;height: 42px;margin-top: 45px;line-height: 42px;font-size: 16px;background: #00c0ff;color: #fff;text-align: center;} /* i-news */ .i-news{height: 707px;overflow: hidden;background: url(images/i-news-bg.jpg) center center no-repeat;} .i-news-inner{} .i-news-inner .i-news-title h3{margin: 60px 0 55px;font-size: 48px;color: #006599;font-weight: bold;text-align: center;} .i-news-inner .bd li{margin: 0 15px;width: 570px;overflow: hidden;} .i-news-inner .i-news-img{width: 555px;height: 247px;} .i-news-inner .i-news-text{width: 555px;height: 133px;padding: 17px;background: #fafafa;border: 1px solid #eee;box-sizing: border-box;position: relative;} .i-news-inner .i-news-text h4{font-size: 18px;color: #000;font-weight: bold;line-height: 22px;} .i-news-inner .i-news-text span{font-size: 12px;color: #a2a2a2;} .i-news-inner .i-news-text p{margin: 10px 0 6px;font-size: 14px;color: #777;line-height: 22px;padding-right: 30px;} .i-news-inner .i-news-text i{display: block;font-size: 13px;line-height: 14px;color: #006599;/*text-align: center;*/text-transform: uppercase;position: absolute;bottom: 11px;right: 17px;} .i-news-inner .hd{position: relative;margin-top: 40px;} .i-news-inner .hd ul{text-align: center;} .i-news-inner .hd li{display: inline-block;width: 15px;height: 6px;background: #cfcfcf;border-radius: 2px;cursor: pointer;} .i-news-inner .hd li.on{width: 30px;} /* i-problem */ .i-problem{position: relative;height: 593px;background: url(images/i-problem-bg.jpg) center center no-repeat;} .i-problem-inner{position: relative;margin: 0 auto;} .i-problem-bg{position: absolute;width: 50%;height: 100%;left: 50%;top: 0;background: rgba(40,113,180,.9);} .i-problem-slide{position: relative;height: 593px;} .i-problem-slide .left-wrap{height: 100%;width: 50%;position: relative;} .i-problem-slide .right-wrap{height: 100%;width: 50%;position: relative;} .left-wrap .i-problem-tab{position: absolute;right: 0;} .i-problem-tab{top: 122px;margin-left: 286px;} .i-problem-tab li{width: 315px;line-height: 69px;margin-bottom: 5px;background: rgba(255,255,255,.9);font-size: 16px;color: #006599;text-indent: 28px;} .i-problem-tab li .iconfont{font-size: 20px;margin-right: 20px;position: relative;top: 2px;} .i-problem-tab li.on{background: rgba(115,205,109,.9);color: #fff;} .i-problem-tab li.on .iconfont{font-size: 0;} .i-problem-text{top: 100px;left: 74px;z-index: 999;} .i-problem-text .i-problem-sum p{width: 380px;font-size: 14px;color: #fff;margin-left: 147px;} .i-problem-top{margin-bottom: 30px;} .i-problem-top h4{font-size: 36px;color: #fff;font-weight: bold;} .i-problem-top .i-problem-line{display: block;width: 55px;height: 1px;margin: 10px 0 30px;background: #f4f4f4;} .i-problem-main{} .i-problem-main li{line-height: 42px;} .i-problem-main li a{font-size: 14px;color: #fff;} .i-problem-main li span.icon-duihao{position: relative;top: 2px;color: #fff;margin-right: 15px;} /* footer */ .footer{height: 429px;position: relative;} .footer .footer-top{height: 0;border-top: 1px solid #e4e4e9;border-bottom: 1px solid #fff;} .footer-inner{padding-top: 100px;} .footer-inner .footer-share{} .footer-share .footer-share-text{font-size: 16px;color: #333;font-weight: bold;} .footer-share-copy p,.footer-share-copy p a{color: #909090;font-size: 14px;line-height: 46px;} .footer-share-icon{margin-top: 32px;margin-bottom: 15px;} .footer-share-icon a{display: inline-block;margin-right: 15px;font-size: 26px;} .footer-share-icon a:hover{color: #006599;} .footer-nav{} .footer-nav .footer-nav-inner{float: left;margin-right: 65px;} .footer-nav-inner h3{font-size: 18px;color: #333;margin-bottom: 20px;} .footer-nav-inner li{font-size: 14px;color: #909090;} .footer-nav-inner li a{color: #909090;line-height: 30px;} .foot-link{position: absolute;bottom: 0;width: 1200px;left: 50%;margin-left: -600px;color: #909090;border-top: 1px solid #d6d6d6;} .foot-link a{color: #909090;/*line-height: 50px;*/margin-right: 5px;} /* nav */ .nav{height: 60px;background: #006599;} .nav-inner ul{text-align: center;} .nav-inner ul li{position: relative;display: inline-block;width: 199px;padding: 0 10px;text-align: center;background: url(images/nav-li-bg.png) left center no-repeat;} .nav-inner ul li>a{display: inline-block;width: 199px;line-height: 60px;font-size: 18px;color: #fff;} .nav-inner ul li.on , .nav-inner ul li.on + li{background: none;} .nav-inner ul li.on>a{background: #73cd6d url(images/nav-bg.png) center bottom no-repeat;} .nav-inner ul li:first-child{background: none !important;} .nav-inner ul li:hover .product-nav{display: block;} .product-nav{position: absolute;width: 600px;display: none;} .product-nav .product-nav-list{float: left; padding: 10px; text-align: center; background: #eee; border-bottom: 1px solid #dad5d3; /*border-left: 1px solid #dad5d3;*/ border-right: 1px solid #dad5d3; } /* content */ .content{padding-top: 80px;padding-bottom: 70px;} .content-title{width: 560px;font-size: 24px;color: #333;line-height: 40px;margin-bottom: 30px;} .content-main p{font-size: 18px;color: #666;line-height: 26px;} /* ========== 关于我们 ========== */ /* 人才招聘 */ .about-job{} .about-job h4{font-size: 18px;color: #666;font-weight: bold;margin-top: 30px;} .about-job p{line-height: 28px;margin-top: 10px;} .about-job ul li{font-size: 18px;color: #666;line-height: 28px;} /* 合作伙伴 */ .about-partner{} .about-partner li{display: inline-block;margin: 0 32px 38px 0;} .about-partner li img{width: } /* ========== 产品中心 ========== */ .product{} .product-head{margin-bottom: 50px;} .product-head .product-head-img{width: 554px;height: 328px;} .product-head-text{margin-left: 596px;} .product-head-text .product-title{padding: 30px 0;border-bottom: 1px solid #e6e6e6;text-align: left;} .product-head-text .product-title h3{font-size: 24px;color: #333;} .product-head-text .product-title p{font-size: 14px;color: #666;} .product-head-jianjie{font-size: 16px;color: #65a2e0;font-weight: bold;} .product-title{margin-bottom: 40px;padding: 30px 0;border-bottom: 1px solid #e6e6e6;text-align: center;} .product-title h3{font-size: 24px;color: #333;line-height: 26px;} .product-title p{font-size: 14px;color: #666;} .product-main{margin-bottom: 60px;} .product-bottom{margin-bottom: 60px;} .product-main-content{width: 890px;margin: 0 auto;} .product-main-content p{font-size: 16px;color: #999;line-height: 28px;} .product-main .xnzb{margin-bottom: 40px;} .product-main .xnzb-title{margin-bottom: 20px;font-size: 18px;color: #999;font-weight: bold;line-height: 35px;text-indent: 46px;background: url(images/cpxn-bg.png) left center no-repeat;} /* ========== 新闻中心 ========== */ .main{background: #f4f4f4;} .news-list{padding-top: 107px;} .news-list .news-list-toutiao{margin-bottom: 50px;} .news-list .text{width: 610px;margin-right: 50px;height: 309px;position: relative;} .news-list .text .title{font-size: 24px;color: #666;display: block;margin: 20px 0;} .news-list .text p{font-size: 14px;color: #888;line-height: 24px;} .news-list .text span{position: absolute;left: 0;bottom: 18px;font-size: 14px;color: #888;} .news-list .text .share{position: absolute;right: 0;bottom: 18px;} .news-list-normal li{position: relative;line-height: 54px;border-top: 1px solid #e6e6e6;font-size: 14px;color: #666;text-indent: 20px;} .news-list-normal li .news-list-bg{position: absolute;width: 6px;height: 6px;background: #006599;left: 0;top: 24px;} .main .pager{padding: 40px 0 150px;} .news-title{margin-bottom: 50px;} .news-title h3{font-size:24px;text-align:center;margin:30px 0 20px;} .news-title p{font-size:14px;text-align:center;line-height:14px;} .articlepage-link{border-top:1px solid #ccc;padding:10px 0;margin-top:55px;} .articlepage-link li{color:#006599;font-size:14px;height:32px;line-height:32px} /* ========== 技术支持 ========== */ .wrap{/*background: #fff;*/} .download-list{padding-top: 117px;} .file-download{} .file-download-list{font-size: 16px;color: #666;border-bottom: 1px solid #e3e3e3;} .file-download-list p{line-height: 53px;} .file-download-list .download{background: #006599;width: 120px;line-height: 30px;text-align: center;color: #fff;margin-top: 12px;border-radius: 2px;} .case-list{padding-top: 117px;} .case-list li{float: left;margin-right: 45px;margin-bottom: 80px;} .case-list li img{} .case-list li h4{font-size: 20px;line-height: 40px;color: #333;text-indent: 20px;} .case-list li p{font-size: 14px;color: #888;text-indent: 20px;} .content-main iframe{margin: 0 auto;} .problem-list{padding-top: 97px;min-height: 800px;font-family: "Microsoft Yahei" !important;} .problem-list ul li{border-bottom: 1px solid #e3e3e3;cursor: pointer;transition: all .3s;} .problem-list .problem-title{text-indent: 10px;font-size: 16px;color: #666;line-height: 54px;} .problem-list ul li i{float: right;display: inline-block;width:12px;height:14px;position:relative;top:21px;right: 20px;} .problem-list ul li i span{display: block;width:12px;height:1.67px;background: #666666;position: absolute;top:6px;transition: all 0.3s;} .problem-list ul li i span:first-child{transform: rotate(90deg);-o-transform: rotate(90deg);-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);} .problem-list ul li .on .problem-title{background: #1f518e;} .problem-list ul li .on .problem-title{color:#fff;} .problem-list ul li .on span{background: #fff;} .problem-list ul li .on i span:first-child{transform: rotate(135deg)!important;} .problem-list ul li .on i span:last-child{transform: rotate(45deg);} .problem-list ul li .on i span{background: #fff!important;} .problem-list .on{background: #006599;color: #fff;} .problem-list .problem-text{padding-top: 20px;} .problem-list .problem-text p{line-height: 30px;} .problem-slide h3.on em{background: url(images/problem-list-bg.png) 0 -20px no-repeat;} .problem-slide .problem-title em{float: right;margin-right: 13px;width: 16px;height: 16px;margin-top: 18px;background: url(images/problem-list-bg.png) 0 0 no-repeat;overflow: hidden;} .service{min-height: 760px;} .service .service-text{margin-top: 250px;width: 400px;height: 280px;padding: 43px 0 0 36px;background: #fff;} .service .service-text-title{font-size: 33px;color: #000;} .service .service-text p{font-size: 20px;color: #333;line-height: 38px;} .service .service-img{} .contact-top{text-align: center;margin-bottom: 40px;} .contact-top h3{font-size: 30px;color: #333;margin-bottom: 50px;} .contact-top-text{display: flex;justify-content: space-between;align-items: flex-end;} .contact-top-text li{display: inline-block;width:auto;margin: 0 20px;text-align: center;} .contact-top-text li p{font-size: 13px;color: #888;line-height: 21px;} .contact-top-text span{display: block;width: 43px;height: 43px;margin: 0 auto 10px;} .contact-top span.tel{background: url(images/contact-bg.png) 0 0 no-repeat;} .contact-top span.email{background: url(images/contact-bg.png) -56px 0 no-repeat;} .contact-top span.address{background: url(images/contact-bg.png) -107px 0 no-repeat;} .contact-liuyan .form_group.yyname,.contact-liuyan .form_group.tel{width: 270px !important;float: left;} .contact-liuyan .form_group.tel{margin-left: 30px;} .contact-liuyan .form_group.email{clear: left;} .contact-liuyan .form_group.yyname .infoInput {width: 250px !important;} .contact-liuyan .form_group.tel .infoInput {width: 250px !important;} .contact-liuyan .form_box .yyproduct { position: absolute; top: 0; right: 0; } .contact-liuyan .form_box .type_text { position: absolute; top: 68px !important; right: 0; } .contact-liuyan .form_box .type_post{ bottom: 0 !important; } /*个人定制*/ .ab-warp1{margin-top: 70px;} .ab-warp2{margin: 70px auto;} .warp-con{width: 645px;height: 330px} .warp-con img{margin-top: 35px;} .warp-con p{margin-top: 26px;line-height: 26px;font-size:14px;} .warp-con a{display: block;width: 28px;height: 28px;border: 1px solid #838383;border-radius: 50%;text-align: center;line-height: 30px;color: #838383;font-family: "simsun";font-size: 18px;margin-top: 30px} .warp-con a:hover{color: #fff;background-color: #838383} .ab-warp3{height: 600px;background: url(ab-warp3.jpg) no-repeat center center #232521;margin-bottom: 50px;} .ab-warp3 p{color: #fff;font-size: 16px;position: absolute;line-height: 30px;} .warp3-inner{height: 600px;position: relative;} h3.srdz-title{font-size: 32px;color: #65a2e0;} .color-h{font-size: 30px;font-weight: bold;color: #65a2e0;} .num{font-size: 36px;margin-right: 15px} .pt1{left: 598px;top: 74px;} .pt2{left: 793px;top: 253px;} .pt3{left: 735px;top: 414px;} .pt4{left: 228px;top: 407px;} .pt5{left: 167px;top: 215px;} #inner-center{top: 273px;left: 498px;color: #333;font-size: 34px;line-height: 50px;font-weight: bold;} .ewm_hide{z-index: 10000; position: fixed; _position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(images/yiban.png); display: none;} .ewm_hide .ewm_hidecon{width: 360px; height: 400px; z-index: 100001; position: fixed; top: 50%; left: 50%; background: #fff; margin: -200px 0 0 -180px; box-shadow: 1px 1px 6px 3px rgba(0,0,0,.2); display: none; text-align: center;} .ewm_hide .ewm_hidecon dl{ margin-top: 60px; font-size: 14px; color: #333; line-height: 40px;} .ewm_hide .ewm_hidecon dl img{display: block; width: 200px; height: 200px; margin:0 auto 10px;} .ewm_hide .ewm_hidecon dl a{ width: 110px; height: 40px; background: #006599; color: #fff; display: inline-block; border-radius: 2px; font-size: 14px; line-height: 40px; margin-top: 10px;} .i-case{padding: 60px 0 100px 0;background: #dbedf4;} .i-case .i-case-inner{width: 1220px;margin: 0 auto;} .i-case .i-case-title{margin-bottom: 34px;text-align: center;} .i-case .i-case-title h3{font-size: 46px;font-weight: bold;color: #006599;} .i-case .i-case-slide{position: relative;padding-bottom: 80px;} .i-case .i-case-slide .i-case-ulwrap ul{width: 305px;} .i-case .i-case-ulwrap li{position: relative;width: 285px;height: 100px;margin: 10px;background: #e2f2f8;box-shadow: 0 0 10px rgba(0,0,0,.1);} .i-case .i-case-ulwrap li img{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);} .i-case .hd{position: absolute;left: 50%;bottom: 0;width: 84px;margin-left: -42px;} .i-case .hd a{position: absolute;bottom: 0;display: block;width: 32px;height: 10px;background-repeat: no-repeat;background-position: center;cursor: pointer;} .i-case .hd .i-case-prev{left: 0;background-image: url(images/case-prev.png);} .i-case .hd .i-case-prev:hover{background-image: url(images/case-prev-hover.png);} .i-case .hd .i-case-next{right: 0;background-image: url(images/case-next.png);} .i-case .hd .i-case-next:hover{background-image: url(images/case-next-hover.png);} .case-wrap{background: none} .case-wrap .i-case-ulwrap ul{width: 100% !important;} .case-wrap .i-case-ulwrap ul li{float: left;}