@import url("base.css");
@import url("header.css");
@import url("footer.css");

/*广告*/
.bannerbox { position: relative; height: 900px; background: #ef7818;
    background: -moz-linear-gradient(to top, #ef7818 0%, #f89938 100%);
    background: -webkit-linear-gradient(to top, #ef7818 0%, #f89938 100%);
    background: -o-linear-gradient(to top, #ef7818 0%, #f89938 100%);
    background: -ms-linear-gradient(to top, #ef7818 0%, #f89938 100%);
    background: linear-gradient(to top, #ef7818 0%, #f89938 100%);
}

.bannerbox .innerbox{ height: 100%; min-width: 1350px; }
.banner-con { width: 100%; height: 100%; background: url(../images/banner/ban-bg-large.jpg) center center no-repeat; background-size: cover; }
.banner-txt{width: 600px; position: absolute; top: 170px; left: 50%;margin-left: -635px;}
.banner-txt .company-name{font-size: 20px; color: rgba(0,0,0,.55); font-weight: lighter; text-shadow: 0 1px 0px rgba(255,255,255,.5)}
.banner-txt .slogan {padding: 150px 0 0 60px;}
.banner-txt .slogan .cn{font-size: 72px; color: rgba(255,255,255,.95);  text-shadow: 0 2px 2px rgba(0,0,0,.3)}
.banner-txt .slogan .en{ padding-top: 20px; font-size: 30px; font-weight: lighter; color: rgba(255,255,255,.85);  text-shadow: 0 1px 0px rgba(0,0,0,.3)}

/* 区块通用 */
.block-tit .title {float: left;  padding-right: 120px; }
.block-tit h3 { font-size: 48px; color: #000; }

.block-tit h3 span{ color: #ff7400; }
.block-tit h5 { font-size: 24px; font-weight: lighter; text-transform: uppercase; background: linear-gradient(to top,  #ff7400 50%, #bebebe 50%);-webkit-background-clip: text;  color: transparent;}
.block-con {}
.block-bot {}

/*案例展示*/
.casebox{}
.casebox .innerbox{ margin: 65px 10% 50px;min-width: 1350px; }
.casebox .tabs-switch{float: left; padding-top: 25px;}
.tabs-switch li{position: relative;display: block;float: left; padding: 0 25px; cursor: pointer;}
.tabs-switch .cn{font-size: 28px; font-weight: lighter; color: rgba(0,0,0,.45);}
.tabs-switch .en{position: relative;  font-size: 16px; font-weight: lighter; text-transform: uppercase;background: linear-gradient(to top,  #ff7400 50%, #bebebe 50%,#fff 95%);-webkit-background-clip: text;  color: transparent;}
.tabs-switch li:hover .cn{color: rgba(0,0,0,.75);}
.tabs-switch li.active .cn{color: #000;}
.tabs-switch li.active .en{ background: linear-gradient(to top,  #fff 50%, #ff7400 50%);-webkit-background-clip: text;  color: transparent; z-index: 10;}
.tabs-switch li.active:before{content: ""; position: absolute; left: 18px;bottom: 0px; height: 10px; right: 18px; border-radius: 5px 0 ; background: #ff8926; z-index: 1;}
.tab-content>.tab-pane{display:none;min-height: 470px;}
.tab-content>.active{display:block}
.casebox .tab-content .innerbox {margin: 0 8%;}

/*项目类*/
.projectd-item{ position: relative;  padding-top: 5px;}
.picScroll{ overflow:hidden; position:relative;   }
.picScroll .prev,.picScroll .next{ position: absolute; left: 2%; top: 150px; width:90px; height:120px; text-align: center; line-height: 120px; color:rgba(0,0,0,.1);  background: transparent;  cursor:pointer;  }
.picScroll .next{ left: auto; right: 2%; }
.contral i{font-size: 90px;}
.picScroll .prev:hover,.picScroll .next:hover{background: rgba(0,0,0,.01); color: rgba(0,0,0,.3);}
.picScroll .picList{ overflow:hidden; zoom:1; }
.picScroll .picList li{float:left; width: 320px!important; padding: 20px; overflow:hidden; text-align:center;  position: relative; }
/*.picScroll .picList li .pic{ text-align:center; }
.picScroll .picList li .pic img{ width:120px; height:90px; display:block;  padding:2px; border:1px solid #ccc; }
.picScroll .picList li .pic a:hover img{ border-color:#999;  }*/
.picScroll .picList li .ptit{ padding: 15px 20px 0; line-height:150%; font-size: 20px; font-weight: lighter; }

.projectd-item .picList .pbox{width: 280px; height: 350px; overflow: hidden; border-radius: 30px 5px;}
.projectd-item .picList .pic{ width: 280px; height: 350px; margin: 0 30px 0 0;  border-radius: 30px 5px;}
.projectd-item .picList .j1 .pic{ background: url(../images/project/pj01.jpg) center center no-repeat; background-size: cover; }
.projectd-item .picList .j2 .pic{ background: url(../images/project/pj02.jpg) center center no-repeat; background-size: cover; }
.projectd-item .picList .j3 .pic{ background: url(../images/project/pj03.jpg) center center no-repeat; background-size: cover; }
.projectd-item .picList .j4 .pic{ background: url(../images/project/pj04.jpg) center center no-repeat; background-size: cover; }
.projectd-item .picList .j5 .pic{ background: url(../images/project/pj05.jpg) center center no-repeat; background-size: cover; }
.projectd-item .picList .j6 .pic{ background: url(../images/project/pj06.jpg) center center no-repeat; background-size: cover; }
.projectd-item .picList .j7 .pic{ background: url(../images/project/pj07.jpg) center center no-repeat; background-size: cover; }
.projectd-item .picList .j8 .pic{ background: url(../images/project/pj08.jpg) center center no-repeat; background-size: cover; }
.projectd-item  .pcon{display: none;position: absolute; left: 20px; top: 210px; width: 280px; height: 160px; padding: 15px 20px; background: rgba(0,0,0,.5); color: #fff; line-height: 150%; text-align: left;border-radius: 30px 5px;  font-weight: lighter;}
.projectd-item .picList li:hover {box-shadow: none;}
.projectd-item .picList li:hover .pbox{ box-shadow: 0 0 6px rgba(0,0,0,.4);  border-radius: 30px 5px; }
.projectd-item .picList li:hover .pcon { display: block; }

/*产品类项目*/
.products-item li{ display: block; float: left; width: 318px; padding: 20px 24px;  text-align: center;  }
.products-item li .pic{ width: 250px; height: 250px; margin: 0 auto;  border-radius: 30px 5px ;}
.products-item li.p1 .pic{ background: url(../images/product/pd01.jpg) center center no-repeat;}
.products-item li.p2 .pic{ background: url(../images/product/pd02.jpg) center center no-repeat;}
.products-item li.p3 .pic{ background: url(../images/product/pd03.jpg) center center no-repeat;}
.products-item li.p4 .pic{ background: url(../images/product/pd04.jpg) center center no-repeat;}
.products-item li.p5 .pic{ background: url(../images/product/pd05.jpg) center center no-repeat;}
.products-item .ptit{padding: 25px 20px 15px; font-size: 20px; font-weight: lighter;}

/*车险行销综合管理系统产品优势*/
.advantage-item li{ display: block; float: left; width: 50%; padding: 5px 25px; }
.advantage-item li>div{padding: 15px; position: relative; z-index: 1;}
.advantage-item li:hover>div{ background: #fff; z-index: 10; }
.advantage-item li .ico{ width: 200px; height: 120px; line-height: 120px; float: left; text-align: center; color: #fff; border-radius: 30px 5px; }
.advantage-item li .ico i{  font-size: 80px; }
.advantage-item li .a1 .ico{ background: #0098f9; }
.advantage-item li .a2 .ico{ background: #f17e1e; }
.advantage-item li .a3 .ico{ background: #1c9400; }
.advantage-item li .a4 .ico{ background: #002f53; }
.advantage-item li .a5 .ico{ background: #bf079a; }
.advantage-item .name{ margin: 20px 100px 0 230px;  font-size: 22px;  line-height: 200%; font-weight: lighter;}

/*合作优势*/
.collaborative{}
.collaborative .innerbox{ margin: 65px 10% 50px;min-width: 1350px; }
.collaborative .explain{ position: relative; padding: 35px 100px 35px 200px; border-radius: 30px 5px; background: #ffeeeb; font-size: 18px; font-weight: lighter; line-height: 180%; }
.collaborative .explain .ico{position: absolute;  top: 25px; left: 80px; height: 85px; width: 85px; line-height: 85px;}
.collaborative .explain i{font-size: 75px; color: rgba(255,116,0,.5);}

.collaborative-list{}
.collaborative-list li{display: block; padding: 30px 80px; position: relative; z-index: 10;}
.collaborative-list li:hover{position: relative; z-index: 11; background: #fff;}
.collaborative-list li+li{ border-top: 1px dashed rgba(0,0,0,.1)}
.collaborative-list li .pbox{float: left; width: 230px; height: 180px; padding: 10px; border-radius: 30px 5px;}
.collaborative-list li .pic{width: 210px; height: 160px;  border-radius: 30px 5px;}
.collaborative-list li.c1 .pic{ background: url(../images/collaborative/ca01.jpg) center center no-repeat;}
.collaborative-list li.c2 .pic{ background: url(../images/collaborative/ca02.jpg) center center no-repeat;}
.collaborative-list li.c3 .pic{ background: url(../images/collaborative/ca03.jpg) center center no-repeat;}

.collaborative-list .ccon{margin-left: 280px;}
.collaborative-list .ccon .ptit{font-size: 24px; line-height: 200%;}
.collaborative-list .c1 .ccon .ptit{ color: #ff7400; }
.collaborative-list .c2 .ccon .ptit{ color: #6600ff; }
.collaborative-list .c3 .ccon .ptit{ color: #339900; }
.collaborative-list .ccon .pcon{padding-top: 10px; font-size: 18px; line-height: 180%; color: #828282;}


/* 小屏幕（桌面显示器，大于等于 1366px） */
@media (max-width:1366px) {
	.wrapper{width: 1340px; margin: 0 auto; overflow: hidden;}

	.bannerbox { height: 420px; width: 1340px; margin: 0 auto; overflow: hidden;}
	.bannerbox .innerbox{width: 1340px; margin: 0 auto;overflow: hidden;}
	.banner-txt{width: 400px; position: absolute; top: 155px; left: 240px; margin: 0;}
	.banner-txt .company-name{display: none;}
	.banner-txt .slogan {padding: 0 ;}
	.banner-txt .slogan .cn{font-size: 56px; }
	.banner-txt .slogan .en{ padding-top: 5px; font-size: 22px;}

	/* 区块通用 */
	.block-tit{padding: 0 20px 0 60px;}
	.block-tit h3 { font-size: 38px; color: #000; }
	.block-tit .title { padding-right: 100px; }
	.block-tit h5 { font-size: 18px; }

	/*案例展示*/
	.casebox{ width: 1340px; margin: 0 auto;  overflow: hidden;}
	.casebox .innerbox{ margin: 55px auto 20px;min-width: auto; width: 100%; }
	.tabs-switch li{position: relative;display: block;float: left; padding: 0 25px; cursor: pointer;}
	.tabs-switch .cn{ font-size: 20px;}
	.tabs-switch .en{ font-size: 14px; }

	.tab-content>.tab-pane{min-height: auto;}
	.casebox .tab-content .projectd-item .innerbox {margin: 0 50px;}

	/*项目类*/
	.projectd-item{  padding-top: 5px;}
	.picScroll{ }
	.picScroll .prev,.picScroll .next{left: 0; top: 100px; width:50px; height:100px; text-align: center; line-height: 100px;   }
	.picScroll .next{ left: auto; right: 0; }
	.contral i{font-size: 50px;}
	.picScroll .prev:hover,.picScroll .next:hover{}
	.picScroll .picList{ height: 410px; }
	.picScroll .picList li{width: 248px!important; padding:30px 10px 10px; }
	.picScroll .picList li .pic{  }
	.picScroll .picList li .ptit{ padding: 15px 20px 0; line-height:135%; font-size: 18px; font-weight: lighter; }
	.projectd-item .picList .pbox{width: 230px; height: 300px; overflow: hidden;}
	.projectd-item .picList .pic{ width: 230px; height: 300px;   }
	.projectd-item  .pcon{display: none;position: absolute; left: 10px; top: 210px; width: 230px; height: 120px; padding: 15px 20px 10px;line-height: 135%; font-size: 14px; font-weight: lighter;}
	.projectd-item .picList li:hover {box-shadow: none;}
	.projectd-item .picList li:hover .pbox{ box-shadow: 0 0 6px rgba(0,0,0,.4);  border-radius: 30px 5px; }
	.projectd-item .picList li:hover .pcon { display: block; }

	/*产品类项目*/
	.casebox .tab-content .products-item .innerbox {padding:  0 50px; margin: 0;}
	.products-item li{ width: 20%; padding: 20px 10px 0;   }
	.products-item li .pic{ width: 220px; height: 240px;}
	.products-item .ptit{padding: 15px; font-size: 18px; }

	/*车险行销综合管理系统产品优势*/
	.casebox .tab-content .advantage-item .innerbox {padding:  0 50px; margin: 0;}
	.advantage-item li{ padding: 5px; }
	.advantage-item li>div{padding: 10px;}
	.advantage-item li .ico{ width: 200px; height: 120px; line-height: 120px; float: left; text-align: center; color: #fff; border-radius: 30px 5px; }
	.advantage-item .name{ margin: 20px 100px 0 220px;  font-size: 18px;  line-height: 180%; }

	/*合作优势*/
	.collaborative{width: 1340px; margin: 0 auto;  overflow: hidden;}
	.collaborative .innerbox{ margin: 30px auto; width: 100%; min-width: auto; overflow: hidden;}
	.collaborative .explain{ padding: 35px 100px 35px 150px; margin: 0 10px; font-size:16px; }
	.collaborative .explain .ico{ left: 50px;}
	.collaborative-list .ccon .ptit{font-size: 20px; }
	.collaborative-list .ccon .pcon{font-size: 16px; }

}

/* 小屏幕（桌面显示器，大于等于 768px） */
@media (max-width:768px) {
	.wrapper{width: 100%; margin: 0 auto; overflow: hidden;}

	.bannerbox { height: 400px; width: 100%; margin: 0 auto; overflow: hidden;}
	.bannerbox .innerbox{width: 100%;overflow: hidden;min-width: auto;}

	.bannerbox .mockup{display: none;}
	.banner-txt{width: 100%; top: 195px; left: 0; text-align: center;}
	.banner-txt .slogan .cn{font-size: 52px; font-weight: bold; }
	.banner-txt .slogan .en{ padding-top: 0px; font-size: 22px; color: rgba(255,255,255,.55);}

	/* 区块通用 */
	.block-tit {padding: 0;}
	.block-tit .title {float: inherit;  padding-right: 0; width: 100%; text-align: center; }
	.block-tit h3 { font-size: 42px;  }
	.block-tit h5 { font-size: 20px; }

	/*案例展示*/
	.casebox{ width: 100%; margin: 0 auto;  overflow: hidden;padding-bottom: 30px; border-bottom: 15px solid rgba(0,0,0,.03);}
	.casebox .innerbox{ margin: 40px auto 20px;min-width: auto; width: 100%; }
	.casebox .tabs-switch{float: inherit; text-align: center; }
	.tabs-switch li{ display: inline-block; float: inherit; padding: 0 15px; }
	.tabs-switch .cn{font-size: 20px; }
	.tabs-switch .en{  font-size: 12px; }
	.tabs-switch li.active:before{ left: 10px;bottom: 0px; height: 8px; right: 10px; border-radius: 3px 0 ; }
	.tab-content>.tab-pane{display:none;min-height: 470px;}
	.tab-content>.active{display:block}
	.casebox .tab-content .innerbox {margin: 0;}

	/*项目类*/
	.projectd-item{ position: relative;  padding-top: 5px;}
	.picScroll{ overflow:hidden; position:relative;   }
	.picScroll .prev,.picScroll .next{ display: none; }
	.casebox .tab-content .projectd-item .innerbox{margin: 0;}
	.casebox .tab-content .projectd-item .innerbox>div{height: auto!important; width: 100%!important;}
	.picScroll .picList{ overflow:hidden; zoom:1; height: auto!important;  width: 100%!important; padding: 0 25px!important;}
	.picScroll .picList li{float:inherit; width: 50%!important; padding: 20px 5%; overflow:hidden; text-align:center;  position: relative; }
	.picScroll .picList li .ptit{ padding: 15px 20px 0;  font-size: 18px; }
	.picScroll .picList li.j5 .ptit span{ display: none; }
	.projectd-item .picList .pbox{width: 100%; height: 300px; margin: 0 auto; }
	.projectd-item .picList .pic{ width: 260px; height: 300px; margin: 0 auto; }
	.projectd-item  .pcon{display: block;left: 50%; top: 210px; width: 260px; height: 110px; margin-left: -130px; padding: 15px 20px; font-size: 14px; text-align: left;color:rgba(255,255,255,.75); border-radius:5px 5px 30px; }
	.projectd-item .picList li:hover {box-shadow: none;}

	/*产品类项目*/
	.products-item {padding-top: 20px;}
	.casebox .tab-content .products-item .innerbox{padding: 0 30px;}
	.products-item li{ display: block; float: left; width: 50%; padding: 10px 24px;  text-align: center; position: relative; z-index: 1; background: #fff; }
	.products-item li:hover{z-index: 10;}
	.products-item .ptit{padding: 15px 10px 10px; font-size: }

	/*车险行销综合管理系统产品优势*/
	.advantage-item{padding-top: 30px;}
	.advantage-item li{  float: inherit; width: 100%; padding: 5px 15px; }
	.advantage-item li>div{padding: 5px; }
	.advantage-item .name{ margin: 10px 20px 0 220px;  font-size: 20px;  line-height: 180%; }

	/*合作优势*/
	.collaborative{ width: 100%; }
	.collaborative .innerbox{ width: 100%; margin: 25px 0 10px;min-width: auto; }
	.collaborative .explain{  padding: 25px 30px 25px 120px; font-size: 16px;  line-height: 150%; }
	.collaborative .explain .ico{top: 35px; left: 20px; }

	.collaborative-list li{padding: 30px; position: relative; z-index: 10;}
	.collaborative-list li .pbox{float: left; width: 210px; height: 160px; padding: 5px; border-radius: 30px 5px;}
	.collaborative-list li .pic{width: 200px; height: 150px;  border-radius: 30px 5px;}
	.collaborative-list .ccon{margin-left: 235px;}
	.collaborative-list .ccon .ptit{font-size: 20px; line-height: 150%;}
	.collaborative-list .ccon .pcon{padding-top: 0px; font-size: 16px; line-height: 150%;}

}

/* 小屏幕（桌面显示器，大于等于 560px） */
@media (max-width:560px) {

	/*banner*/
	.bannerbox { height: 300px; width: 100%; margin: 0 auto; overflow: hidden;}
	.banner-txt{ top:150px; }
	.banner-txt .slogan .cn{font-size: 36px;  font-weight: lighter; }
	.banner-txt .slogan .en{font-size: 18px;  }

	/* 区块通用 */
	.block-tit {padding: 0;}
	.block-tit h3 { font-size: 26px;  }
	.block-tit h5 { font-size: 14px; }

	/*案例展示*/
	.casebox .tabs-switch{padding-top: 15px; }
	.tabs-switch li{  padding: 0 3px; }
	.tabs-switch .cn{font-size: 16px; }
	.tabs-switch li.active:before{ left: 5px;bottom: 0px; height: 8px; right: 5px; border-radius: 3px 0 ; }

	/*项目类*/
	.projectd-item{ position: relative;  padding-top: 5px;}

	.picScroll .picList{  padding: 0 8%!important;}
	.picScroll .picList li{ padding: 10px 10px 0;  width: 100%!important;  }
	.picScroll .picList li .ptit{ padding: 10px 10px;  font-size: 16px; }
	.projectd-item .picList .pbox{width: 100%; height: 220px; margin: 0 auto; }
	.projectd-item .picList .pic{ width: 100%; height: 220px; margin: 0 auto; }

	.projectd-item .picList .j1 .pic{ background: url(../images/project/pj01.jpg) center -65px no-repeat; background-size: cover; }
	.projectd-item .picList .j2 .pic{ background: url(../images/project/pj02.jpg) center -65px no-repeat; background-size: cover; }
	.projectd-item .picList .j3 .pic{ background: url(../images/project/pj03.jpg) center -65px no-repeat; background-size: cover; }
	.projectd-item .picList .j4 .pic{ background: url(../images/project/pj04.jpg) center -65px no-repeat; background-size: cover; }
	.projectd-item .picList .j5 .pic{ background: url(../images/project/pj05.jpg) center -65px no-repeat; background-size: cover; }
	.projectd-item .picList .j6 .pic{ background: url(../images/project/pj06.jpg) center -65px no-repeat; background-size: cover; }
	.projectd-item .picList .j7 .pic{ background: url(../images/project/pj07.jpg) center -65px no-repeat; background-size: cover; }
	.projectd-item .picList .j8 .pic{ background: url(../images/project/pj08.jpg) center -65px no-repeat; background-size: cover; }

	.projectd-item  .pcon{top: 150px;  height: 80px; left: 10px; right: 10px; width: auto; margin-left: 0;  padding: 15px; font-size: 14px; border-radius:5px 5px 30px; }
	.projectd-item .picList li:hover {box-shadow: none;}

	/*产品类项目*/
	.products-item {padding-top: 20px;}
	.casebox .tab-content .products-item .innerbox{padding: 0 10px;}
	.products-item li{  padding: 10px; width: 100%;   }
	.products-item li .pic{margin: 0 auto; height: 250px; width: 250px; border-radius: 30px 5px;}


	/*车险行销综合管理系统产品优势*/
	.casebox .tab-content .advantage-item .innerbox{padding:  0 10px;}
	.advantage-item li{  float: inherit; width: 100%; padding: 5px 15px; }
	.advantage-item li>div{padding: 5px; }
	.advantage-item li .ico{  float: inherit; margin: 0 auto; width: 90%; }
	.advantage-item .name{ margin: 10px 10px 0;  font-size: 20px;  line-height: 150%;  text-align: center;}

	/*合作优势*/
	.collaborative .explain{  padding: 25px 15px 25px 80px; font-size: 14px;  line-height: 150%; }
	.collaborative .explain .ico{top: 10px; left: 20px; }
	.collaborative .explain .ico i{font-size: 50px;}

	.collaborative-list li{padding: 30px 45px; }
	.collaborative-list li .pbox{float: inherit; margin: 0 auto; width: 210px; height: 160px; padding: 5px; border-radius: 30px 5px;}
	.collaborative-list li .pic{width: 200px; height: 150px;  border-radius: 30px 5px;}
	.collaborative-list .ccon{margin-left: 0;}
	.collaborative-list .ccon .ptit{padding-top: 15px; font-size: 18px; line-height: 135%; text-align: center;}
	.collaborative-list .ccon .pcon{padding-top: 15px; font-size: 14px; line-height: 150%;}

}