﻿@charset "utf-8";
/* CSS Document */
.artbanner {
	height: 200px;
	font-size: 52px;
	line-height: 200px;
	color: #fff;
}
.artbanner .container {
	padding: 0 60px;
	margin:0 auto;
}
.itbanner {
	background: url(../Images/itbg.jpg) center top no-repeat;
}
.savebanner {
	background: url(../Images/savebg.jpg) center top no-repeat;
}
.contbanner {
	background: url(../Images/contbg.jpg) center top no-repeat;
}
.webbanner {
	background: url(../Images/webbg.jpg) center top no-repeat;
}
.djbanner {
	background: url(../Images/djbg.jpg) center top no-repeat;
}
.databanner {
	background: url(../Images/databg.jpg) center top no-repeat;
}
.creditbanner {
	background: url(../Images/creditbg.jpg) center top no-repeat;
}
.article {
	margin-top: 30px;
	font-size: 16px;
	line-height: 30px;
	padding-top: 50px;
}
.article p {
	text-indent: 2em;
	padding-bottom:10px;
}
.article strong {
	display: inline-block;
	font-size: 30px;
	line-height: 50px;
	margin-bottom: 20px;
}
.article strong.blue {
	color: #14528f;
	border-bottom: 2px solid #14528f;
}
.article strong.yellow {
	color: #fc951e;
	border-bottom: 2px solid #fc951e;
}
.article strong.red {
	color: #e5424a;
	border-bottom: 2px solid #e5424a;
}
.article h4 {
	font-size:18px;
	font-weight: bold;
	margin: 10px 0 5px;
}
.article ul.ys {
	margin: 0 -10px;
}
.article ul.ys li {
	float: left;
	width: 50%;
	padding: 0 10px 20px;
	height: auto;
}
.article ul.ys li div {
	display: table;
	border: 1px solid #e9e9e9;
	background: #f7f7f7;
	width: 100%;
}
.article ul.ys li div span {
	display: table-cell;
	width: 120px;
	border-right: #e9e9e9;
	padding:60px 0;
}
.article ul.ys li div span img {
	height:50px;
}
.article .pic {
	width: 100%;
	margin-top: 10px;
}
.article .pic img {
	max-width: 100%;
	display: block;
	margin-bottom: 0;
}
.article ul.ys li div p {
	display: table-cell;
	vertical-align: middle;
	text-align: justify;
	text-indent: 0;
	padding: 0 20px;
	font-size: 16px;
	color: #333333;
	&::after {
            display: inline-block;
            width: 100%;
            content: '';
            height: 0;
        }
}
.article ul.caseul {
	margin: 0 -10px;
}
.article ul.caseul li {
	float: left;
	padding: 0 10px;
	width: 25%;
	color: #333;
	margin-bottom: 40px;
	height: auto;
}
.article ul.caseul li div {
	width: 100%;
	font-size: 16px;
}
.article ul.caseul li div img {
	width: 100%;
	margin-bottom: 5px;
}
.creditarticle ul.caseul {
}
.creditarticle ul.caseul li {
	float: left;
	padding: 0 10px;
	width: 34.65%;
	color: #333;
	margin-bottom: 40px;
}
.creditarticle ul.caseul li.last {
	float: left;
	width: 65.35%;
	text-align: left;
	padding-top: 45px;
}
.creditarticle ul.caseul li.last p {
	text-indent: 2em;
	font-size: 16px;
}

@media (max-width:1024px) {
.mt40 {
	margin-top: 20px;
}
.mt30 {
	margin-top: 15px;
}
.mt50 {
	margin-top: 25px;
}
.artbanner {
	height: 100px;
	line-height: 100px;
	font-size: 26px;
	background-size: cover;
}
.article {
	margin-top: 24px;
	font-size: 18px;
	line-height: 36px;
	padding-top: 25px;
}
.article strong {
	font-size: 24px;
}
.article ul.ys {
	margin: 0;
}
.article ul.ys li {
	width: 100%;
	padding: 0;
	margin-bottom: 20px;
}
.article ul.ys li div p {
	line-height: 36px;
	font-size: 18px;
}
.article ul.caseul li {
	width: 50%;
}
.creditarticle ul.caseul li, .creditarticle ul.caseul li.last {
	width: 100%;
	display: block;
}
.creditarticle ul.caseul li.last {
	padding-top: 0;
}
.creditarticle ul.caseul li.last p {
	font-size: 18px;
	line-height: 36px;
}
.article ul.caseul li div {
	font-size: 18px;
}
}

@media (max-width:767px) {
.article {
	font-size: 14px;
	line-height: 28px;
}
.article strong {
	font-size: 16px;
	line-height: 25px;
	margin-bottom: 10px;
}
.article h4 {
	font-size: 15px;
	margin-top: 10px;
}
.article ul.ys li div span {
	width: 80px;
}
.article ul.ys li p {
	line-height: 22px;
}
.article ul.caseul {
	margin: 0 -5px;
}
.article ul.caseul li {
	width: 50%;
	padding: 0 5px;
	margin-bottom: 20px;
}
.article ul.ys li div p {
	padding: 15px;
	font-size: 14px;
	line-height: 28px;
}
.article ul.caseul li div {
	font-size: 14px;
}
.creditarticle ul.caseul {
	margin: 0;
}
.creditarticle ul.caseul li, .creditarticle ul.caseul li.last {
	width: 100%;
	padding: 0;
}
.creditarticle ul.caseul li.last p {
	font-size: 14px;
	line-height: 28px;
}
.webarticle ul.caseul li, .itarticle ul.caseul li {
	height: 147px;
}
.itarticle ul.ys li.icon-1 div span, .itarticle ul.ys li.icon-2 div span, .itarticle ul.ys li.icon-3 div span, .itarticle ul.ys li.icon-4 div span, .itarticle ul.ys li.icon-5 div span, .itarticle ul.ys li.icon-6 div span, .itarticle ul.ys li.icon-7 div span, .savearticle ul.ys li.icon-1 div span, .savearticle ul.ys li.icon-2 div span, .savearticle ul.ys li.icon-3 div span, .savearticle ul.ys li.icon-4 div span, .savearticle ul.ys li.icon-5 div span, .savearticle ul.ys li.icon-6 div span, .contarticle ul.ys li.icon-1 div span, .contarticle ul.ys li.icon-2 div span, .contarticle ul.ys li.icon-3 div span, .contarticle ul.ys li.icon-4 div span, .contarticle ul.ys li.icon-5 div span, .contarticle ul.ys li.icon-6 div span, .contarticle ul.ys li.icon-7 div span, .contarticle ul.ys li.icon-8 div span, .contarticle ul.ys li.icon-9 div span, .webarticle ul.ys li.icon-1 div span, .webarticle ul.ys li.icon-2 div span, .webarticle ul.ys li.icon-3 div span, .webarticle ul.ys li.icon-4 div span, .webarticle ul.ys li.icon-5 div span, .webarticle ul.ys li.icon-6 div span, .webarticle ul.ys li.icon-7 div span, .webarticle ul.ys li.icon-8 div span, .djarticle ul.ys li.icon-1 div span, .djarticle ul.ys li.icon-2 div span, .djarticle ul.ys li.icon-3 div span, .djarticle ul.ys li.icon-4 div span, .djarticle ul.ys li.icon-5 div span, .djarticle ul.ys li.icon-6 div span, .dataarticle ul.ys li.icon-1 div span, .dataarticle ul.ys li.icon-2 div span, .dataarticle ul.ys li.icon-3 div span, .dataarticle ul.ys li.icon-4 div span, .dataarticle ul.ys li.icon-5 div span, .dataarticle ul.ys li.icon-6 div span, .dataarticle ul.ys li.icon-7 div span, .creditarticle ul.ys li.icon-1 div span, .creditarticle ul.ys li.icon-2 div span, .creditarticle ul.ys li.icon-3 div span, .creditarticle ul.ys li.icon-4 div span, .creditarticle ul.ys li.icon-5 div span, .creditarticle ul.ys li.icon-6 div span, .creditarticle ul.ys li.icon-7 div span, .creditarticle ul.ys li.icon-8 div span {
	background-size: 40%;
}
.webarticle ul.ys li.icon-1 div span {
	background-size: 28%;
}
}
