﻿@font-face {
	font-family: 'index';
	src:url('../fonts/produce.eot?cv6lls');
	src:url('../fonts/produce.eot?#iefixcv6lls') format('embedded-opentype'),
		url('../fonts/produce.ttf?cv6lls') format('truetype'),
		url('../fonts/produce.woff?cv6lls') format('woff'),
		url('../fonts/produce.svg?cv6lls#index') format('svg');
	font-weight: normal;
	font-style: normal;
}

.page {height: 100%;position: relative;z-index: 1;}

.pro_banner{position: relative;height:500px;overflow: hidden;}
.pro_banner_txt{position: absolute;left:20%;top:26%; z-index:3;max-width: 1000px;width: 50%;color: #fff;}
.pro_banner_txt h2{font-size: 3em;padding-bottom: 20px;}
.pro_banner_txt p{line-height:2em;max-width:70%;font-size: 18px;}
.bannerBg{position: absolute;z-index: 2;}

.page dl.pro_box span{font-size:6em; background:#fff;color:#359bfb;}
.page dl.pro_box dt{padding:1em 0 0.5em;font-size: 1.4em;}
.page dl.pro_box dt::before{content: '·';display: inline-block;color: #359bfb; font-size:2em;vertical-align: sub;margin:0 5px 0 -15px;line-height: 30px;}
.page dl.pro_box dd{line-height:2em;color: #4c4c4c;}

.pro_main{max-width: 1200px;margin: 0 auto;padding:2em 20px 4em;text-align: center;}
.pro_main h3{padding:1em 0 1.5em;font-size: 2em;}

.pro_efficient .efficient dl {width:25%;float: left;}

.pro_online{background: #359bfb; color: #fff;}
.pro_online .online dl {text-align: left;width: 40%;float: left;margin-left: 10%;}
.pro_online .online dl dt::before{color: #fff;}
.pro_online .online dl dd{color: #fff;}
.pro_online .online .pro_online_img{width:40%;float: right;padding-top:2em;}
.pro_online .online .pro_online_img img{background: url(../images/ajax.gif) no-repeat center center;}

.pro_safe .safe .pro_list_top dl {width:25%;float: left;}
.pro_safe .pro_list{padding-top: 2em;margin-top: 2.5em;}
.pro_safe .pro_list h3{padding:2.5em 0 2em;border-top: 1px solid #dedede;}
.pro_safe .pro_list .pro_list_box{padding: 0 10% 4em;}
.pro_safe .pro_list .pro_list_box dl{text-align: left;width:48%;}
.pro_safe .pro_list .pro_list_box .pro_list_img{width:42%;}
.pro_safe .pro_list .pro_list_box .pro_list_img img{width: auto;max-width: 100%;}
.pro_safe .pro_list .pro_moveUp{margin-top: -4em;}
.pro_safe .pro_list .pro_moveUp dl{padding-top: 4em;}
.pro_safe .pro_list .pro_moveDown .pro_list_img{margin:10% 0;}
.pro_safe .pro_list .pro_custom dl{margin-top: -1.6em;}

.pro_feature{background: #359bfb; color: #fff;}
.pro_feature .feature_box{border-right:2px solid #fff;}
.pro_feature .feature{float: left;width:20%;text-align: center;border:2px solid #fff;border-right:0 ; height: 230px;margin-right: -2px;}
.pro_feature .feature span {font-size: 6em;color: #fff;margin:0.5em 0 0.1em;display: inline-block;}
.pro_feature .feature p{font-size: 1.4em;line-height: 2em;padding:0;}

/*对象存储系统*/
.object_box .feature{width: 25%;}

.object{margin-top: -2.2em;}
.object .pro_list{padding-top:0;  margin-top:0;}
.object dl.pro_box dd::before{content: '·';display: inline-block;color: #359bfb; font-size:2em;vertical-align: sub;margin:0 8px 0 -15px;line-height: 30px;}

/*云存储系统*/
.object.cloud dl.pro_box dd::before{display: none;}

/*桌面虚拟化*/
.desktop{margin-top: -2.2em;}
.desktop .pro_list{padding-top:0;  margin-top:0;}


@media screen and (max-width:30em){
	.pro_banner_txt{left: 10%;width:80%;}
	.pro_banner_txt p{max-width: 100%;}
	
	.page dl.pro_box dt{padding-bottom: 0.4em;}
	.page dl.pro_box dd{line-height:2em;font-size:1em;}
	
	.pro_efficient .efficient dl{width:48%;padding:1em 1%;}
	
	.pro_online .online .pro_online_img{float: none;width:100%;text-align: center;}
	.pro_online .online dl{float: none;width:95%;margin-left: 5%;}
	
	.pro_safe .safe .pro_list_top dl{width:48%;padding:1em 1%;}
	.pro_safe .pro_list .pro_moveDown .pro_list_img{margin:0 0 10%;}
	.pro_safe .pro_list .pro_list_box .pro_list_img,.pro_safe .pro_list .pro_list_box dl{float: none;width:100%;}
	
	.pro_feature .feature_box{border: 0;}
	.pro_feature .feature{position: relative; float: none;width:70%;margin: 0 auto;height: auto;padding-bottom: 2em;border-right: 2px solid #fff;border-bottom: 0;}
	.pro_feature .feature:last-child::after{content: '';position: absolute;left: 0;bottom:0; width: 100%;height: 2px; background: #fff;}
	.pro_feature .feature span{font-size: 4em;margin-top: 0.2em;}
	.pro_feature .feature dt{padding-bottom: 1em;}
	
}

@media screen and (max-width: 26em){
	.pro_feature{margin-bottom:100px;}
	.pro_safe .pro_list .pro_moveUp{margin: 0;}
}

