@charset "utf-8";
/* CSS Document */
.page-main{ width:1200px; margin:0 auto; height:auto;}

/*case*/
.case-title{ width:1200px; height:50px; font-size:30px; font-weight:bold; color:#333333; margin:0 auto; 
			margin-top:65px; background:url(/style/images/case-title-bg.gif) no-repeat bottom left;}
			
.case-menu{ width:1200px; height:140px; margin:0 auto; padding-top:5px; padding-bottom:5px; margin-top:50px;background:#FFF;}
.case-menu .case-menu-links{ float:left; padding-top:10px; }
.case-menu .case-menu-links a{ display:block; float:left; text-align:center; padding:5px 10px 5px 10px; min-width:50px; width:auto; margin-left:5px;

				}
				
.case-menu .case-menu-links a:hover{ color:#E90041;}
.case-menu .case-menu-links a.select{ color:#E90041;}

.case-menu-bot{ position:relative; width:159px; height:51px; padding:0px 30px 0px 30px; float:right; 
				background:url(/style/images/case-menu-bg.jpg) no-repeat top center; color:#FFF; font-size:14px;
				cursor:pointer;
				}
.case-menu-bot h1{ font-size:14px; color:#FFF; text-align:right; line-height:48px;}
.case-menu-bot .case-bot{ width:117px; height:51px; background:url(/style/images/case-menu-bot.png) no-repeat top center;
						 position:absolute; top:0px; text-align:center; color:#EC0042; line-height:50px; font-size:14px; left:0px;}
						 
.case-content{width:950px;margin:0 auto; margin-top:40px;}

.menulist a{ display:block;  float:left; text-align:center; padding:0px 10px 5px 10px; width:150px; margin-left:15px;
			    -moz-border-radius: 5px;      /* Gecko browsers */
    			-webkit-border-radius: 5px;   /* Webkit browsers */
    			border-radius:5px;            /* W3C syntax */
				text-align:left;
				}
.ilist a{ width:100px; text-align:center;}
.menulist a:hover{ color:#E90041;}
.menulist a.select{ color:#E90041;}

.menulist-l{ float:left; width:115px;}
.menulist-r{ float:left; width:1000px;}
/*case pubu*/
.item_list{position:relative;padding:0 0 50px;}
.item{
	width:400px;background:#fff;overflow:hidden;
	height:270px;
	margin-left:0px;
	position:relative;
}
#more{display:block;margin:10px auto 20px;}
#infscr-loading{bottom:-10px;left:45%;position:absolute;text-align:center;height:20px;line-height:20px;z-index:100;width:120px;}	

.item .dec{ width:400px; height:270px; background:url(/style/images/casebg.png) no-repeat top center; position:absolute; top:230px; z-index:99; cursor:pointer;}	
.item .dec p{ width:266px; margin:0 auto;}
.item .dec .text{ width:266px; margin:0 auto; line-height:40px; height:auto; text-align:center; margin-top:0px;}	
.item .dec .text a{ color:#FFF;}	
.item .dec .text a.case-name{ font-size:24px; font-weight:bold;}	

.index-case-item{ width:560px; height:360px;float:left; margin-top:30px; margin-left:10px; cursor:pointer; border-bottom:1px solid #E5E5E5;}
.index-case-item img{width:560px; height:250px;}
.index-case-item p{ font-size:14px; color:#6C6869; margin-top:15px;}
.index-case-item h1{ font-size:24px; color:#2B2524; margin-top:10px;}
.index-case-item span{ display:block; margin-top:5px;}

/*case pubu end*/

/*show-case*/
.show-case{ width:1200px; height:auto; margin:0 auto;}

.top-nav{ margin-top:20px;}
.top-nav h1{ float:left; font-size:24px; color:#3E3A39;}
.top-nav a{ float:right; margin-top:5px; margin-right:5px;}

.showcase-banner{ width:1200px; height:auto; margin:0 auto; margin-top:20px;}

.case-content{width:1200px; height:auto; margin:0 auto; margin-top:35px;}
.case-content .left{ float:left; background:#EFEFEF; width:200px; min-height:500px;  padding:25px; padding-top:40px;}
.case-content .left .line{ width:200px; border-bottom:1px solid #D3D3D3; height:1px; margin-top:40px;}
.case-content .left .project-nav{ width:130px; margin:0 auto;margin-top:25px; }
.case-content .left .project-nav a{ display:block; width:130px; height:33px; text-align:center; line-height:32px;}
.case-content .left .project-nav a:hover{ background:url(/style/images/project-nav-bg.gif) no-repeat center top; color:#FFF;}
.case-content .left .project-nav a.select{background:url(/style/images/project-nav-bg.gif) no-repeat center top; color:#FFF;}
.case-content .left .recommend-case{ width:198px; margin:0 auto;text-align:center; margin-top:25px;}
.case-content .left .recommend-case .recommend-item{ text-align:center; margin-top:10px;}

.case-content .right{ float:right; width:890px;}
.case-content .right .case-dec{margin-left:13px; margin-top:25px; border-bottom:1px solid #C9C9C9; padding-bottom:10px;}
.case-content .right .case-dec .share-up{ height:33px; line-height:33px; margin-top:25px;}
.case-content .right .case-dec .share-up span{ float:left;}
.case-content .right .case-dec .share-up a{ float:left; width:30px; height:30px; display:block; background:url(/style/images/share-up.gif) no-repeat 0 0; }

.servie-nav{ width:670px; padding-left:207px; margin-left:13px; height:60px; 
			background:url(/style/images/case-service-bg.gif) no-repeat left top; margin-top:15px;}
.servie-nav a{ width:74px; height:60px; display:block; float:left;
			   background:url(/style/images/case-service.gif) no-repeat left top; line-height:85px; padding-left:15px; }
			  
.servie-nav a:hover{ background:url(/style/images/case-net.gif) no-repeat left top; color:#FFF; padding-left:10px; width:79px;}
.servie-nav a.select{ background:url(/style/images/case-net.gif) no-repeat left top; color:#FFF; padding-left:10px; width:79px;}

.servie-con{ margin-top:30px; margin-left:13px;}
.servie-con .servie-con-item{ display:none;}
.servie-con .servie-con-item img{ max-width:874px;}


/*services*/
.service-item{ width:390px; height:580px; float:left; border:1px solid #DDDDDD; margin-left:10px;}
.service-item .service-dec{ width:360px; margin:0 auto; margin-top:25px; cursor:pointer;}
.service-item .service-dec a{ font-size:26px; font-weight:bold; color:#373634;}
.service-item .service-dec p{ margin-top:15px;}

.service-item2{ width:290px; height:440px;border:1px solid #DDDDDD; margin-left:10px; float:left;}
.service-item2 img{ width:290px; height:278px;}
.service-item2 .service-dec{ width:250px; margin:0 auto; margin-top:25px;}
.service-item2 .service-dec a{ font-size:26px; font-weight:bold; color:#373634;}
.service-item2 .service-dec p{ margin-top:15px;}

.service-category-title{ width:1200px; height:65px; background:#EFEFEF; line-height:60px; font-size:28px; font-weight:bold; color:#6B696A; text-align:center;}
.service-category{ width:1198px; height:288px; border:1px solid #DDDDDD; border-top:none; overflow:hidden;}

/*about*/
.page-nav{ width:1200px; margin:0 auto; height:45px; margin-top:78px;}
.page-nav span{ font-size:28px; font-weight:bold; color:#383735; float:left; line-height:45px;}
.page-nav a{ float:left; display:block; width:104px; height:45px; font-size:18px; text-align:center;line-height:45px;}
.page-nav a:hover{ background:#E6003E; color:#FFF;}
.page-nav a.select{ background:#E6003E; color:#FFF;}

.about-title{ width:1170px; padding-left:30px; height:68px; padding-top:180px; background:#EFEFEF; color:#383735; font-size:42px; font-weight:bold;}
.about-who-item{ width:1200px; height:600px; border:1px solid #E2E2E2; border-top:none;}
.about-who-item .left{ float:left; width:250px; padding:27px; padding-top:332px;}
.about-who-item .left span{ font-size:24px; font-weight:bold; color:#E50140;}
.about-who-item .left p{ line-height:30px; margin-top:10px; font-size:16px;}
.about-who-item .left img{ width:888px; height:599px;}
.about-who-item .right{ float:right;}

.about-for-black{ display:block; float:left; width:300px; height:200px; padding-top:100px; background:#383735; color:#FFFFFF; text-align:center; font-size:28px; line-height:35px;}
.about-for-black:hover{color:#FFFFFF;}
.about-for-white{ display:block; float:left; width:300px; height:200px; padding-top:100px; background:#FFFDFD; color:#737172; text-align:center; font-size:28px; line-height:35px;}
.about-for-white:hover{color:#737172;}

.about-for-black:not(:hover):not(:target) {-webkit-animation: 0s ease 0s normal none 1 none;}
.about-for-black:not(:hover):not(:target) {-moz-animation: 0s ease 0s normal none 1 none;}
.about-for-black:not(:hover):not(:target) {animation: 0s ease 0s normal none 1 none !important;}
	  
.about-for-black {-webkit-animation:transform-5 1s ease 0s alternate none infinite;}
.about-for-black {-moz-animation:transform-5 1s ease 0s alternate none infinite;}
.about-for-black {animation:transform-5 1s ease 0s alternate none infinite;}
@-webkit-keyframes transform-5 { from{-webkit-transform:perspective(400px) rotateY(0deg); } to{-webkit-transform:perspective(400px) rotateY(360deg); } }
@-moz-keyframes transform-5 { from{-moz-transform:perspective(400px) rotateY(0deg); } to{-moz-transform:perspective(400px) rotateY(360deg); } }
@keyframes transform-5 { from{transform:perspective(400px) rotateY(0deg); } to{transform:perspective(400px) rotateY(360deg); } }

.about-can-item{ float:left; width:338px; padding:100px 30px 0 30px; height:300px; border-right:1px solid #C9C9C9; }
.about-can-item span{ font-weight:bold; font-size:28px; color:#E5003F;}
.about-can-item p{ margin-top:15px; font-size:16px; line-height:30px;}

.about-why-item{ width:111px; height:111px; float:left; padding:30px; font-size:12px;} 
.bk{ background:#A0A0A0; color:#FFF;}
.about-why-item span{ font-size:20px; font-weight:bold; color:#E5013E;}




/*jobs*/
.jobs-content{ border:1px solid #DDDDDD; width:1200px; min-height:400px; height:auto;}
.jobs-content .left{ width:340px; float:left; padding:30px;}
.jobs-content .right{ width:798px; float:right; border-left:1px solid #DDDDDD;}

.jobs{ width:798px; height:400px; border-bottom:1px solid #DDDDDD;}
.jobs h1{ float:left; width:100px; text-align:center; font-weight:bold; font-size:20px; color:#353432; margin-top:35px;}
.jobs .jobs-title{ float:left; width:140px; margin:30px;}
.jobs .jobs-title a{ display:block; font-size:18px; line-height:35px; background:url(/style/images/jobs.gif) no-repeat right 7px;}
.jobs .jobs-title a:hover{background:url(/style/images/jobsr.gif) no-repeat right 7px;}
.jobs .jobs-title a.select{background:url(/style/images/jobsr.gif) no-repeat right 7px;}
.jobs .jobs-text{ width:460px; float:right; margin-top:35px;float:left;}

.jobs .submit{ width:130px; height:30px; color:#FFF; font-size:14px; display:block;
			 text-align:center; background:#E6003E url(/style/images/submitjobs.gif) no-repeat 110px 8px; line-height:28px; margin-left:320px; margin-top:20px;}
			 
/*contact*/
.map-item{ width:1198px; height:298px; border:1px solid #D9D9D9; margin-top:65px;}
.map-item img{ float:left; border-right:1px solid #D9D9D9;}
.map-item .mapdec{ float:right; width:570px; }
.map-item .mapdec .text{ float:left; width:285px; margin-top:38px;}
.map-item .mapdec .text h1{ color:#383735; font-size:18px; font-weight:bold; line-height:35px;}
.map-item .mapdec .qr{ float:right; margin-right:30px; margin-top:68px;}

/*service*/
.service-nav{ width:1200px; height:71px; margin-top:50px;}
.service-nav a{ width:192px; height:71px; display:block; float:left; background:url(/style/images/servicenav.png) no-repeat; margin-left:9px;}
.service-nav a.brand{ background-position:-10px -19px; margin-left:0px;}
.service-nav a.brand:hover{ background-position:-10px -109px;}
.service-nav a.brand_select{ background-position:-10px -109px;}

.service-nav a.design{ background-position:-212px -19px;}
.service-nav a.design:hover{ background-position:-212px -109px;}
.service-nav a.design_select{ background-position:-212px -109px;}

.service-nav a.eshop{ background-position:-413px -19px;}
.service-nav a.eshop:hover{ background-position:-413px -109px;}
.service-nav a.eshop_select{ background-position:-413px -109px;}

.service-nav a.video{ background-position:-615px -19px;}
.service-nav a.video:hover{ background-position:-615px -109px;}
.service-nav a.video_select{ background-position:-615px -109px;}

.service-nav a.web{ background-position:-817px -19px;}
.service-nav a.web:hover{ background-position:-817px -109px;}
.service-nav a.web_select{ background-position:-817px -109px;}

.service-nav a.shop{ background-position:-1019px -19px;}
.service-nav a.shop:hover{ background-position:-1019px -109px;}
.service-nav a.shop_select{ background-position:-1019px -109px;}

.showservice-item{ width:570px; height:200px; float:left; padding-right:30px;}
.showservice-item span{ margin-left:25px;}
.showservice-item p{ float:left; width:375px; margin-top:10px; padding-left:25px;}
.showservice-item div.showr{ float:right;  margin-top:10px; text-align:center;}
.showservice-title{ width:600px; height:30px; border-top:1px solid #DFDFDF; background:#F3F3F3;}


.about-team-item{height:315px; width:1200px; border-bottom:1px dashed #909193; padding-bottom:35px; margin-top:20px;}
.team-item-right{ float:right; margin-left:20px; width:976px;}
.team-tit{ background:url(/style/images/tbg.jpg) no-repeat; width:322px; height:54px; padding-top:5px; line-height:25px; padding-left:15px; font-size:24px; font-weight:bold; color:#FFF;}
.team-tit span{ display:block; font-size:18px;}
.about-team-item img{ float:left;}
.team-dec{ margin-top:20px;}
.team-dec h1{ font-size:16px; font-weight:bold; color:#E6003E;}

/*indexservice*/
.indexsnav{ height:139px; margin:0 auto;}
.indexsnav a{ width:174px; height:139px; display:block; float:left; margin-left:30px; text-align:center; font-size:18px; line-height:139px;}
.indexsnav a:hover{ background:#ff6d00 url(/style/images/indexservice-nav.jpg) center bottom no-repeat; color:#FFF;}
.indexsnav a.select{ background:#ff6d00 url(/style/images/indexservice-nav.jpg) center bottom no-repeat; color:#FFF;}

.indexservice-dec{ width:100%; height:650px;background:url(/style/images/indexservicebg.jpg) no-repeat center bottom; margin-top:40px; padding-top:40px;}
.indexslist{ width:1200px; height:572px; margin:0 auto; margin-top:50px;}
.indexsitem{ width:271px; height:300px; float:left; background:#ffffff url(/style/images/indexservicearr.jpg) no-repeat right top; margin-left:30px;}
.indexsitem img{ display:none;}
.indexsdec{ width:225px; height:279px; margin:0 auto; margin-top:20px;}
.indexstit{ font-size:16px; color:#292929; font-weight:bold;}
.indexscon{ background:url(/style/images/indexstitbg.gif) no-repeat left top; margin-top:15px; padding-top:15px; font-size:18px; color:#292929; line-height:30px;}
.indexscon span{ color:#E53252; font-size:18px;}
.indexscon em{ color:#5F5F5F; font-size:12px;}


/*services2018*/
.page-con-2018{ width:100%;}
.page-con-top{ width:100%; height:350px; background:#000; text-align:center; font-size:50px; color:#FFF; line-height:70px; padding-top:170px;}
.page-con-text{ width:1200px; margin:0 auto;  margin-top:100px;}
.page-con-l{ float:left; width:350px; text-align:center; font-size:36px; color:#5F5F60;}
.page-con-r{ float:right; width:800px; color:#484848;}
.page-con-r h1{ font-size:24px; font-weight:bold; }
.page-con-r p{ font-size:18px; margin-top:10px; line-height:35px;}
.page-con-r span{ display:block;font-size:16px;  margin-top:10px;}
.page-con-item{ border-bottom:1px solid #7E7E7E; padding-bottom:30px;margin-top:30px;}
.page-con-text a{ font-size:16px; display:block; margin-top:20px; color:#E5003D;}
.page-con-text a:hover{ color:#9C2442;}