@charset "utf-8"; /*html5*/ article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block} @font-face { font-family: 'MyriadCAD'; src: url('fonts/MyriadCAD.eot'); src: local('MyriadCAD Regular'), local('MyriadCAD'), url('fonts/MyriadCAD.woff') format('woff'), url('fonts/MyriadCAD.ttf') format('truetype'), url('fonts/MyriadCAD.svg#fontName') format('svg'); } #BDBridgeWrap{ display:none;} /* CSS Document */ body{ font-family:"Microsoft YaHei",sans-serif; color:#000; font-size:12px; background:#f1f1f1; background-size:100%; overflow-x:hidden; -webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;} a { color:#000; -webkit-transition: all 200ms ease-in;-o-transition: all 200ms ease-in;-moz-transition: all 200ms ease-in;} .pt60{ padding-top:60px;} .mt40{ margin-top:40px;} .w100{ width:100%;} .w1200{ width:1200px;} .ffTNR{font-family: "Times New Roman";} .ffS{ font-family:"宋体"} .fs16{ font-size:16px;} .c9{ color:#999;} .cRed{ color:#d0121b;} h3.title{ font-size:32px; font-weight:400; text-align:center; margin:60px 0 40px 0;} h3.title span{ display:block; margin:0 auto; width:60px; height:20px; border-bottom:2px solid #dc0b09; } p.infor{ width:1000px; margin:0 auto; line-height:30px;} .index_title h6{ font-size:30px; font-family: "Times New Roman"; font-weight:400;} .index_title h4{ font-size:40px; font-family: "Times New Roman"; font-weight:400;} .index_title span{ line-height:25px; color:#999;} .index_title p{ font-size:18px; font-family: "微软雅黑"; height:10px;} /* 2018-7-3 */ .xtjj1{ font-size: 30px;line-height: 40px;margin:0;font-weight: normal; } .xtjj2{ font-size: 41px;line-height: 55px;margin:0;font-weight: normal;margin-bottom: 60px; } .fourys{ background: #74539a; padding-top: 70px; } .fourys h6{ color: #c6b8d7; } .fourys h6:after{ background: #f0edf5!important; } .fourys h6+p{ color: #f0edf5; } .fourys ul{ width: 1200px; margin: 0 auto; } .fourys li{ float: left; width: 250px; } .fourys li:nth-of-type(n+2){ margin-left: 66.66px } .fourys li img{ display: block; margin: 0 auto; width: 160px; } .fourys li h5{ margin: 0; color: #fff; font-size: 22px; line-height: 22px; margin-top: 55px; margin-bottom: 25px; font-weight: normal; text-align: center; } .fourys li h5+p{ font-size: 14px; line-height: 22px; color: #fff; text-align: justify; } .fourys li{ padding-bottom: 80px; margin-top: 20px; } .fwkh{ padding: 70px 0 90px 0; background: #fff; } .fwkh img{ margin: 50px auto 0 auto; display: block; } @media (max-width: 599px) { .xtjj1{ font-size: 24px; } .xtjj2{ font-size: 29px; margin-bottom: 30px; } .xtjj2+img{ width: 95%; } } /*2018-05-22*/ .footT1{font-size:25px;line-height:25px;float:left;} .footT1:after{float:right;height:18px;margin-top:4px;width:1px;background:#d3d3d4;content:"";display:block;margin-left:10px;} .footT2{font-size:18px;line-height:25px;padding-left:10px;float:left;} /*2018-05-18*/ .index_title h6{ font-size:60px; font-weight:400; color:#d7d7d7; font-family:"Arial",sans-serif;} .index_title h6:after{content: "";display: block;width: 60px;height: 3px;background:#801d6b;margin:10px auto;} .index_title p{ font-size:30px!important;line-height:40px!important;height:30px; color: #3e3a39; font-family:"Microsoft YaHei",sans-serif;} .index_title_white.index_title{ margin:60px auto 20px auto;} .index_title_white.index_title h6{ color:#b45f92;} .index_title_white.index_title p{ color:#fff;} .index_title_white.index_title h6:after{ background:#b981aa;} /*2018-05-18*/ .contact .ADD{ display:block;} .view{ margin-top:30px;} .index_title1{ width:166px; background:url(../image/index_title1.jpg) no-repeat center top; background-size:100% auto;} .index_title1::before{ content:"";display:block;padding-top:45.18%;} .index_title2{ width:537px; background:url(../image/index_title2.jpg) no-repeat center top; background-size:100% auto;} .index_title2::before{ content:"";display:block;padding-top:13.97%;} .index_title3{ width:302px; background:url(../image/index_title3.jpg) no-repeat center top; background-size:100% auto;} .index_title3::before{ content:"";display:block;padding-top:24.83%;} .index_title4{ width:143px; background:url(../image/about_title.jpg) no-repeat center top; background-size:100% auto;} .index_title4::before{ content:"";display:block;padding-top:52.45%;} .index_title5{ width:269px; background:url(../image/about_title.png) no-repeat center top; background-size:100% auto;} .index_title5::before{ content:"";display:block;padding-top:27.88%;} .index_title6{ width:270px; background:url(../image/about_title1.jpg) no-repeat center top; background-size:100% auto;} .index_title6::before{ content:"";display:block;padding-top:27.78%;} .header,.MICdesign,.kv,.server,.professional,.work,.footer,.about,.team,.client,.contact_box,.map_box{ width:100%; background:#f1f1f1; margin:0; overflow:hidden;} .header_box{ height:92px;} .header{ background:#fff;} .professional{ background:none;} .center{ width:1200px; position:relative;} .header{ height:93px; padding:10px 0 0 0; border-bottom:1px solid #7f7f7f; position:fixed; z-index:9;} .logo{ width:354px; height:43px; margin-left:25px; margin-top:6px;} .logo img{ width:100%; display:block; padding-top:11px;} .nav{ width:620px; position:absolute; left:50%; margin:35px 0 0 -220px;} .nav a{ width:70px; height:33px; line-height:30px; text-align:center; display:block; float:left; /*2015-11-12*/font-size: 16px; font-weight:700; margin-left:40px;} .nav a:first-child{ margin-left:0;} .nav a span{ display:block; color:#801e6c; /*border-bottom:solid 1px;*/ font-family:Arial, Helvetica, sans-serif; font-weight:700; line-height:30px;} .nav a.current p{display:none;} .nav a.current span{display:block;} .tel{ margin:45px 25px 0 0;} .tel p{ margin-right:8px; display:inline; float:left; } .QQPanel,.QQPanel li,.tel b{ float:left;} .QQPanel{display: none;} .QQPanel li{ margin:0 0 0 5px;} .QQPanel li span{ line-height:18px;} .qq11{ width:20px; height:20px; background:url(../image/qq.png) no-repeat; display:block; float:left;} .QQPanel li.online .qq11{ background-position:-20px 0;} .tel b{ line-height:20px; font-style:italic; color:#801e6c; font-family:"Arial Black"; /*2015-11-12*/font-size:15px; margin-top:-3px;} .tel b .cRed{ color:#801e6c;} .menu_btn,.menu{ display:none;} .MICdesign h3{ margin-top:35px; font-size:58px; margin-bottom:10px;} .MICdesign p{ font-size:14px;} .MICdesign p.ffTNR{ font-size:26px; margin-bottom:10px; font-weight:700;} /*banner*/ .banner{ height:380px;} .xmSlide{width:100%; position:relative;} .xmSlide img{ display:block;} .xmSlide-pagination{background-color:#fff;padding-top:15px;text-align:center;} .xmSlide-pagination li{display:inline-block; height:12px;} .xmSlide-pagination li a{display:inline-block;width:12px;height:12px;text-indent:-9999px;background-color:#ccd1d9;border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;overflow:hidden; opacity:.7;} .xmSlide-pagination li a.active{background-color:#656d78;} .xmSlide-pagination li a:hover{ opacity:1;} .xmSlide-control{overflow:hidden;width:1200px; height:380px;} .xmSlide-pagination{ position:absolute; bottom:10px; left:50%; z-index:6; background:none; padding:0;} .xmSlide-pagination li a{ background:rgba(255,255,255,.5);} .xmSlide-pagination li a.active{ background:rgba(208,81,27,.9);} .kv{ background:#f1f1f1; margin-bottom:60px;} #kv{ position:relative;} #kv a{display: block;} #kv img{width:100%} #kv .owl-pagination{ position:absolute; left:50%; bottom:10px; /*ie*/bottom:20px\0;+bottom:20px;} #kv.owl-theme .owl-controls .owl-page{ height:10px;} #kv.owl-theme .owl-controls .owl-page span,.xmSlide-pagination li a{ width:50px; height:5px; background:#717071; margin:2px 5px 0 5px;transition:All 0.8s ease-in-out;-webkit-transition:All 0.8s ease-in-out;-moz-transition:All 0.8s ease-in-out;-o-transition:All 0.8s ease-in-out;} #kv.owl-theme .owl-controls .owl-page.active span,.xmSlide-pagination li a.active{ background:#801d6b;} .str{ margin-top:20px; margin-bottom:20px;} .pic{ margin-left:auto; margin-right:auto; text-align:center;} #player .mobile{ display:none} /*2016-01-13*/ .index_title{ margin-bottom:50px;} .index_title img{ display:block; margin:0 auto;} .moreBtn{ background: url(../image/news_more.jpg) no-repeat; display:block; width:142px; height:32px; padding:8px 0 0 15px; margin:0 auto; text-align:left;} .moreBtn:hover{ background: url(../image/news_more_hover.jpg) no-repeat; color:#fff;} .index_box1{ margin-bottom:50px;} .index_box1 h6{ font-size:30px; font-weight:400; line-height:60px; color:#3e3a39; margin-top:20px;} .index_box1 p{ font-size:16px; line-height:30px; color:#3e3a39;} .index_box1 ul{ margin-top:60px; margin-bottom:60px; width:660px; overflow: hidden;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;} .index_box1 li{ float:left; width:220px;} .index_box1 li h4{ font-size:64px; color:#801d6b; font-family:Arial, Helvetica, sans-serif; text-align:center; margin-bottom:10px;} .index_box1 li p{ font-size:18px; color:#3e3a39; text-align:center;} @media all and (max-width: 1021px) { #wrap { width:100%; padding:0 20px;} h1.jumbo { font-size:5em;} } @media all and (max-width: 480px) { #wrap { padding:0 15px;} h1.jumbo { font-size:2em;} } .index_play{ background:#dfdddd; margin-bottom:50px;} .index_play img{ display:block;} /*2015-12-24*/ .step1234{ background:#f1f1f1; margin-bottom:50px;} .step1234 ul{ width:1225px;} .step1234 ul li{ width:300px; float:left; position:relative; background-repeat:no-repeat; background-size:100% auto;} .step1234 ul li::before{ content:"";display:block;padding-top:105.67%;} .step1234 ul .step1{ background-image:url(../image/step1.jpg);} .step1234 ul .step2{ background-image:url(../image/step2.jpg);} .step1234 ul .step3{ background-image:url(../image/step3.jpg);} .step1234 ul .step4{ background-image:url(../image/step4.jpg);} .step1234 ul li h6{ color:#3e3a39; clear:both; position:absolute;} .step1234 ul .step1 h6{ left:80px; top:80px;} .step1234 ul .step2 h6{ left:70px; bottom:30px;} .step1234 ul .step3 h6{ left:57px; top:80px; width:245px;} .step1234 ul .step4 h6{ left:25px; bottom:40px;} .step1234 ul li h6 p{ width:100px; float:left; font-size:24px;} .step1234 ul li h6 span{ font-size:16px; line-height:16px; display:block; float:left;font-family:Arial, Helvetica, sans-serif; margin-top:-2px;} .step_detail{ border-bottom:1px solid #e8e9e9; width:170px; position:absolute;} .step_detail p{ font-size:14px; font-weight:700; margin-bottom:0; color:#595757; text-align:center; width:170px; line-height:30px; border-top:1px solid #e8e9e9;} .step1234 ul .step1 .step_detail{ top:120px; left:70px;} .step1234 ul .step2 .step_detail{ top:60px; left:70px;} .step1234 ul .step3 .step_detail{ top:120px; left:40px;} .step1234 ul .step4 .step_detail{ top:60px; left:40px;} /*2016-01-13*/ .index_box2{ margin-bottom:50px; background-size:cover; /* background:url(../image/index_bg.jpg) repeat-x center top; */} .index_box2 .arrow_box{ margin:0 auto; width:960px; background:url(../image/index.png) no-repeat center; background-size:100% auto; position:relative;} .index_box2 .arrow_box::before{content:"";display:block;padding-top:55.2%;} .index_box2 .arrow_box .arrow{ width:271px; background:url(../image/arrow.png) no-repeat; position:absolute; top:45%; left:344px;} .index_box2 .arrow_box .arrow::before{content:"";display:block;padding-top:15.87%;} @-webkit-keyframes spin-vertical { from { -webkit-transform: rotateX(0); } to { -webkit-transform: rotateX(-360deg); } } @-ms-keyframes spin-vertical { from { ms-transform: rotateX(0); } to { ms-transform: rotateX(-360deg); } } @keyframes spin-vertical { from { transform: rotateX(0); } to { transform: rotateX(-360deg); } } .arrow{ -webkit-transform-origin:50% 50%; -moz-transform-origin:50% 50%; -ms-transform-origin:50% 50%; transform-origin:50% 50%; -webkit-animation: spin-vertical 2s infinite linear; -moz-animation: spin-vertical 2s infinite linear; -ms-animation: spin-vertical 2s infinite linear; animation: spin-vertical 2s infinite linear; } .index_play .mobile,#player2 .mobile{ display:none;} .server{ padding:30px 0 10px 0;} .server ul{ width:60%; margin:30px auto 0 auto; } .server li{ width:20%; text-align:center; float:left;} .server li a{ display:block; position:relative;} .server li a img{ margin:0 auto; display:block;} .server li a .server_hover{ margin-left:-28px; position:absolute; top:0; left:50%; z-index:6;} .server li a p{ margin:10px auto 30px auto;} .server li a:hover .server_hover{ display:none;} .professional{ padding:20px 0;} .professional .index_title{ color:#fff;} .professional .index_title h5{ padding:0;} .professional ul{ width:100%; margin:40px auto 0 auto;} .professional li{ width:33.3%; text-align:center; float:left;} .professional li img{ margin:0 auto; display:block;} .professional li p{ margin:20px 0 40px 0; line-height:16px; color:#fff;} .professional li p span{ margin-bottom:5px; display:block; font-family:"微软雅黑";} .work{ padding:0 0 30px 0;} .work li{ width:33.3%; height:245px; margin-bottom:5px; float:left; overflow:hidden;} .work li a{ margin:0 3px; color:#666; height:245px; display:block; position:relative; overflow:hidden;} .work li a img{ width:100%; height:245px; margin:0; display:block; transition:All 0.4s ease-in-out;-webkit-transition:All 0.4s ease-in-out;-moz-transition:All 0.4s ease-in-out;-o-transition:All 0.4s ease-in-out;} .work li a h6{ display:none; font-size:14px; font-weight:400; width:100%; margin:0; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .work li a h6 span{ font-size:12px; line-height:16px; display:block;} .work li a i{ width:100%; height:100%; background:rgba(0,0,0,.9); position:absolute; top:0; left:0; z-index:6; opacity:0; transition: all 0.5s;-webkit-transition:All 0.5s;-moz-transition:All 0.5s;-o-transition:All 0.5s; /*ie*/background:url(../image/bgBlack.png) repeat\0;+background:url(../image/bgBlack.png) repeat;filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);} .work li a i p{ width:80%; max-width:80%; font-size:14px; text-align:center; color:#fff; font-style:normal; display:block;} .work li a i p span{ position:relative; display:block; text-align:center; margin:0 auto; font-size:18px; line-height:30px; font-weight:700;} .work li a:hover i{ opacity:1; /*ie*/filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);} .work li a:hover img{ transform:scale(1.1);-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);} /*2015-12-16*/ .footer{ background:#3e3a39;} .footer .center{ width:1200px; margin-top:50px; margin-bottom:90px;} .footerBox{ float:left; width:490px;} .footerBox:last-child{ float:right; width:490px;} .footerBox h6{ font-size:16px; color:#fff; font-weight:400; margin-bottom:20px;} .footerBox p,.footerBox a{ color:#d3d3d4; line-height:18px;} .footerBox a:hover{ color:#fff; text-decoration:underline;} .footerBox .addr{ padding-bottom:10px; border-bottom:1px dashed #686767; margin-bottom:10px;} .footerBox .addr span{ color:#fff; font-size:14px;} .copyright{ color:#d3d3d4; height:50px; line-height:50px; background:#030000;} .copyright .center{ width:1200px;} .copyright a{ width:30px; height:30px; background:url(../image/wxin.jpg) no-repeat; margin:10px 10px 0 0;} .copyright p{ margin:0;} /*2016-01-14*/ .banner{ position:relative; background-position:center top;} .banner .index_title{ top:35px; } .banner img{ display:none;} .about{ padding:50px 0 0 0;} .about p{ line-height:24px; font-size:14px;} .about span{ line-height:48px; font-size:36px;} .server.inner{ padding:30px 0 0 0; border-top:1px solid #333;} .server.inner img{ display:block;} .server.inner p{ color:#000;} .team{ padding:30px 0; border-top:1px solid #333;} .team_list{ padding-top:60px;} .team_list li{ width:14.28%; float:left;} .team_list li a{ display:block; position:relative;} .team_list li a img{ width:100%; display:block;} .team_list li a p{ width:100%; height:100%; background:rgba(210,0,12,.9); position:absolute; top:0; left:0; z-index:6; opacity:0; transition: all 0.5s;-webkit-transition:All 0.5s;-moz-transition:All 0.5s;-o-transition:All 0.5s; /*ie*/background:url(../image/bgRed.png) repeat\0;+background:url(../image/bgRed.png) repeat;filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);+display:none;} .team_list li a p span{ margin:40% auto 0 auto; width:80%; color:#fff; text-align:center; display:block;} .team_list li a:hover p{ opacity:1; /*ie*/filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);+display:block;} .professional.inner{ padding:30px 0 0 0; border-top:1px solid #333;} .professional.inner a{ display:block; position:relative; cursor:default;} .professional.inner a img{ display:block; margin:0 auto;} .professional.inner .professional_hover{ margin-left:-31.5px; position:absolute; top:0; left:50%; z-index:6; transition: all 0.3s;-webkit-transition:All 0..s;-moz-transition:All 0.3s;-o-transition:All 0.3s;} .professional.inner p{ color:#fff;} .professional.inner a:hover img{ opacity:1;} .professional.inner a:hover .professional_hover{ display:none} .client{ padding:30px 0; border-top:1px solid #333; background:#fff;} .customer{ padding-top:10px;} .customer img{ margin:0 auto; display:block;} /*2015-12-16*/ .about > .center{ width:1200px;} /*2016-01-14*/ .about .index_box1{ margin-bottom:0;} .about .index_box1 h4 span{ font-size:60px;} .about .index_box1 #wrap{ margin-bottom:0;} .player{ margin-bottom:40px; background:none; width:700px; background:url(../image/about_bg.jpg) no-repeat; background-position:center top; position:relative;} .player::before{ content:""; display:block; padding-top:74.29%;} .player .center{ width:100%;} .player .pc{ width:503px; height:316px; position:absolute; top:86px; left:50%; margin-left:-251px;} .index_play .player{ width:1200px; height:600px; background:url(../image/index.jpg) no-repeat center top;} .index_play .player .pc{ width:525px; height:325px; left:50%; margin-left:-262px; top:74px;} .adss{ width:960px; margin-bottom:40px;} .adss h6{ font-size:18px; color:#383535; margin-bottom:20px;} .adss p{ line-height:24px; margin-bottom:20px;} .adss span{ font-size:16px; line-height:24px; margin-bottom:20px; display:block;} .about .title{ width:960px; height:35px; line-height:34px; margin:0 auto 40px auto; background:url(../image/about_title.jpg) no-repeat;} .about .title h6{ font-size:16px; color:#fff; line-height:34px;height:34px; margin-left:40px; font-weight:400;} .about .title h6 span{ font-size:12px; margin-left:5px; line-height:34px;} .about .title p{ float:right; color:#ccc; line-height:18px; margin:10px 20px 0 0; border-bottom:1px solid #ccc; padding-bottom:3px; font-size:12px;} .about .title p a{ color:#ccc;} .about .title p a:hover{ color:#fff;} .about .professional{ border:none; padding-top:0;} .about .professional .center{ width:960px;} .about .professional ul{ margin-top:0; margin-bottom:20px;} .about .professional p span{ font-size:16px; font-weight:700;} .about .customer td{ border:1px solid #dedede;} .team{ padding-top:50px; border-top:1px solid #ada5a2;} .team_pic{ width:1100px; background:url(../image/about.jpg) no-repeat center top; background-size:100% auto; margin:0 auto;} .team_pic::before{ content:""; display:block; padding-top:101.9%;} .process{ padding-top:1px;padding-bottom:40px; margin-bottom:50px; background:url(../image/index_bg.jpg) repeat-x center top; background-size:cover;} .process .professional.inner{ margin-top:60px;} .customer_pic{width:1100px; background:url(../image/customer.jpg) no-repeat center top; background-size:100% auto; margin:0 auto;} .customer_pic::before{ content:""; display:block; padding-top:31.917%;} /*2016-01-20*/ .contactus{ margin-top:60px;} .contactus .center{ width:1100px;} .address{ width:500px; float:left;} .address h5{ line-height:48px; margin-bottom:10px; font-size:44px; color:#802062; font-weight:400;} .address h5 p{ font-size:16px; line-height:24px; color:#333; margin:10px 0; padding-top:10px; margin-bottom:40px; border-top:1px solid #ccc;} .address h6{ color:#802062; font-size:18px; margin-bottom:40px} .address h6 p{ font-size:14px; color:#333; line-height:30px; font-weight:400; margin-top:10px;} .address h6 a{ color:#333;} .address h6 a:hover{ color:#802062;} .feedback{ width:520px; float:right;} .feedback p{ font-size:24px; color:#333; margin:0 0 20px 0;} .feedback .text{ width:500px; height:50px; line-height:50px; padding:2px 10px; background:#e5e5e5; font-size:14px; color:#666; border:0; margin-bottom:10px;} .feedback textarea.text{ height:150px; max-width:500px;max-height:150px;} .feedback .submit{ border:2px solid #802062; width:500px; color:#802062; background:#f1f1f1; text-align:center; height:50px; line-height:48px; font-size:16px;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out;} .feedback .submit:hover{ cursor:pointer; background:#802062; color:#fff;} .contactS{ margin-top:60px; border-top:1px solid #d3d3d3; padding-top:60px;} .contactS li{ width:25%; float:left;} .contactS li a{ display:block; height:100px; margin:0 20px; text-align:center;} .contactS li a span{ display:block; width:80px; height:80px; margin:0 auto 20px auto;} .contactS li a.mail span{ background:url(../image/contact1.jpg) no-repeat;} .contactS li a.qq span{ background:url(../image/contact2.jpg) no-repeat;} .contactS li a.pin span{ background:url(../image/contact3.jpg) no-repeat;} .contactS li a p{ font-size:14px; color:#333; text-align:center; margin-bottom:40px;} .contactS li a.mail:hover span{ background:url(../image/contact1h.jpg) no-repeat;} .contactS li a.qq:hover span{ background:url(../image/contact2h.jpg) no-repeat;} .contactS li a.pin:hover span{ background:url(../image/contact3h.jpg) no-repeat;} .contactBox{ margin-top:40px;} .map{ height:420px; width:100%;} #map2 #dituContent{ margin:0px auto;} .contact_box .contact{ margin-top:20px; margin-bottom:40px;} .contact_box .contact h6,.contact_box .contact p,.contact_box .contact a{ color:#3e3a39; line-height:36px;} .contact_box .contact h6{ font-size:26px; color:#802062; display:inline-block;} .contact_box .contact p{ font-size:16px; line-height:32px; margin-top:10px; color:#3e3a39; } .contact_box .contact p span{ font-size:24px; line-height:42px;display:block;} .contact_box .contact a:hover{ color:#802062;} .map_box{ padding-top:20px; margin-bottom:40px;} /*2015-12-16*/ .map_box .center{ width:960px;} .map_box .center .map{ width:100%; height:450px;} /*作品*/ .banner #xmSlide .pp{height:450px; background-repeat:no-repeat; background-position:center top;} .banner #xmSlide .pp img{ display:none;} .porfolio.work{ padding:0;} .isotope-item {z-index: 2;} .isotope-hidden.isotope-item { pointer-events: none; z-index: 1;} .isotope,.isotope .isotope-item {-webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;transition-duration: 0.8s;} .isotope {-webkit-transition-property: height, width;-moz-transition-property: height, width;transition-property: height, width;} .isotope .isotope-item {-webkit-transition-property: -webkit-transform, opacity;-moz-transition-property:-moz-transform, opacity; transition-property:transform, opacity;} .isotope.no-transition,.isotope.no-transition .isotope-item,.isotope .isotope-item.no-transition {-webkit-transition-duration: 0s;-moz-transition-duration: 0s;transition-duration: 0s;} .isotope.infinite-scrolling { -webkit-transition: none;-moz-transition: none;transition: none;} #containers { width:1200px; height:auto; padding:40px 0; margin:0 auto 20px auto;} .element {width:25%; height:267px; margin-bottom:20px; float:left; overflow: hidden; position: relative;} .element a{ height:100%; margin:0 10px; display:block; position:relative; overflow:hidden;} .element a img{ width:100%; margin:0 0 20px 0; display:block; transition:All 0.4s ease-in-out;-webkit-transition:All 0.4s ease-in-out;-moz-transition:All 0.4s ease-in-out;-o-transition:All 0.4s ease-in-out; position:relative;} .element a h6{ font-size:16px; font-weight:400; width:100%; height:42px; margin:0; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .element a h6 span{ font-size:12px; line-height:24px; display:block;} .element a i{ width:100%; height:100%; background:rgba(210,0,12,.9); position:absolute; top:0; left:0; z-index:6; opacity:0; transition: all 0.5s;-webkit-transition:All 0.5s;-moz-transition:All 0.5s;-o-transition:All 0.5s; /*ie*/background:url(../image/bgRed.png) repeat\0;+background:url(../image/bgRed.png) repeat;filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);} .element a i p{ width:80%; max-width:80%; font-size:14px; margin:18% auto 0 auto; text-align:center; color:#fff; font-style:normal; display:block; position:relative;} .element a:hover i{ opacity:1; /*ie*/filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);} /*2016-01-28*/.element a:hover i b{ display:block; width:20px; height:20px; background:url(../image/span_arrow.png) no-repeat; position:absolute; left:50%; top:50%; margin-left:-10px; margin-top:25px;} .element a:hover img{ transform:scale(1.1);-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);} .demos{ margin-top:30px; overflow:hidden} .element * { position: absolute; margin: 0;} .material_title{ width:286px; background-repeat:no-repeat; background-size:100% auto; background-position:center top; margin-bottom:30px; } .material_title::before{ content:""; display:block; padding-top:26.22%;} /*详情*/ .detail{ margin-top:60px;} .infor_box{ padding-bottom:20px; border-bottom:1px solid #a4a4a4; margin-bottom:20px;} .work_infor{ width:280px;} .work_infor h6{ height:28px; line-height:18px; font-size:16px; font-weight:400; border-bottom:1px solid #a4a4a4; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .work_infor span{ margin:15px 0 0 0; padding-bottom:15px; border-bottom:1px solid #a4a4a4; font-family:Arial; display:block; margin-bottom:10px;} .work_infor p{line-height:2em;} .infor_box img{ width:480px; height:240px; float:right;} /*2015-11-10*/ .work_detail .brand_logo{ height:90px; padding:0 60px;} .work_detail .case_title{ height:50px; line-height:50px; font-size:16px; font-weight:700; color:#fff; padding:0 0 0 60px;} .work_detail .case_about{ margin:20px 60px;} /*观点2015-10-22*/ .news{ padding:30px 0; background:#f1f1f1;} .news .news_arrow{ margin-top:20px; width:30px; background-image:url(../image/news_arrow.png); background-repeat:no-repeat; background-size:100% auto;} .news .news_arrow::before{ content:""; display:block; padding-top:100%;} .news .center,.article{ width:800px; margin-left:auto; margin-right: auto; } .news li{ margin-bottom:50px; padding: 0 5px;} .news li h6{ clear: both; font-size:22px; margin:0; overflow: hidden;} .news li h6 b{ max-width: 65%; display: block; float: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .news li h6 span{font-weight: 400;} .news li p{ line-height: 18px; color:#898989; margin-bottom: 0; max-height:3em; overflow:hidden; text-align:justify;} .news li span{transition: all 0.5s;-webkit-transition:All 0.5s;-moz-transition:All 0.5s;-o-transition:All 0.5s;} .news li a:hover h6{ color: #801e6c;} .news li a:hover p{ color: #333;} .news li a:hover span{ background:url(../image/news_more_hover.jpg) no-repeat; color:#fff;} .page_list{ margin-top: 40px; margin-bottom: 60px;} .page_list a{ padding: 5px 10px; background: #fff; border: 1px solid #ccc; color: #666; margin: 0 3px;} .page_list a.cur{ border-color:#d2000c; background: #d2000c; color: #fff;} .page_list a:hover{ border-color:#d2000c; color: #d2000c;} .article_title{ margin: 40px 0; font-size: 20px; font-weight: 700; border-bottom: 1px solid #ccc;} .article_title span{ display: block; font-size: 12px; color: #999; font-weight: 400; margin: 5px 0 20px 0;} .article_page{ margin: 40px 0 0 0; padding-top: 20px; border-top: 1px solid #ccc; position:relative;} .article_page p{ max-width: 45%;} .article_page a:hover{color:#d2000c;} .backList{ position:absolute; left:50%; top:20px; margin-left:-24px;} /****观点2015.11.27****/ .news{ padding-top:60px;} .kvpic{ width:100%; height:250px; background-color:#3E3A39;} .line{ width:100%; height:1px; background:#727171; margin-bottom:50px;} .newscont{ height:210px; margin-bottom:30px;} .newscont h5{ font-size:24px; font-weight:400; color:#595757; letter-spacing:-5px; font-family:MyriadCAD; margin:15px 0;} .newscontL{ float:left;} .newscontR{ float:left; width:470px; height:210px; margin-left:30px; position:relative;} .newscontR span{ background-image:url(../image/news_more.jpg); background-repeat:no-repeat; display:block; width:142px; height:32px; position:absolute; left:0; bottom:0; padding:8px 0 0 8px;} /**** 分类按钮 ****/ #options a,#options a code { color:#656464; font-size:14px; text-decoration: none;} #options a:hover,#options a:hover code { color: #fff; } .porfolio_list{ padding:40px 0; background:#f1ff1;} #options { margin:0 auto;} #options ul,.newsmenu { margin: 0 auto;} #options li,.newsmenu li{ width:10%; height:50px; margin:0; position:relative;} #options li:first-child a{ margin-left:3px;} #options li:last-child a{ margin-right:0;} #options li a,.newsmenu li a{display:block; font-size:14px; background:#f1f1f1; color:#801e6c; line-height:50px; height:50px; text-align:center; margin:0 10px; border:1px solid #801e6c;} #options li a:hover,#options li a.selected,.newsmenu li a:hover,.newsmenu li a.active{background:#801e6c; color:#fff;} .porfolio #option li{ width:16.67%;} .newsmenu{ width:640px; margin-bottom:70px;} .newsmenu li{ width:33.3%; float:left;} .porfolio.work ul{ padding:0;} .porfolio .center{ width:1200px; margin-left:auto; margin-right: auto;} /*材质 2016-01-14*/ .material{ padding:0; margin-top:60px; margin-bottom:60px;} .material.work li a i{ width:100%; height:100%; position:absolute; top:0; left:0; z-index:6; opacity:1; background:none; transition: all 0.5s;-webkit-transition:All 0.5s;-moz-transition:All 0.5s;-o-transition:All 0.5s;} .material.work li a i p{ width:auto; font-size:18px; font-weight:400; padding:7px 21px; text-align:center; color:#fff; display:inline-block; position:absolute;top:50%;left:50%;z-index:6; background:rgba(0,0,0,.9); transition: all 0.5s;-webkit-transition:All 0.5s;-moz-transition:All 0.5s;-o-transition:All 0.5s;} .material.work li a:hover i{ background-color:rgba(0,0,0,.9);/*ie*/background:url(../image/bgBlack.png) repeat\0;+background:url(../image/bgBlack.png) repeat;} .material_list{ margin-top:60px;} .material_list li{ width:50%; height:auto; margin-bottom:40px;} .material_list li .infor.fL{margin-right:30px;} .material_list li .infor.fR{margin-left:30px;} .material_list li .infor h6{ font-size:18px; color:#231815; margin-bottom:10px;} .material_list li .infor img{ display:block; width:100%; margin-bottom:20px;} .material_list li .infor p{ font-size:16px; line-height:24px; color:#231815; height:96px; margin:0;} .material_detail{ padding-top:60px; padding-bottom:0;} .work_infor{ width:240px;} .clearfix:before, .clearfix:after { display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } /*2016-01-14*/ .moreCase{ background:none; padding-top:30px; margin-top:60px; padding-bottom:50px; border-top:1px solid #c6c6c6;} .shareBtn{ margin-bottom:20px;} .bdsharebuttonbox{ display:inline-block;} .bdsharebuttonbox a{ width:30px;} .bdsharebuttonbox a.bds_weixin{ background:url(../image/share_weixin.png) no-repeat; height:30px; margin-left:5px; margin-right:5px;} .bdsharebuttonbox a.bds_sqq{ background:url(../image/share_qq.png) no-repeat; height:30px; margin-left:5px; margin-right:5px;} .bdsharebuttonbox a.bds_tsina{ background:url(../image/share_weibo.png) no-repeat; height:30px; margin-left:5px; margin-right:5px;} .moreCase h6{ font-size:16px; color:#727171; font-weight:400;} .moreCase h6 span{ display:block; width:45px; height:27px; margin:20px auto 30px auto; background:url(../image/case.png) no-repeat;} .moreCase ul{ width:760px; margin:0 auto;} .moreCase li{ width:33.3%; float:left; margin-bottom:10px;} .moreCase li a{ margin:0 3px; display:block;} .moreCase li a img{ display:block; width:100%; margin-bottom:10px;} .moreCase li a p{ line-height:24px; height:48px; margin-bottom:0; font-size:14px; color:#727171; text-align:center; transition: all 0.5s;-webkit-transition:All 0.5s;-moz-transition:All 0.5s;-o-transition:All 0.5s; } .moreCase li a:hover p{ color:#231815;} @media (max-width: 1024px) { .w1200{ width:100%;} .header_box{ height:82px;} .header{ height:83px;} .logo{ width:200px; height:36px;} .nav{ width:410px; margin-top:27px; margin-left:-230px;} .nav a{ font-size:14px; width:60px; margin-left:10px;} .tel{ margin-top:32px;} #kv a,#kv .item,.banner #xmSlide .pp{ height:auto;} #kv img,.banner img,.banner #xmSlide .pp img{ max-width:1100px; width:100%; margin:0 auto; display:block;} .pc.center,.player .pc.center{ width:503px;} .index_play .player{ width:100%;} .index_play .player .pc{ margin:0; top:74px; left:50%; margin-left:-263px; width:525px;} .step1234 ul{ width:100%;} .step1234 ul li,.step1234 ul .step2{ width:25%;} .step1234 ul .step1 h6{ top:60px; left:70px;} .step1234 ul .step1 .step_detail{ top:100px;} .step1234 ul .step2 h6{ left:70px; bottom:0;} .step1234 ul .step2 .step_detail{ top:50px; left:60px;} .step1234 ul .step3 h6{ top:60px; left:5px;} .step1234 ul .step3 .step_detail{ top:100px; left:20px;} .step1234 ul .step4 h6{ bottom:0;} .step1234 ul .step4 .step_detail{ top:50px;} .work .center,.team .center,.customer .center,.footer .center,.copyright .center,.about .center,.team .center,.process .center,.customer .center,.moreCase .center,#options ul,.contactus .center{ width:98%;} .banner{ height:auto; background-size:100%;} .team_pic{ width:80%;} .customer_pic{ width:90%;} .porfolio_list{ padding:30px 0;} #options li{ width:16.6%;} .work li,.work li a,.work li a img{ height:auto;} .detail{ margin-top:40px; margin-left:auto; margin-right:auto; width:96%;} .contactus{ margin-top:40px;} .address{ width:45%;} .feedback{ width:50%;} } @media (max-width: 992px) { /*.nav,.tel{ display:none;} .menu_btn{ display:block; width:30px; height:30px; background:url(../image/menu.jpg); position:absolute; right:25px; top:20px;}*/ .header_box{ height:72px;} .logo{ width:170px; margin-top:15px;} .nav a{ margin-left:5px;} .index_box1 h6{ font-size:32px;} .index_box1 li{ width:33.3%;} .step1234 ul li h6 p{ width:85px; font-size:20px;} .step1234 ul li h6 span{ font-size:14px; line-height:14px;} .step1234 ul .step1 h6{ left:60px; top:30px;} .step1234 ul .step1 .step_detail{ top:60px; left:40px;} .step1234 ul .step2 h6{ bottom:0; left:30px;} .step1234 ul .step2 .step_detail{ top:20px; left:30px;} .step1234 ul .step3 h6{ left:5px; top:50px;} .step1234 ul .step3 .step_detail{ top:82px; left:10px;} .step1234 ul .step4 h6{ bottom:0;} .step1234 ul .step4 .step_detail{ top:20px; left:30px;} .index_box2 .arrow_box{ width:98%; background-size:100%; background-position:center;} .index_box2 .arrow_box .arrow{ width:30%; background-size:100%; left:35%;} .footerBox,.footerBox:last-child{ width:48%;} .about .professional .center,.map_box .center{ width:98%;} .about .professional ul{ margin-bottom:0;} .professional li{ height:240px;} .process{ padding-bottom:20px; margin-bottom:40px;} .address{ width:47%;} .address h5{ font-size:36px;} } @media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape) { } @media (min-width: 992px) { /*.server ul{ width:100%;} .professional ul{ width:100%;} 2015-11-10*/ /*.element{height:250px;} .element{height:267px;}*/ } @media (max-width: 991px) { } @media (min-width: 769px) and (max-width: 979px) { /* .header_fixed .logo{ margin-top:0;} .header_fixed .nav{ margin-top:0;} .center{ width:700px;} .tel b{ font-size:18px;} .MICdesign h3{ margin-top:20px;} .server ul{ width:80%;} .professional ul{ width:100%;} .professional li{ height:190px;} .professional li p{margin:20px 20px 40px 20px;} .element{height:200px;} 2015-12-11 .customer img{ width:100%;}*/ } @media (max-width: 768px) { .fourys{ background: #74539a; padding-top: 40px; } .fourys ul{ margin: 0 auto; padding: 0 15px; width: 100%; } .fourys li{ float: left; width: 48%; height: 250px; } .fourys li:nth-of-type(n+2){ margin: 0; } .fourys li:nth-of-type(2n+2){ float: right; } .fourys li img{ display: block; margin: 0 auto; width: 60%; } .fourys li h5{ margin: 0; color: #fff; font-size: 16px; line-height: 16px; margin-top: 20px; margin-bottom: 15px; font-weight: normal; text-align: center; } .fourys li h5+p{ font-size: 12px; line-height: 18px; color: #fff; text-align: justify; } .fourys li{ padding-bottom: 0; margin-top: 0; } .fwkh{ padding: 30px 0 40px 0; background: #fff; } .fwkh img{ margin: 20px auto 0 auto; display: block; width: 90%; } .work .center,.team .center,.customer .center,.footer .center,.copyright .center,.about .center,.team .center,.process .center,.customer .center,.moreCase .center,#options ul,.contactus .center,.footer .center{ width:96%;} .header_box{ height:60px;} .header{ padding-top:0; height:60px; overflow:visible;} .logo{ width:150px; margin-top:15px;} .nav,.tel{ display:none;} .menu_btn,.close_btn{ width:30px; height:30px; margin:15px 20px 0 0; background:url(../image/menu.jpg) no-repeat; display:block; float:right;} .close_btn{ background-position:-30px 0; position:absolute; bottom:20px; right:0;} .menu{ width:100%; background:#000; position:fixed; top:60px; left:0; z-index:10; display:none;} .header_fixed .menu{ top:40px;} .menu ul,.menu li > a{ margin:20px; color:#fff;} .menu ul{ width:90%; margin:10px auto;} .menu > ul > li{ clear:both; overflow:hidden;} .menu li > a{ margin:0; line-height:30px; display:block; position:relative;} .menu li > a p{ margin:0;} .menu li > a p + span{ visibility:hidden; position:absolute; top:0; left:0; color:#d2000c;} .menu li > a.current p{ visibility:hidden;} .menu li > a.current span{ visibility:visible;} .subItem{ margin:0 12px;} .subItem a{ line-height:24px; color:#fff; display:block;} .menu .QQPanel{ margin:0 0 20px 0;} .menu .QQPanel li{ margin:0 0 0 5px;float:left;} .menu .QQPanel li a{ width:60px;} .menu .QQPanel li span{ line-height:18px; font-size:12px; color:#fff; display:block;} .menu .qq11{ width:20px; height:20px; background:url(../image/qq.png) no-repeat; display:block; float:left;} .menu .QQPanel li.online .qq11{ background-position:-20px 0; float:left;} .menu p{ margin-bottom:0;} .menu b{ font-size:18px; line-height:20px; margin:5px 0 0 10px; display:block; font-style:italic; color:#717071; font-family:"Arial Black";} .index_box1 li h4{ font-size:50px;} /*2015-12-24*/ .step1234{ height:auto;} .step1234 ul{ width:90%; height:auto;} .step1234 ul .step2{ margin-bottom:40px;} .step1234 ul .step1,.step1234 ul .step2,.step1234 ul .step3,.step1234 ul .step4{ background-size:100%; width:40%; margin:0 5% 5% 5%; overflow:hidden;} .step1234 ul li{ background-size:100% auto; background-repeat:no-repeat;} .step1234 ul li::before{ content:""; display:block; padding-top:109.31%;} .step1234 ul .step1 h6,.step1234 ul .step2 h6,.step1234 ul .step3 h6,.step1234 ul .step4 h6,.step1234 ul .step1 .step_detail,.step1234 ul .step2 .step_detail,.step1234 ul .step3 .step_detail,.step1234 ul .step4 .step_detail{ display:none;} .step1234 ul .step1{ background-image:url(../image/step1_mobile.jpg);} .step1234 ul .step2{ background-image:url(../image/step2_mobile.jpg);} .step1234 ul .step3{ background-image:url(../image/step3_mobile.jpg);} .step1234 ul .step4{ background-image:url(../image/step4_mobile.jpg);} /*.step1234 ul .step1 h6{ left:70px;} .step1234 ul li h6 p{ font-size:20px; width:82px;} .step1234 ul li h6 span{ font-size:14px; line-height:14px;} .step1234 ul .step1 h6{ top:70px; left:70px;} .step1234 ul .step2 h6{ top:220px; left:70px;} .step1234 ul .step3 h6{ top:70px; left:40px;} .step1234 ul .step4 h6{ top:230px; left:0;} .step1234 ul .step1 .step_detail{ top:110px; left:40px; width:60%;} .step1234 ul .step2 .step_detail{ top:40px; width:60%;} .step1234 ul .step3 .step_detail{ top:110px; width:60%;} .step1234 ul .step4 .step_detail{ top:50px; width:60%;} .step1234 ul .step1 .step_detail p,.step1234 ul .step2 .step_detail p,.step1234 ul .step3 .step_detail p,.step1234 ul .step4 .step_detail p{ font-size:14px; line-height:32px; width:100%;}*/ .footerBox,.footerBox:last-child,.moreCase ul{ width:100%;} .tel b{ font-size:18px;} .MICdesign h3{ margin-top:20px;} .server ul{ width:80%;} .professional ul{ width:100%;} .professional li{ height:190px;} .professional li p{margin:20px 20px 40px 20px;} .element{height:200px;} .work li{ width:33.3%;} .work_infor{ float:none; width:100%; margin-bottom:20px;} .infor_box img{ width:100%; height:100%; float:none;} /*2015-11-10*/ .work_detail .case_about{ margin:20px 0;} .news .center,.article{ width:90%; margin-left:auto; margin-right: auto; } .work_detail .brand_logo{ height:70px; padding:0 30px;} .work_detail .case_title{ padding:0 0 0 30px;} .work_detail .case_about{ margin:20px 30px;} /*2015-11-12*/ #goto{ display: none; width: 40px; height: 40px; background: url(../image/gotop.png) no-repeat; position: fixed; right:5%; bottom:140px; z-index: 6;} #goto:hover{ background-position: 0 -40px;} .article_detail img{ max-width: 100%;} .news .center{ width:90%;} .line{ margin-top:20px;} .newscont{ width:100%; /*height:120px;*/ overflow:hidden; margin-bottom:0;} .newscontL{width:40%;} .newscontL img{ width:100%; display:block;} .newscontR{width:60%; height:auto; margin-left:0;} .newscont h5,.news li h6,.newscontR span,newscontR p{ margin-left:20px;} .newscontR p{ margin-left:20px;} .newscont h5{ font-size:20px;} .news li h6{ font-size:14px; margin-top:10px;} .newscontR span{ margin-top:30px; top:90%;} .news li{ padding:0 5px 10px 5px;} .side-pannel{ display:none;} /*2015-12-08 #player .pc{ display:none} #player .mobile{ display:block}*/ /****2015-12-08*****/ /*.newsmenu{ width:80%; margin-bottom:20px;} .newsmenu li{ width:33%; height:42px; margin:0 0 0 -1px; padding:0;} .newsmenu li a{ width:100%; height:40px; line-height:40px;}*/ /*2015-12-11*/ .customer img{ width:100%;} /*2015-12-16*/ .footerBox{ width:100%; float:none;} .footerBox:last-child{ float:none; margin-top:40px;} .footerBox p span{ float:none; margin-left:10px;} .copyright a{ width:20px; height:20px; background:url(../image/wxin.jpg) no-repeat; background-size:100%; margin:12px 5px 0 0;} .copyright p{ margin:0; font-size:10px; line-height:18px; margin:10px 0; width:93%;} /*banner*/ .xmSlide{height:290px;} .xmSlide-container{ z-index:6;} /*2015-12-17*/ .about > .center{ width:90%;} .adss{ width:100%;} .about .title{background-size:150% 100%; width:100%; height:40px; margin-bottom:20px;} .about .title h6{ margin-left:15px;font-size:16px;height:40px; line-height:40px;} .about .title p,.about .title h6 span{ display:none;} .about img.dpB{ width:100%;} .about .professional .center{ width:100%; margin-top:10px;} .about .professional .center li{ height:220px;} .about .player{ margin-bottom:40px; padding-top:10px;} /*#player .mobile{ display:block; width:280px;}*/ /*2015-12-21*/ .work{ padding-top:10px;} .backList{ position:relative;} .porfolio .center{width:98%;} .porfolio .center ul{width:100%;} .material_detail{ margin-top:40px;} .material_list li{ width:50%;} .material_list li .infor.fL{ margin-right:10px;} .material_list li .infor.fR{ margin-left:10px;} .address h5{ font-size:32px;} .feedback .text,.feedback .submit{ width:98%;} } /* pixel-ratio : 1 && Portrait 竖排 */ @media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) { } /* pixel-ratio : 1 && landscape 横排 */ @media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) { } /* pixel-ratio : 1 && Portrait */ @media (min-width:736px) and (max-width:767px) { } @media only screen and (min-width : 600px) and (max-width : 767px) and (orientation : portrait) { } @media (max-width: 640px) { /*.center,.porfolio .center{ width:560px;}*/ .tel{ display:none;} .logo{ height:30px;} #kv{/* margin-top:15px*/} /*.step1234 ul .step1 h6{ top: 40px;} .step1234 ul .step1 .step_detail{ top:70px;} .step1234 ul .step2 h6{ top:210px;} .step1234 ul .step3 h6{ top:50px;} .step1234 ul .step3 .step_detail{ top:80px;} .step1234 ul .step4 .step_detail{ top:30px;} .step1234 ul .step4 h6{ top:210px;}*/ .index_box1 h6{ font-size:28px;} .MICdesign h3{ margin-top:20px;} .server ul{ width:80%;} .professional ul{ width:100%;} .professional li{ height:190px;} .professional li p{margin:20px 20px 40px 20px;} .porfolio{ padding:20px 0;} .porfolio.work li.element{ width:33.3%;} #options li{ width:16.6%; margin-bottom:0;} .server ul{ width:100%;} .team_list li{ width:25%;} .work_infor{ width:100%;} .article_page p{ width:48%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} /*2015-12-08 #player .pc{ display:none} #player .mobile{ display:block}*/ /****2015-12-08 .newsmenu{ width:80%; margin-bottom:20px;} .newsmenu li{ width:33%; height:42px; margin:0 0 0 -1px; padding:0;} .newsmenu li a{ width:100%; height:40px; line-height:40px;}*****/ .news{ padding-top:40px;} .menuTab{ margin-bottom:40px;} .newsmenu{ margin-bottom:0;} .newscont{ height:auto;} /*2015-12-11*/ .customer img{ width:100%;} /*banner*/ .xmSlide{height:290px;} /*2015-12-21*/ .about .player{ margin-top:40px; width:100%;} .address h5{ font-size:28px;} } @media (min-width:640px) and (max-width:767px) { } @media (min-width:599px) and (max-width:1023px) { } @media (max-width: 599px) { .center,.porfolio .center{ width:90%;} .tel{ display:none;} /*.index_title{ padding:0 60px;}*/ .logo{ height:30px;} .server ul{ width:100%;} .team_list li{ width:25%;} .customer{ padding-top:60px;} .index_title2{ width:90%;} /*.step1234 ul .step1 .step_detail p, .step1234 ul .step2 .step_detail p, .step1234 ul .step3 .step_detail p, .step1234 ul .step4 .step_detail p{ font-size:12px; line-height:24px; font-weight:400;} .step1234 ul .step1 h6{ top:30px; width: 100%; left:20px;} .step1234 ul .step2 .step_detail{ top:20px;} .step1234 ul .step2 h6{ top:160px; left:0;} .step1234 ul .step3 h6{ left:0;} .step1234 ul .step4 h6{ top:170px;}*/ .work li{ width:50%;} .porfolio_list{ padding:20px 0;} #options li{ width:33.3%; margin-bottom:10px; /* width:20%;*/} #options li:first-child a,#options li a,#options li:last-child a{ margin:0 5px;} .center, .porfolio .center{ width:96%;} .porfolio.work li.element{ width:50%;} .work_infor{ width:100%;} .detail,.material{ margin-top:30px;} /*2015-12-08*/ .index_play .player{ background:url(../image/index_mobile.jpg) no-repeat center top; height:322px;} .index_play .pc{ display:none} .index_play .mobile{ display:block; width:280px; height:174px; position:absolute; top:40px; left:50%; margin-left:-140px;} .about .player{ background:url(../image/about_mobile.jpg) no-repeat center top; height:290px;} .about .pc{ display:none} #player .mobile,.about .mobile{ display:block; width:280px; height:174px; position:absolute; top:49px; left:50%; margin-left:-140px;} .about .index_box1 h4 span{ font-size:50px;} .professional li{ width:50%;} /****2015-12-08 .newsmenu{ width:80%; margin-bottom:20px;} .newsmenu li{ width:33%; height:42px; margin:0 0 0 -1px; padding:0;} .newsmenu li a{ width:100%; height:40px; line-height:40px;}*****/ /*2015-12-11*/ .customer img{ width:100%;} .newsmenu{ width:96%;} .news{ padding-top:40px;} .menuTab{ margin-bottom:40px;} .newscont{ height:auto;} .news li{ padding-bottom:0;} .news li h6{ margin-top:5px; max-height:42px;} .news li p{ display:none;} .newscontR span{ margin-top:25px;} .address h5{ font-size:24px; line-height:32px;} .address h6 p{ line-height:26px;} .contactS{ margin-top:20px;} .contactS li{ width:50%;} .contactS li a{ height:auto;} } @media (max-width: 480px) { .header_box{ height:50px;} .header .logo{ width:140px;} .index_box1 h6{ font-size:24px;} .index_box1 p{ width:96%; margin:0 auto;} .index_box1 li h4,.about .index_box1 h4 span{ font-size:40px;} .header,.header_fixed{ overflow:visible;} .header .center{ height:60px; overflow:hidden;} .header_fixed .center{ height:40px; overflow:hidden;} .header_fixed .logo img{ width:auto;} .MICdesign h3{ font-size:36px;} .MICdesign p.ffTNR{ font-size:20px;} #kv .owl-pagination{ bottom:5px;} #kv.owl-theme .owl-controls .owl-page{ height:5px;} #kv.owl-theme .owl-controls .owl-page span,.xmSlide-pagination li a{ width:15px; height:3px; background:#717071; margin:2px 3px 0 3px;} .xmSlide-pagination li a{ bottom:10px;} #kv.owl-theme .owl-controls .owl-page.active span,.xmSlide-pagination li a.active{ /*width:6px; height:5px;*/} .step1234 ul .step1, .step1234 ul .step2, .step1234 ul .step3, .step1234 ul .step4{ width:50%; margin:0;} .center,.porfolio .center{ width:90%;} .tel{ display:none;} .index_title span.line{ width:60px;} /*.index_title .line{ display:none }.index_title h5{ border-bottom:1px solid #7f7f7f; }*/ .server ul{ margin:20px auto 0 auto;} .team_list{padding-top:20px;} .professional ul{ margin:30px auto 0 auto} .customer{ padding-top:20px;} .work li a img{ margin-bottom:10px;} .server ul{ width:100%;} .footer{ padding:0;} .professional li{ width:50%;} .professional_hover{ display:none;} .work li{ width:50%;} .team_list li{ width:33.3%;} .map{ height:250px;} .nav,.tel{ display:none;} .menu_btn,.close_btn{ width:30px; height:30px; margin:20px 10px 0 0; background:url(../image/menu.jpg) no-repeat; display:block; float:right;} .header_fixed .menu_btn{ margin-top:-3px;} .close_btn{ background-position:-30px 0; position:absolute; bottom:20px; right:20px;} .menu{ width:100%; background:#000; position:fixed; top:60px; left:0; z-index:10; display:none;} .header_fixed .menu{ top:40px;} .menu ul,.menu li > a{ margin:20px; color:#fff;} .menu ul{ width:90%; margin:10px auto;} .menu > ul > li{ clear:both; overflow:hidden;} .menu li > a{ margin:0; line-height:30px; display:block; position:relative;} .menu li > a p{ margin:0;} .menu li > a p + span{ visibility:hidden; position:absolute; top:0; left:0; color:#d2000c;} .menu li > a.current p{ visibility:hidden;} .menu li > a.current span{ visibility:visible;} .subItem{ margin:0 12px;} .subItem a{ line-height:24px; color:#fff; display:block;} .menu .QQPanel{ margin:0 0 20px 0;} .menu .QQPanel li{ margin:0 0 0 5px;float:left;} .menu .QQPanel li a{ width:60px;} .menu .QQPanel li span{ line-height:18px; font-size:12px; color:#fff; display:block;} .menu .qq11{ width:20px; height:20px; background:url(../image/qq.png) no-repeat; display:block; float:left;} .menu .QQPanel li.online .qq11{ background-position:-20px 0; float:left;} .menu p{ margin-bottom:0;} .menu b{ font-size:18px; line-height:20px; margin:5px 0 0 10px; display:block; font-style:italic; color:#717071; font-family:"Arial Black";} .team_list li a p{ display:none;} .team_list li a:hover p{ display:block;} /*2015-11-10*/ .work_detail .brand_logo{ height:70px; padding:0 30px;} .work_detail .case_title{ padding:0 0 0 30px;} .work_detail .case_about{ margin:20px 30px;} /*2015-12-08*/ #player .pc{ display:none} #player .mobile{ display:block} /****2015-12-08*** .newsmenu{ width:80%; margin-bottom:20px;} .newsmenu li{ width:33%; height:42px; margin:0 0 0 -1px; padding:0;} .newsmenu li a{ width:100%; height:40px; line-height:40px;}**/ .newsmenu li a{ margin:0;} .news li h6{ margin-top:0; line-height:14px;} .newscontR span{ margin-top:0;} /*2015-12-11*/ .customer img{ width:100%;} /*banner*/ .xmSlide{height:160px;} .str{ margin:0;} .str img{ width:90%;} .index_title h6{ font-size:20px;} .index_title p{ font-size:14px;} .map_box .center .map{ height:200px;} .address,.feedback{ width:96%; margin:0 auto; float:none;} .contactS li{ height:180px;} .contactBox{ margin-top:0;} } @media only screen and (min-width : 320px) and (max-width : 479px) { body{background-size:200%;} .header{ height:50px;} .header .logo{ /*width:200px;*/ margin:12px 0 0 15px;} .nav.fL{ float:right; margin:5px 0 0 0;} .nav.fL a{ width:40px;} .menu_btn{ margin:10px 10px 0 0;} .menu{ top:50px;} .header_fixed .logo img{ width:auto;} .MICdesign h3{ font-size:36px; line-height:36px;} .MICdesign p.ffTNR{ font-size:20px;} #kv .owl-pagination{ bottom:5px;} #kv.owl-theme .owl-controls .owl-page{ height:5px;} #kv.owl-theme .owl-controls .owl-page span{ width:15px; height:3px; background:#717071; margin:1px 3px 0 3px;} #kv.owl-theme .owl-controls .owl-page.active span{ /*width:6px; height:5px;*/} #kv{ /*margin-top:10px;*/} .server li{ width:50%;} .index_title span.line{ width:60px;} .index_title h5{ width:100%; padding:0 20px; font-size:14px; top:0; position:relative; transform:scale(.9);-webkit-transform:scale(.9);-moz-transform:scale(.9);-o-transform:scale(.9);-ms-transform:scale(.9);} /*.step1234 ul li h6 p{ font-size:18px; width:80px;} .step1234 ul li h6 span{ font-size:12px;} .step1234 ul .step1 h6{ left:0; top:20px;} */ .kv{ margin-bottom:40px;} .index_title1{ width:140px; margin-bottom:30px;} .index_title2{ margin-bottom:20px;} .index_box2{ margin-bottom:30px;} .index_title3{ width:220px; margin-bottom:30px;} .index_title4{ width:120px; margin-bottom:30px;} .index_title5{ width:230px;} .process{ margin-bottom:30px;} .index_title6{ width:240px;} .moreCase li a p{ line-height:18px;} .index_box1 li{ width:31.3%; margin:0 1%;} .index_box1 li h4{ font-size:36px; margin-bottom:0;} .index_box1 li p{ font-size:16px; line-height:20px; } .about #wrap{ padding:0;} .process .professional.inner{ margin-top:40px;} .professional ul{ margin:30px auto 0 auto} .professional li{ width:50%; height:170px; margin:0 auto;} .about .professional p{ font-size:12px; margin:20px 10px 40px 10px;} .about .professional p span{ font-size:14px; line-height:18px;} .index_case ul li:last-child{ display:none;} .work ul{ margin-top:20px;} .work li{ width:50%;} .work li a img{ margin-bottom:0;} .work li a i p{ height:30px; overflow:hidden;} .porfolio.work li.element{ height:125px; margin-bottom:5px;} .element a:hover i b{ top:35%;} .porfolio_list{ padding-bottom:10px;} .center{ width:90%;} .porfolio .center.cb.mc{ width:92%;} .professional_hover{ display:none;} .team_list{padding-top:20px;} .team_list li{ width:50%;} .material.work li a i p{ font-size:12px;} /*.material_list .work li{ width:100%;}*/ .work ul{ margin-top:0;} .material{ margin-top:20px;} .material_title{ width:240px;} .material_list li{ width:90%; float:none; margin:0 auto 30px auto;} .material_list li div,.material_list li .infor.fR{ margin:0;} .material_list li .infor p{ height:auto;} .tel{ display:none;} .index_title span.line{ width:60px; } .server ul{ margin:20px auto 0 auto;} .customer{ padding-top:20px;} .footer{ padding:0;} .footer .center,.copyright .center{ width:94%;} .index_box1 h6{ font-size:20px;} .copyright{ height:auto;} .newscont{ min-height:110px;} .news li h6{ max-height:2em;} .footer .center{ margin-bottom:60px;} .map{ height:250px;} .news{ padding-bottom:0;} .article_page p{ width: 100%;max-width: 100%; clear: both;} /*2015-12-08*/ #player{ min-height:124px; min-width:220px; overflow:hidden;} #player .pc{ display:none} #player2 .mobile{ display:block} #player .mobile{ display:block; height:124px; width:220px; position:relative; margin:0; top:0; left:0;} /****2015-12-08*** .newsmenu{ width:80%; margin-bottom:20px;} .newsmenu li{ width:33%; height:42px; margin:0 0 0 -1px; padding:0;} .newsmenu li a{ width:100%; height:40px; line-height:40px;}**/ /*2015-12-11*/ .customer img{ width:100%;} } @media only screen and (min-width : 320px) and (max-width : 400px) and (orientation : portrait) { /*banner*/ .xmSlide{height:130px;} .copyright p{ width:91%;} .index_box1 li p{ font-size:14px; line-height:18px; } .porfolio .center.cb.mc{ width:94%;} .porfolio.work li.element {height:98px;} .news{ padding-top:30px;} } .TK-log{display:none;} .__TTS_union{display:none;} .infor_box{ padding-bottom:20px; border-bottom:1px solid #a4a4a4; margin-bottom:20px;} .work_infor h6{ height:28px; line-height:18px; font-size:16px; font-weight:400; border-bottom:1px solid #a4a4a4; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .work_infor span{ margin:15px 0 0 0; padding-bottom:15px; border-bottom:1px solid #a4a4a4; font-family:Arial; display:block; margin-bottom:10px;} .work_detail .case_detail img{width:100%; float:none;} @media only screen and (min-width : 320px) and (max-width : 479px) and (orientation : portrait) { } /* pixel-ratio : 1 && landscape */ @media only screen and (min-width : 480px) and (max-width : 640px) and (orientation : landscape) { } @media only screen and (min-width : 230px) and (max-width : 479x) and (orientation : landscape) { } .lb a{ background: none; color: #fff; } .lb a img{ margin-top: 5px; margin-left: 20px; }