﻿@charset "utf-8";
/* CSS Document */
body{margin:0 auto;padding:0;font-size:12px;font-family:Microsoft Yahei;color:#000;background-color:#ffffff;width:100%;}
ul,li,dl,dt,dd,form,h1,h2,h3,h4,p,tr,td,th{margin:0px;padding:0px}
li {list-style-type:none}
img{border:0}
.clear{margin:0;padding:0;clear:both}
.clear hr{margin:0;padding:0;display:none}
a{color:#343331;text-decoration:none;outline:none}
a:hover{/*color:#df494b;*/text-decoration:none}
a:active{star:expression(this.onFocus=this.blur())}
:focus{outline:0}
.en{font-family:Arial;font-size:11px}
body,html{overflow-x:hidden}


/*top*/
header{height:60px;overflow:hidden;position:relative;background:#fff;width:100%;z-index:999;top:0;}
header .inner{width:100%;overflow:hidden;height:70px;}
.logo{margin:0 10px;overflow:hidden;float:left;display:inline;width:120;height:70px}
.logo img{width:155px;height:60px;}
.phone{float:right;display:block;text-align:center;margin-right:10px;margin-top:25px;}
.phone a{font-size:16px;color:#000;float:left;position:relative;height:35px;top:3px;right:10px;}
.phone .menu_but{width:30px;height:25px;float:right;}
.phone .menu_but img{vertical-align:top;width:30px;height:25px;}
.phone a b{color:#f01f21}


/*menu*/
nav{z-index:9999;}  

nav ul{
	width:100%;
	background:#000;
	color:#fff;
	display:none;
}

nav ul li{
	width:100%;
	height:44px;
	text-align:center;
	border-bottom:1px solid #fff;}
nav ul li a{
	color:#fff;
	font-size:18px;
	line-height:44px;}
nav ul li a:hover{
	color:#F01F21;}
nav ul li a b/*,nav ul li a span*/{
color:#F01F21;
}

/*banner*/

#focusIndex1
{
	background:filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='b.jpg',sizingMethod='scale');
	background-repeat: no-repeat;
	background-position: 100%, 100%;
	background-image:url("b.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	display:block;
}

#focusIndex2
{
	background:filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='b.jpg',sizingMethod='scale');
	background-repeat: no-repeat;
	background-position: 100%, 100%;
	background-image:url("b-1.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	display:block;
}

#focusIndex3
{
	background:filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='b.jpg',sizingMethod='scale');
	background-repeat: no-repeat;
	background-position: 100%, 100%;
	background-image:url("b-2.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	display:block;
}

#focusBar {	
    width: 100%;
    height: 160px;
    clear: both;
	margin:0 auto;
    position: relative;
    background: #242424;
	margin:0 auto;
    overflow: hidden;
}

#focusBar li {
	width: 100%;
	clear: both;
	height: 160px;
	display: none;
	position: absolute;
	background-repeat: no-repeat;
	background-position: center;
}

#focusBar .focusL {
	height: 160px;
	position: absolute;
	z-index: 19;
	top: 0px;
	left: -160px;
	margin-left: 50%;
}

#focusBar .focusR {
	height: 160px;
	position: absolute;
	z-index: 9;
	top: 0px;
	left: -160px;
	margin-left: 50%;
}

#focusBar .focusL img{width:100%;height:auto;}
#focusBar .focusR img{width:100%;height:auto;}

.index{width:100%;position:relative;overflow:hidden}



#servies{height:250px;}
#servies h1{font-family:微软雅黑;font-size:16px;text-align:center;font-weight:500;padding-top:18px}
#servies h1 b{font-family:宋体;font-size:50px;color:#f01f21}
#servies h1 span{font-family:Arial;font-size:18px}
.servies_index{width:350px;overflow:hidden;position:relative;height:250px;margin:0 auto;}
.servies_index_item{width:82px;position:absolute;height:226px;top:40px;left:-480px}
#design{left:5px}
#web{left:92px}
#mobile{left:179px}
#mobile1{left:266px}
.servies_font_cn{font-family:微软雅黑;font-size:18px;text-align:center;padding:0px 0 11px;background:url("serviec_border_21.jpg") no-repeat bottom center;}
.servies_font_cn a{color:#707070}
.ffonts{width:82px;padding-top:40px;-moz-opacity:0.0;opacity:0.0}
.servies_font_en{font-size:10px;text-align:center; text-transform:uppercase; line-height:22px;}
.servies_font_en b{font-size:26px;font-family:宋体;color:#f01f21}

#design .servies_index_itemb{background:url("index_icon1.jpg") no-repeat center top;}
#web .servies_index_itemb{background:url("index_icon2.jpg") no-repeat center top}
#mobile .servies_index_itemb{background:url("index_icon3.jpg") no-repeat center top}
#mobile1 .servies_index_itemb{background:url("index_icon4.jpg") no-repeat center top}
.servies_index_itemb{width:82px;height:82px;overflow:hidden;
	-ms-transition:all 0.5s ease-in-out 0s;
	-webkit-transition:all 0.5s ease-in-out 0s;
    -oz-transition:all 0.5s ease-in-out 0s;
	transition:all 0.5s ease-in-out 0s;
	
	-oz-transform:scale(0.5);
	-ms-transform:scale(0.5);
	-webkit-transform:scale(0.5);
	transform:scale(0.5);
}
.servies_pic{
	position:relative;
	width:57px;height:57px;
	margin:12px;
	-webkit-transition:box-shadow 0.4s ease-in-out 0s;
	-ms-transition:box-shadow 0.4s ease-in-out 0s;
	-oz-transition:box-shadow 0.4s ease-in-out 0s;
	transition:box-shadow 0.4s ease-in-out 0s;
	border-radius:50%;
	box-shadow: 0 0 0 37px rgba(255, 255, 255, 0.2), 0 0 83px rgba(115, 114, 23, 0.8) inset;
}
.servies_index_item img{
	position:absolute;
	left:0;
	top:0;
	-ms-transform-style: preserve-3d;
    -ms-transition:all 0.5s ease-in-out 0s;
	-webkit-transform-style: preserve-3d;
	-webkit-transition:all 0.5s ease-in-out 0s;
	-oz-transform-style: preserve-3d;
    -oz-transition:all 0.5s ease-in-out 0s;

    transform-style: preserve-3d;
    transition:all 0.5s ease-in-out 0s;
	border-radius:50%;
}

.servies_index_item:hover img{
	-oz-transform:rotateY(-180deg);
	-ms-transform:rotateY(-180deg);
	-webkit-transform:rotateY(-180deg);
	transform:rotateY(-180deg);
}
.servies_index_item:hover .servies_pic{
	box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.8), 0 0 3px rgba(115, 114, 23, 0.8) inset;
}
.servies_index_show{
	-oz-transform:scale(1);
	-ms-transform:scale(1);
	-webkit-transform:scale(1);
	transform:scale(1);
}
.servies_pic_bottom{position:absolute;width:57px;height:57px;background:#fff;border-radius:50%;}


section#client{background:url("clientbg_02.jpg") no-repeat center;background-size:cover;width:100%;position:relative;}
section#client h1{font-family:微软雅黑;font-size:16px;text-align:center;font-weight:500;color:#fff;padding:10px 0;}
section#client h1 b{font-family:宋体;font-size:50px;color:#f01f21}
section#client h1 span{font-family:Arial;font-size:18px}
section#client h1 font{font-family:Arial;font-size:16px;}

.clientscroll{width:320px;height:180px;position:relative;overflow:hidden;margin:0 auto;}
.clientitem{width:70;height:70;overflow:hidden;float:left;display:inline;margin:2px 0px 8px 8px;}
.clientitem img{width:70px;height:70px;}
.swiper-slide{float:left;display:inline}
.swiper-wrapper{height:150px; color:#aaa;}
.swiper-wrapper a{color:#f01f21}


.pagination1 { text-align: center;margin-bottom:50px;}
.pagination1 .swiper-pagination-switch { display: inline-block; width: 30px; height: 3px; border-radius: 10px; background: #fff;  margin: 0 5px; cursor: pointer; }
.pagination1 .swiper-active-switch { background: #f01f21;}



#case h1{font-family:微软雅黑;font-size:16px;text-align:center;font-weight:500;padding-top:18px}
#case h1 b{font-family:宋体;font-size:50px;color:#f01f21}
#case h1 span{font-family:Arial;font-size:18px}
.index_case{padding:10px 10px 10px}
.index_case .i_c_list{border:#d2d1d1 1px solid;box-shadow: 0px 0px 8px rgba(34, 25, 25,0.6);overflow:hidden;margin-bottom:40px;}
.index_case .i_c_list .case_pic{width:100%;overflow:hidden}
.index_case .i_c_list .case_pic img{width:100%;height:auto;}
.index_case .i_c_list .case_name{width:100%;height:40px;font-size:16px;color:#000;overflow:hidden;line-height:40px;padding-left:10px;}


#contact{width:100%;background:url("contactbg_02.jpg") no-repeat center;background-size:cover;color:#fff;}
#contact h1{font-family:微软雅黑;font-size:16px;text-align:center;font-weight:500;color:#fff;}
#contact h1 b{font-family:宋体;font-size:50px;color:#f01f21}
#contact h1 span{font-family:Arial;font-size:18px}
#contact h1 label{letter-spacing:1px}
.contact_cont{width:330px;margin:0 auto}
.contact_cont_info{ padding:10px 10px 10px;}
.contact_cont_info_l{font-size:12px;line-height:180%}
.contact_cont_info_l p{font-size:12px;color:#fff}
.contact_cont_info_l p a{font-size:12px;color:#fff}

.contact_cont_message{width:100%;position:relative;;background:url("contactbg_02.jpg") no-repeat center;margin-top:0px;background-size:cover; margin-bottom:10px;}
.message_left{ margin-top:position:relative;padding-top:30px;width:310px;margin:0 auto;}
.message_left p{width:300px;height:34px;background:url("input_03.png") no-repeat;padding:10 0 0 20px;margin-bottom:15px;background-size:cover;}
.message_left input.txt{font-size:12px;font-family:"微软雅黑";overflow:hidden;width:100%;height:30px;border:none;background:none;padding-left:5px;}
.message_left p.des_con{width:290px;height:115px;background:url("textarea_06.png") no-repeat;padding:5px 8px;background-size:cover;padding-left:5px;}
.message_left p textarea{width:100%;height:115px;background:none;border:none;font-size:12px;font-family:"微软雅黑";overflow:hidden;}

.mesbtn{width:100px;height:100px;overflow:hidden;background:url("submit_12.png") no-repeat;margin:30px auto 0}
.mesbtn a{display:block;width:100px;height:100px;background:url("submit_12.png") 0px -100px no-repeat;overflow:hidden;-moz-opacity:0.0;opacity:0.0;z-index:9;text-indent:9999px;line-height:999px}

#footer{width:100%;position:relative;margin:0 auto;margin-top:20px;}
.footer_bot{height:86px;width:300px;margin:0 auto;}
.footer_bot p{width:85px;height:85px;float:left;display:block;margin:0 10px; margin-top:3px;}
.footer_bot p#qq{background:url("qq_black.png") no-repeat;width:80px;height:80px;}
.footer_bot p#wx{background:url("tel_bak.png") no-repeat;width:80px;height:80px;}
.footer_bot p#wb{background:url("mob_bak.png") 0 0 no-repeat;width:80px;height:80px;}
.footer_bot p#qq:hover{background:url("qq_color.png") no-repeat;display:block;width:80px;height:80px;}
.footer_bot p#wx:hover{background:url("tel_bakco.png") no-repeat;display:block;width:80px;height:80px;}
.footer_bot p#wb:hover{background:url("mob_bakco.png") 0 0px no-repeat;display:block;width:80px;height:80px;}
.footer_copy{color:#666;text-align:center;font-size:12px;font-family:Arial;margin-top:30px;margin-bottom:20px;}



.addWrap{ position:relative; width:100%;background:#fff;margin:0; padding:0;}
.addWrap .swipe{overflow: hidden;visibility: hidden;position:relative;}
.addWrap .swipe-wrap{overflow:hidden;position:relative;}
.addWrap .swipe-wrap > div {float: left;width: 100%;position:relative;}
#position{ position:absolute; bottom:0; right:0; padding-right:8px; margin:0; background:#000; opacity: 0.4; width:100%; filter: alpha(opacity=50);text-align:right;}
#position li{width:10px;height:10px;margin:0 2px;display:inline-block;-webkit-border-radius:5px;border-radius:5px;background-color:#AFAFAF;}
#position li.cur{background-color:#FF0000;}
.img-responsive { display: block; max-width:100%;height: auto;}

.style5_xian {
    width:100%;
    height:30px;
    line-height:30px;
    border-bottom:1px solid #d2d1d1;
}
.style5_xian h2{
    font-weight:normal;
    font-size:14px;
}
.style5_title{
    float:left;
}
    .style5_xian span {
        float:right;
    }


