@charset "utf-8";
/*!
*	index.css v0.0.2
*	Date 2018/06/25
*	Copyright 2018 Annun!
*/
@import url("styles/base.css");
@import url("styles/conmon.css");

/* public style */
/* 章节标题 */
.title {
	height: 42px;
	width: 100%;
	background: url(../images/index/chapter-title-bg.png) no-repeat center;
	margin-bottom: 40px;
}
.title h4 {
	height: 22px;
	width: 100%;
	color: #333333;
	font-weight: bold;
	font-size: 20px;
	text-align: center;
	line-height: 22px;
}
.title p {
	height: 20px;
	width: 100%;
	color: #cccccc;
	font-size: 14px;
	text-align: center;
	line-height: 20px;
	text-transform:uppercase;
}


/* public style end */


/* banner
.banner-box {
    height: 500px;
    width: 100%;
    min-width: 1200px;
	overflow: hidden;
	margin-bottom: 100px;
}
.banner {
    height: 500px;
    width: 1200px;
    margin: 0 auto;
    position: relative;
}
.banner img {
    height: 500px;
    width: 1920px;
	position: absolute;
	top: 0;
	left: -360px;
}
 */



 #bannerBox{
	width: 100%; min-width: 1200px; height: 500px;overflow: hidden; position: relative; 
	margin-bottom: 40px;
}
#container { width: 1920px; height: 500px;overflow: hidden; position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
#list {height: 500px; position: absolute; z-index: 1;}
#list img { float: left;}
#buttons { position: absolute; height: 20px; z-index: 2; bottom: 20px; left: 50%; transform: translateX(-50%);}
#buttons span { cursor: pointer; float: left; border: 2px solid #fff; width: 16px; height: 16px; border-radius: 50%; background: #ffffff; margin: 0 5px;}
#buttons .on {  background: orangered;}
.arrow { cursor: pointer; display: none; line-height: 80px; text-align: center; font-size: 36px; width: 40px; height: 80px;  position: absolute; z-index: 2; top: 210px; background-color: RGBA(0,0,0,.3); color: #fff; border-radius: 4px;}
.arrow:hover { background-color: RGBA(0,0,0,.7);}
#bannerBox:hover .arrow { display: block;}
#prev { left: 20px;}
#next { right: 20px;}















/* banner end */

.products{
	height: auto;
	width: 1200px;
	margin: 0 auto;
	margin-bottom: 60px;
}
.product-list {
	height: 280px;
	width: 1200px;
}
.product-list > li {
	float: left;
	height: 280px;
	width: 595px;
	box-shadow: 0 0 4px rgba(0,0,0,0.2);
	position: relative;
	background-color: #fff;
}
.product-list > li+li {
	margin-left: 10px;
}

.product-main-img {
	float: left;
	margin: 12px;
	height: 256px;
	width: 286px;
	overflow: hidden;
}
.product-main-img > img {
	height: 256px;
	width: 286px;
}
.product-main-content {
	float: left;
	height: 256px;
	width: 260px;
	margin: 12px;
}
.product-main-title {
	padding-top: 24px;
	margin-bottom: 30px;
}
.product-main-title > h2 {
	font-size: 22px;
	color: #ff6900;
	font-weight: bold;
	line-height: 30px;
}
.product-main-title > p {
	line-height: 22px;
	font-size: 14px;
	color: #c2c2c2;
}


.product-main-detail {
	height: auto;
	width: 260px;
	margin-bottom: 40px;
	overflow: hidden;
}
.product-main-detail > ul {
	height: auto;
	width: 260px;
}
.product-main-detail > ul > li {
	float: left;
	width: auto;
	font-size: 12px;
	line-height: 22px;
	color: #666666;
	margin-right: 10px;
}
.product-submit {
	display: block;
	height: 26px;
	width: 88px;
	border: 1px solid #ff6900;
	text-align: center;
	line-height: 26px;
	font-size: 14px;
	color: #ff6900;
}
.product-submit:hover {
	background-color: #ff6900;
	color: #ffffff;
}
.product-disabled {
	display: block;
	height: 26px;
	width: 88px;
	border: 1px solid #999999;
	background-color: #999999;
	text-align: center;
	line-height: 26px;
	font-size: 14px;
	color: #FFFFFF;
}
.sale {
	height: 56px;
	width: 56px;
	position: absolute;
	right: 0;
	top: 0;
}

.advantages {
	height: auto;
	width: 1200px;
	margin: 0 auto;
	margin-bottom: 60px;
}
.advantage-list {
	height: 360px;
	width: 1200px;
}
.advantage-list ul {
	height: 360px;
	width: 1200px;
}
.advantage-list ul li {
	float: left;
	height: 358px;
	width: 332px;
	border: 1px solid #e3e3e3;
	box-shadow: 0 0 4px rgba(0,0,0,0.2);
}
.advantage-list ul li+li {
	margin-left: 92px;
}
.al-content {
	height: 358px;
	width: 332px;
	overflow: hidden;
	position: relative;
}
.shadow-clear {
	border: 1px solid #ffffff !important;
	box-shadow: 0 0 4px rgba(228,66,50,0.8) !important;
}
.shadow-clear .advantage-content h4,
.shadow-clear .advantage-content p {
	display: none;
}

.advantage-content {
	height: 358px;
	width: 332px;
	overflow: hidden;
	background-color: #fff;
}
.advantage-content > span {
	display: block;
	height: 100px;
	width: 100px;
	margin: 50px 116px;
	background-image: url(../images/index/chapter2-content-bg.png);
	background-repeat: no-repeat;
}
.ac-icon1 {
	background-position: -10px -10px;
}
.ac-icon2 {
	background-position: -120px -10px
}
.ac-icon3 {
	background-position: -230px -10px
}
.advantage-content h4 {
	display: block;
	height: 40px;
	width: 90px;
	padding: 0 2px;
	line-height: 40px;
	font-size: 22px;
	border-bottom: 2px solid #333333;
	color: #333333;
	margin: 0 auto;
	margin-bottom: 50px;
}
.advantage-content p {
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	height: 22px;
	width: 282px;
	line-height: 22px;
	font-size: 22px;
	color: #999999;
	margin: 30px 25px;
	font-size: 14px;
	text-align: center;
}


.advantage-mask {
	height: 358px;
	width: 332px;
	background-color: rgba(225,105,0,0.8);
	position: absolute;
	top: 358px;
	left: 0;
}
.advantage-mask h4 {
	display: block;
	height: 40px;
	width: 90px;
	padding: 0 2px;
	padding-top: 116px;
	line-height: 40px;
	font-size: 22px;
	border-bottom: 2px solid #ffffff;
	color: #FFFFFF;
	margin: 0 auto;
	margin-bottom: 50px;
}
.advantage-mask p {
	display: block;
	overflow: hidden;
	height: 130px;
	width: 272px;
	line-height: 26px;
	font-size: 22px;
	color: #FFFFFF;
	margin: 30px;
	font-size: 14px;
	text-align: justify;
}

.server-map {
	height: auto;
	width: 1200px;
	margin: 0 auto;
}
.server-content {
	height: 440px;
	width: 1200px;
}
.server-content img {
	height: 440px;
	width: 1200px;
}

.partners {
	padding: 50px 0 120px 0;
	height: auto;
	width: 100%;
	min-width: 1200px;
	background-color: #ffffff;
}
.partner-list {
	margin: 0 auto;
	height: 414px;
	width: 1200px;
	overflow: hidden;
}
.partner-list ul {
	height: 414px;
	width: 1210px;
	margin-left: -5px
}
.partner-list ul li {
	float: left;
	height: 128px;
	width: 230px;
	border: 1px solid #dedede;
	margin: 0 5px 10px 5px;
	overflow: hidden;
}




