.main {
	width:100%;
	height:100%
}
.main dt {
	font-size:24px;
	line-height:64px;
	color:#3a3a3a
}
.main dd {
	font-size:14px;
	line-height:24px;
	color:#6c6c6c
}
.main .desc-tit {
	color:#fffefe;
	line-height:48px;
	padding-bottom:3%;
	padding-left:5%
}
.main .desc-tit h6 {
	font-size:36px;
	font-weight:400
}
.main .desc-tit p {
	font-size:28px
}
.advantage {
	transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	z-index:999;
	position:relative
}
.advantage .pho {
	margin-left:-16%;
	vertical-align:bottom
}
.advantage .desc {
	margin-left:26%;
	margin-top:-40%;
	width:74%;
	vertical-align:bottom
}
.advantage .desc h3 {
	color: #e00012;
	font-size: 34px;
	line-height: 60px;
	margin-left: 2%;
	margin-bottom: 4%;
}
.advantage dl {
	float:left;
	border:1px solid #c1c1c1;
	width:48%;
	margin-left:2%;
	margin-bottom:4%
}
.advantage dl>div {
	padding:1% 5% 5% 5%
}
.effect {
	background:#e00012;
	padding-top:18%;
	padding-bottom:6.5%;
	position:relative;
	transform:translateY(-42%);
	-ms-transform:translateY(-42%);
	-o-transform:translateY(-42%);
	-webkit-transform:translateY(-42%);
	-moz-transform:translateY(-42%)
}
.effect:after,.effect:before {
	content:'';
	display:inline-block;
	background:url(../images/djzt/bg2.png) no-repeat;
	background-size:100% 100%;
	width:100%;
	height:387px;
	position:absolute;
	left:0
}
.effect:before {
	-moz-transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	transform:rotate(180deg);
	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
	top:-1px
}
.effect:after {
	bottom:-1px
}
.effect .pho {
	margin-left:52%;
	margin-top:-45%
}
.effect .desc {
	width:60%;
	margin-left:5%
}
.effect dl {
	padding-bottom:2%
}
.effect dt {
	color:#fefefe;
	line-height:48px
}
.effect dt:before {
	content:'';
	display:inline-block;
	width:26px;
	height:26px;
	margin-right:8px;
	background:url(../images/djzt/icon.png) no-repeat;
	background-size:100%;
	vertical-align:middle
}
.effect dd {
	color:#f6cbcd;
	padding-left:34px
}
.example {
	width:100%;
	height:100%;
	padding-bottom:3%;
	margin-top:-26%;
	position:relative
}
.example .swiper-container {
	width:828px
}
.example .swiper-wrapper {
	margin:71px auto
}
.example .swiper-slide {
	opacity:.5;
	filter:alpha(opacity=50);
	text-align:center
}
.example .swiper-slide-active {
	opacity:1;
	filter:alpha(opacity=100)
}
.example .swiper-button-prev {
	width:55px;
	height:20px;
	background:url(../images/djzt/arrows1.png) no-repeat;
	position:absolute;
	left:20%;
	top:50%
}
.example .swiper-button-prev:hover {
	background:url(../images/djzt/arrows2.png) no-repeat;
	transform:rotate(180deg);
	-moz-transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2)
}
.example .swiper-button-next {
	width:55px;
	height:20px;
	background:url(../images/djzt/arrows1.png) no-repeat;
	transform:rotate(180deg);
	-moz-transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
	right:20%;
	top:50%
}
.example .swiper-button-next:hover {
	background:url(../images/djzt/arrows2.png) no-repeat;
	transform:rotate(0);
	-moz-transform:rotate(0);
	-webkit-transform:rotate(0);
	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0)
}
.example .example-bg {
	background:url(../images/djzt/mobilebg.png) no-repeat;
	background-size:100% 100%;
	display:block;
	width:276px;
	height:559px;
	position:absolute;
	left:50%;
	top:0;
	transform:translate(-50%);
	-ms-transform:translate(-50%);
	-o-transform:translate(-50%);
	-webkit-transform:translate(-50%);
	-moz-transform:translate(-50%);
	z-index:999
}
.title {
	color:#fff;
	float:right;
	text-align:right
}
.title h6 {
	font-size:36px;
	line-height:48px;
	font-weight:400
}
.title .description {
	font-size:22px;
	line-height:36px
}
.case {
	width:100%;
	height:100%;
	position:relative;
	background:#e00012;
	padding-top:10%;
	padding-bottom:14%;
	transform:translateY(-14%);
	-ms-transform:translateY(-14%);
	-o-transform:translateY(-14%);
	-webkit-transform:translateY(-14%);
	-moz-transform:translateY(-14%)
}
.case:after,.case:before {
	content:'';
	display:inline-block;
	background:url(../images/djzt/bg2.png) no-repeat;
	background-size:100% 100%;
	width:100%;
	height:387px;
	position:absolute;
	left:0
}
.case:before {
	-moz-transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	transform:rotate(180deg);
	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
	top:-1px
}
.case:after {
	bottom:-1px
}
.case .title {
	width:32%
}
.team {
	width:100%;
	height:auto;
	padding-bottom:18px;
	position:relative;
	z-index:9999;
	margin-top:-23%
}
.team .title {
	color:#e00012;
	width:27%
}
@media (max-width:1750px) {
	.effect {
	padding-top:22%
}
.effect .desc {
	margin-left:10%
}
.effect dt {
	line-height:40px
}
.main .desc-tit {
	line-height:42px
}
.main .desc-tit h6 {
	font-size:32px
}
.main .desc-tit p {
	font-size:26px
}
.example {
	margin-top:-30%
}
.example .swiper-button-prev {
	left:15%
}
.example .swiper-button-next {
	right:15%
}
.case {
	padding-bottom:18%
}
.team {
	margin-top:-28%
}
}@media (max-width:1580px) {
	.advantage {
	transform:translateY(-48%);
	-ms-transform:translateY(-48%);
	-o-transform:translateY(-48%);
	-webkit-transform:translateY(-48%);
	-moz-transform:translateY(-48%)
}
}@media (max-width:1440px) {
	.team .title {
	width:24%
}
.title h6 {
	font-size:30px;
	line-height:40px
}
.title .description {
	font-size:20px;
	line-height:34px
}
.advantage .pho {
	margin-left:-10%
}
.advantage .desc {
	margin-left:32%;
	width:60%
}
.effect {
	padding-top:28%;
	padding-bottom:9.5%;
	transform:translateY(-36%);
	-ms-transform:translateY(-36%);
	-o-transform:translateY(-36%);
	-webkit-transform:translateY(-36%);
	-moz-transform:translateY(-36%)
}
.effect .desc {
	margin-left:12%
}
}@media (max-width:1366px) {
	.example .swiper-button-prev {
	left:10%
}
.example .swiper-button-next {
	right:10%
}
.case-list {
	padding-bottom:3%
}
.team {
	margin-top:-32%
}
.advantage {
	transform:translateY(-44%);
	-ms-transform:translateY(-44%);
	-o-transform:translateY(-44%);
	-webkit-transform:translateY(-44%);
	-moz-transform:translateY(-44%)
}
}@media (max-width:1240px) {
	.advantage {
	transform:translateY(-36%);
	-ms-transform:translateY(-36%);
	-o-transform:translateY(-36%);
	-webkit-transform:translateY(-36%);
	-moz-transform:translateY(-36%)
}
.effect {
	transform:translateY(-32%);
	-ms-transform:translateY(-32%);
	-o-transform:translateY(-32%);
	-webkit-transform:translateY(-32%);
	-moz-transform:translateY(-32%)
}
.case-list {
	padding-bottom:6%
}
.team {
	margin-top:-34%
}
.team .title {
	width:27%
}
.example .swiper-button-next,.example .swiper-button-prev {
	top:auto;
	bottom:0
}
.example .swiper-button-prev {
	left:35%
}
.example .swiper-button-next {
	right:35%
}
.case {
	transform:translateY(-12%);
	-ms-transform:translateY(-12%);
	-o-transform:translateY(-12%);
	-webkit-transform:translateY(-12%);
	-moz-transform:translateY(-12%)
}
}@media (max-width:1200px) {
	.case:after,.case:before,.effect:after,.effect:before {
	display:none
}
.advantage {
	padding-bottom:2%;
	z-index:1;
	transform:translateY(-36%);
	-ms-transform:translateY(-36%);
	-o-transform:translateY(-36%);
	-webkit-transform:translateY(-36%);
	-moz-transform:translateY(-36%)
}
.advantage .pho {
	width:35%;
	margin-left:0;
	float:left
}
.advantage .desc {
	width:65%;
	float:right;
	padding-top:10%;
	margin-top:0;
	margin-left:0
}
.effect {
	padding-top:5%;
	padding-bottom:0;
	transform:translateY(-34%);
	-ms-transform:translateY(-34%);
	-o-transform:translateY(-34%);
	-webkit-transform:translateY(-34%);
	-moz-transform:translateY(-34%)
}
.effect .pho {
	width:40%;
	margin-top:-38%;
	float:right
}
.effect .desc {
	float:left;
	margin-left:10%
}
.effect dt:before {
	background-size:80%;
	margin-right:4px
}
.example {
	margin-top:4%;
	transform:translateY(-26%);
	-ms-transform:translateY(-26%);
	-o-transform:translateY(-26%);
	-webkit-transform:translateY(-26%);
	-moz-transform:translateY(-26%)
}
.example .swiper-button-next,.example .swiper-button-prev {
	top:auto;
	bottom:0
}
.example .swiper-button-prev {
	left:30%
}
.example .swiper-button-next {
	right:30%
}
.case {
	padding-bottom:0;
	padding-top:4%;
	transform:translateY(-20%);
	-ms-transform:translateY(-20%);
	-o-transform:translateY(-20%);
	-webkit-transform:translateY(-20%);
	-moz-transform:translateY(-20%)
}
.case .title {
	width:100%
}
.team {
	margin-top:-14%;
	padding-bottom:7%
}
.team .title {
	width:100%
}
.title {
	float:none;
	text-align:center;
	padding-bottom:2%
}
.main dt {
	font-size:18px;
	line-height:48px
}
.main .desc-tit h6 {
	font-size:28px
}
.main .desc-tit p {
	font-size:24px
}
}@media (max-width:1000px) {
	.title h6 {
	font-size:26px
}
.title .description {
	font-size:18px
}
.case {
	padding-top:2%;
	transform:translateY(-6%);
	-ms-transform:translateY(-6%);
	-o-transform:translateY(-6%);
	-webkit-transform:translateY(-6%);
	-moz-transform:translateY(-6%)
}
.case-list {
	padding-bottom:4%
}
.main .desc-tit {
	padding-bottom:1%;
	line-height:38px;
	padding-left:1%
}
.main .desc-tit h6 {
	font-size:24px
}
.main .desc-tit p {
	font-size:20px
}
.effect {
	padding-top:3%
}
.example {
	margin-bottom:3%;
	transform:translateY(-8%);
	-ms-transform:translateY(-8%);
	-o-transform:translateY(-8%);
	-webkit-transform:translateY(-8%);
	-moz-transform:translateY(-8%)
}
.example .swiper-wrapper {
	margin:56px auto
}
.example .swiper-slide img {
	width:184px;
	height:328px;
	margin-left:-1%
}
.example .example-bg {
	width:220px;
	height:445px
}
.team {
	margin-top:-8%
}
}@media (max-width:900px) {
	.pho {
	display:none
}
.advantage .desc,.effect .desc {
	width:100%
}
.advantage {
	transform:translateY(-16%);
	-ms-transform:translateY(-16%);
	-o-transform:translateY(-16%);
	-webkit-transform:translateY(-16%);
	-moz-transform:translateY(-16%)
}
.effect {
	transform:translateY(-14%);
	-ms-transform:translateY(-14%);
	-o-transform:translateY(-14%);
	-webkit-transform:translateY(-14%);
	-moz-transform:translateY(-14%)
}
.example .swiper-container {
	width:769px
}
.example .swiper-slide img {
	margin-left:-22%
}
}@media (max-width:768px) {
	.example {
	transform:translateY(-8%);
	-ms-transform:translateY(-8%);
	-o-transform:translateY(-8%);
	-webkit-transform:translateY(-8%);
	-moz-transform:translateY(-8%)
}
.example .swiper-container {
	width:189px;
	min-width:auto;
	padding-bottom:4%
}
.example .swiper-slide img {
	margin-left:-20%
}
.title h6 {
	font-size:24px
}
.title .description {
	font-size:16px
}
.advantage {
	transform:translateY(-12%);
	-ms-transform:translateY(-12%);
	-o-transform:translateY(-12%);
	-webkit-transform:translateY(-12%);
	-moz-transform:translateY(-12%)
}
.advantage dl {
	margin-bottom:3%
}
.advantage dl>div {
	padding:5% 5% 5% 5%
}
.effect {
	transform:translateY(-12%);
	-ms-transform:translateY(-12%);
	-o-transform:translateY(-12%);
	-webkit-transform:translateY(-12%);
	-moz-transform:translateY(-12%);
	padding-top:3%
}
.effect .desc {
	margin-left:0
}
.effect dl {
	padding-bottom:3%
}
.effect dt:before {
	background-size:70%
}
.main .desc-tit {
	padding-bottom:0;
	line-height:40px
}
.main .desc-tit h6 {
	font-size:24px
}
.main .desc-tit p {
	font-size:18px
}
.main dt {
	font-size:16px;
	line-height:32px
}
}@media (max-width:480px) {
	.advantage {
	transform:translateY(-4%);
	-ms-transform:translateY(-4%);
	-o-transform:translateY(-4%);
	-webkit-transform:translateY(-4%);
	-moz-transform:translateY(-4%)
}
.advantage dl {
	width:100%;
	margin-left:0;
	margin-bottom:2%
}
.main .desc-tit {
	line-height:32px
}
.main .desc-tit h6 {
	font-size:20px
}
.main .desc-tit p {
	font-size:16px
}
.effect {
	transform:translateY(-2%);
	-ms-transform:translateY(-2%);
	-o-transform:translateY(-2%);
	-webkit-transform:translateY(-2%);
	-moz-transform:translateY(-2%)
}
.example {
	transform:translateY(0);
	-ms-transform:translateY(0);
	-o-transform:translateY(0);
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0)
}
.example .swiper-container {
	padding-bottom:6%
}
.case {
	transform:translateY(6%);
	-ms-transform:translateY(6%);
	-o-transform:translateY(6%);
	-webkit-transform:translateY(6%);
	-moz-transform:translateY(6%)
}
.team {
	margin-top:-8%
}
.title h6 {
	font-size:20px
}
.title .description {
	font-size:14px
}
}@media (max-width:375px) {
	.advantage {
	transform:translateY(-2%);
	-ms-transform:translateY(-2%);
	-o-transform:translateY(-2%);
	-webkit-transform:translateY(-2%);
	-moz-transform:translateY(-2%)
}
.effect {
	transform:translateY(0);
	-ms-transform:translateY(0);
	-o-transform:translateY(0);
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0)
}
.team {
	margin-top:-12%
}
.example {
	transform:translateY(2%);
	-ms-transform:translateY(2%);
	-o-transform:translateY(2%);
	-webkit-transform:translateY(2%);
	-moz-transform:translateY(2%)
}
.example .swiper-container {
	padding-bottom:8%
}
.case {
	transform:translateY(8%);
	-ms-transform:translateY(8%);
	-o-transform:translateY(8%);
	-webkit-transform:translateY(8%);
	-moz-transform:translateY(8%)
}
}
