/* list */
#Pages{ max-width: 1200px;}
#list{ padding: 0 15px; box-sizing: border-box;}
#list li{ width: 100%; border-bottom: 1px solid #eee; font-size: 14px; padding: 10px 0; box-sizing: border-box; overflow: hidden;}
#list span{ font-weight: bold;}
#list label{ color: #666; font-size: 12px; }
/* page */
#pagelist{ margin-top: 20px; text-align: center;}
#pagelist .page_sub_btn{ border: none; cursor: pointer;}
#pagelist a,#pagelist .page_sub_btn{ background: #eee; display: inline-block; color: #333; font-size: 14px; line-height: 20px; padding: 5px 10px; box-sizing: border-box;}

/* menu */
#subMenu{ background: #fff;}
#subMenuItem{ max-width: 1200px; margin: 0 auto; text-align: left;}
#subMenuItem li{ display: inline-block; margin-right: 20px;}
#subMenuItem li:last-of-type{ margin-right: 0;}
#subMenuItem a{ display: inline-block; line-height: 60px; color: #333; position: relative; font-size: 16px;}
#subMenuItem .enarr_b{ display: none; width: 0px; height: 0px; position: absolute; bottom: -16px; border: 8px solid transparent; border-top-color: #fff; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%);}
/* banner */
.banner>div{ width: 100%; height: 160px; background-repeat: no-repeat; background-position: center top; background-size: auto 100%; color: #fff;}
.banner .design{ background-image:url(/images/ztview/bg_298.png);}
.banner .multisite{ background-image:url(/images/ztview/bg_200.png);}
.banner .domain{ background-image:url(/images/ztview/bg_201.png);}
.banner .vhost{ background-image:url(/images/ztview/bg_202.png);}
.banner>div div:first-of-type{ font-size: 48px; font-weight: bold; line-height: 2.2; text-shadow: 0px 5px 3px rgba(0,0,0,.2);}
.banner>div div:last-of-type{ font-size: 24px; line-height: 1;}
.banner>div{text-align: center;}
#mbar{ padding: 40px 8px 40px 5px;}
/* pages */
#border{ padding: 20px; box-sizing: border-box; margin-top: 40px; margin-bottom: 0px;background: #fff;}
#border.bzhuanti{ margin-top: 0;}
#border h3,#border h3 a{ color: #333; font-weight: normal;}
#border h3{ font-size: 18px; margin-bottom: 20px;}
#border h3 a{ font-size: 24px;}
#border>ul{ display: flex; justify-content: space-between; flex-wrap: wrap;}
#border .list{ width: calc(96%/3); margin-bottom: 20px;}
#border .list_more{ width: calc(96%/3);height: 0;}
#border .list_item a{ color: #666; display: block; border-bottom: 1px dashed #ccc; line-height: 1.8; background: url(/images/topdot.gif) no-repeat left center; padding: 5px 0 5px 20px; box-sizing: border-box;}
#border .list_item a:hover{ color: #c00;}

/* main */
.typeid{ display: none;}
#content{ max-width: 1200px; margin: 40px auto 0; overflow: hidden;}
#content>div{ box-sizing: border-box;}
.main{ width: calc(100% - 350px); float: left; padding: 30px; background: #fff; text-align: left;}
.main>div:first-of-type{ font-size: 24px; margin-bottom: 24px; font-weight: bold; text-align: center;}
.main>div>h1{font-size: 24px; margin-bottom: 24px; font-weight: bold; text-align: center;}
.main>div:nth-of-type(2){ font-size: 12px; color: #999; text-align: center;}
.main>div:nth-of-type(3){ margin-top: 6px; text-align: center;}
.main>div:nth-of-type(3) a{ width: 16px; height: 16px; margin: 0 2px; padding: 0; float: none; display: inline-block; background-image:url(/images/ztview/icons.png); background-repeat: no-repeat;}
.main>div:nth-of-type(3) a span{ display: none; color: #666;}
.main>div:nth-of-type(3) a:first-of-type{ background-position:0 0;}
.main>div:nth-of-type(3) a:nth-of-type(2){ background-position: 0 -1612px;}
.main>div:nth-of-type(3) a:nth-of-type(3){ background-position: 0 -2652px;}
.main>div:nth-of-type(3) a:nth-of-type(4){ background-position: 0 -52px;}
.main>div:nth-of-type(3) a:nth-of-type(5){ background-position: 0 -104px;}
.main>div:nth-of-type(3) a:nth-of-type(6){ background-position: 0 -260px;}
.main>div:nth-of-type(3) a:last-of-type{ background-position: 0 -728px;}
.main>div:nth-of-type(4){ margin: 40px 0; word-break: break-all;}
.main>div:nth-of-type(4) table{ width: 100%;}
.main>div:nth-of-type(4) img,.main>div:nth-of-type(4) embed{ max-width: 100%; height: auto;}
.main>div:nth-of-type(5){ overflow: hidden;}
.main>div:nth-of-type(5) span{ display: block; float: left; width: 50%; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.experience_div{background-color: #fff;margin-bottom: 20px;position: relative;}
.experience_div .experience_image{position: relative;}
.opacity_view {position: absolute;width: 100%;height: 100%;z-index: 2;top: 0;}
.experience_div .experience_title {position: absolute;top: 40px;z-index: 5;color: #ffffff;text-align: center;width: 100%;font-weight: bold;font-size: 28px;}
.experience_div .experience_btn{font-size: 16px;width: 200px; line-height: 30px;border:1px solid #fff; text-align: center;color: #fff;position: absolute;bottom: 10px;left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-o-transform: translateX(-50%);z-index: 5;}
.register_right_div{background-color: #fff;margin-bottom: 20px;position: relative;}
.register_right_div .register_image{position: relative;}
.register_bottom_div{position: relative;margin-bottom: 40px;}
.register_bottom_div .register_image{position: relative;width: 780px;top:0; left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-o-transform: translateX(-50%);z-index: 5;}
.side{ width: 330px; float: right;}
.side li{ background: #fff; font-size: 16px; padding: 15px; box-sizing: border-box;}
.side a{ display: block; overflow: hidden; position: relative;}
.side .xcx_icon{position: static;}
.side .design li{ text-align: left; margin-bottom: 20px;}
.side .design li:last-of-type{ margin-bottom: 0;}
.side .design a{ margin: 15px 0; padding-bottom: 67%;}
.side img{ position: absolute; left: 50%; top: 0; z-index: 2; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%);}
.side .title{  background: #c00; line-height: 1.5; padding: 5px; color: #fff; font-size: 16px; text-align: center; display: block; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;}
.side .design p{ color: #666; font-size: 14px; text-indent: 2em; line-height: 1.8;}
.side .btn{ background: #fff; padding: 10px 0 25px; box-sizing: border-box;}
.side .btn a{width: 244px; margin: 0 auto;}

.side .multisite,.side .domain,.side .vhost,.side .webapp,.side .everyday{ background: #fff; padding: 15px; box-sizing: border-box;}
.side .multisite .title{ margin-bottom: 15px;}
.side .multisite ul{ background: #f2f2f2; padding: 10px; box-sizing: border-box;}
.side .multisite li{ text-align: center; margin-bottom: 10px;}
.side .multisite li:last-of-type{ margin-bottom: 0;}
.side .multisite a{ margin-bottom: 10px; padding-bottom: 59px;}
.side .multisite li div{ color: #666; font-size: 14px; text-align: center; word-break: break-all;}
.side .multisite p{ font-size: 18px; color: #0066cc; margin-top: 15px;}

.side .domain li,.side .vhost li{ border: 1px solid #e5e5e5; margin-top: 15px;}
.side .domain li:hover{ cursor: pointer;}
.side .domain ul>div,.side .vhost ul>div{ border-bottom: 1px solid #e5e5e5; margin-top: 15px;}
.side .domain li>div:first-of-type{ font-size: 24px; line-height: 2;}
.side .domain li>div:nth-of-type(2){ margin-bottom: 15px; font-size: 14px; }
.side .domain li>div:nth-of-type(2) span{ color: #c00; font-size: 24px;}
.side .domain li>div:last-of-type{ background: #e5e5e5; padding: 10px 0;}

.side .vhost li>div:first-of-type,.side .webapp li>div:first-of-type,.side .everyday li>div:first-of-type{ font-size: 16px; font-weight: bold;}
.side .vhost li>div:nth-of-type(2),.side .webapp li>div:nth-of-type(2),.side .everyday li>div:nth-of-type(2){ width: 74px; height: 4px; margin: 20px auto; border: 1px solid transparent; border-top-color: #fcd9d9; border-bottom-color: #fcd9d9;}
.side .vhost li>div:nth-of-type(3),.side .webapp li>div:nth-of-type(3),.side .everyday li>div:nth-of-type(3){ font-size: 20px; margin-bottom: 20px;}
.side .vhost li>p{ color: #999; font-size: 12px; height: 80px; line-height: 1.5;}
.side .vhost .price_div{ font-size: 12px; color: #666;}
.side .vhost .price_div span{ color: #c00; font-weight: bold; font-size: 18px;}
.side .vhost a{ font-size: 14px; margin: 20px auto 0; border: 1px solid #c00; color: #c00; max-width: 244px; height: 40px; line-height: 40px;}

.side .webapp li,.side .everyday li{ border: 1px solid #f1f1f1; margin-top: 15px;}
.side .webapp li>div:nth-of-type(3),.side .everyday li>div:nth-of-type(3){ color: #666; font-size: 18px;}
.side .webapp li p{ font-size: 14px; color: #666; line-height: 1.6;}
.side .webapp .trait,.side .everyday .trait{ overflow: hidden; margin-top: 2px; margin-bottom: 30px;}
.side .webapp .trait div,.side .everyday .trait div{ background: #f2f2f2; width: 50%; float: left; font-size: 16px; line-height: 40px; margin-top: 2px; position: relative;}
.side .webapp .trait div:first-of-type:after,
.side .webapp .trait div:nth-of-type(3):after,
.side .webapp .trait div:nth-of-type(5):after{ content:''; height: 30px; width: 1px; position: absolute; right: 0; top: 5px; background: #fff; z-index: 2;}
.side .webapp .btn a,.side .everyday .btn a{ background: transparent; color: #c00; border: 1px solid #c00;}


.side .everyday .trait div{ width: 100%;}
.side .everyday li>div:nth-of-type(3){ margin-bottom: 0;}
.hide_bdimgshare{display: none!important;}

.hot_txt{ font-weight: bold;}

.website_view .top_box{
	height: 150px;
	text-align: left;
	padding: 20px;
	box-sizing: border-box;
	color: #fff;
	margin-bottom: 20px;
}
.website_view .top_box:first-child{
	background: url('/images/newpc/ztview/aimobile_bg.jpg') no-repeat;
}
.website_view .top_box:nth-child(2){
	background: url('/images/newpc/ztview/nicebox_bg.png') no-repeat,#643ed8;
}
.website_view .top_box a{
	display: block;
	position: relative;
	z-index: 1;
}
.website_view .top_box a:hover{
	color: #fff;
}
.website_view .top_box img{
	left: 0;
	top: 0;
	transform: unset;
}
.website_view .top_box p{
	margin-top: 29px;
	font-size: 14px;
	letter-spacing: 4.2px;
	color: #fff;
}
.website_view .top_box span{
	display: block;
	width: 110px;
	height: 30px;
	line-height: 28px;
	box-sizing: border-box;
	border: 1px solid #fff;
	color: #fff;
	text-align: center;
	margin-top: 30px;
}

.website_view ul li{
	border: 16px solid #fdad6b;
	background: #fff;
	margin-bottom: 20px;
}
.website_view li div{
	overflow: hidden;
}
.website_view li>a{
	display: block;
}
.website_view li>a:hover{
	color: inherit;
}
.website_view li .header .type{
	float: left;
	background: url('/images/newpc/ztview/star.png') no-repeat;
	font-size: 14px;
	padding-left: 18px;
	line-height: 18px;
}
.website_view .header .type span{
	color: #fdad6b;
}
.website_view .header .right_logo{
	float: right;
	position: relative;
	z-index: 1;
	font-size: 12px;
	color: #666;
	padding-top: 30px;
	width: 80px;
}
.website_view .text{
	margin: 30px 0;
}
.website_view .text p:first-of-type{
	font-weight: bold;
	font-size: 18px;
	line-height: 1;
}
.website_view .text p:last-of-type{
	font-size: 12px;
	margin-top: 12px;
}
.website_view .num div:first-of-type{
	float: left;
}
.website_view .num div:last-of-type{
	float: right;
}
.website_view .num div{
	width: 50%;
}
.website_view .num div p:first-of-type{
	color: #fdad6b;
	font-size: 28px;
	font-weight: bold;
	height: 28px;
}
.website_view .num div p:first-of-type span{
	font-size: 12px;
}
.website_view .num div p:first-of-type span.top{
	line-height: 1;
	font-size: 16px;
	vertical-align: top;
}
.website_view .num div p:last-of-type{
	font-size: 12px;
}
@media screen and (max-width:1200px){
	#list li>*{ vertical-align: middle;}
	#list li a{ display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: calc(100% - 220px);}
	#subMenuItem{ padding: 0 10px; box-sizing: border-box;}
	#subMenuItem a{ font-size: 14px;}
}
@media screen and (max-width:768px){
	#subMenubg{ display: none;}
	#content{ width: 96%; margin: 20px auto 0;}

	.banner>div div:first-of-type{ font-size: 35px; padding-top: 20px;}
	.banner>div div:last-of-type{ font-size: 20px;}

	#border .list{ width: 100%;}
	#border h3{ font-size: 14px;}
	#border h3 a{ font-size: 18px;}

	.main{ margin-bottom: 20px; padding: 20px 15px;}
	.main,.side{ width: 100%;}
	.main>div:nth-of-type(3) a{ display: none;}
	.main>div:nth-of-type(3) a:first-of-type{ display: inline-block; width: 70px;}
	.main>div:nth-of-type(3) a span{ display: inline;}
	.main>div:nth-of-type(5) span{ width: 100%; color: #666; float: none; line-height: 2;}
	.main>div:nth-of-type(5) span a{ color: #666;}

	.side ul{ display: flex; justify-content: space-between; flex-wrap: wrap;}
	.side li{ width: calc(97%/2);}
	.side .design li,.side .design a{ margin-bottom: 0;}
	.side .design li img{ width: 100%; }
	.side .design span,.side .design p{ display: none;}
	.side .design .title{ font-size: 14px;}
	.side .btn{ background: transparent; padding: 0; margin-top: 20px;}

	.side .multisite ul{ padding: 16px;}
	.side .multisite li{ margin-bottom: 16px;}
	.side .multisite li:nth-of-type(3){ margin-bottom: 0px;}
	.side .multisite p{ font-size: 16px;}

	.side .domain ul>div,.side .vhost ul>div{ width: 100%;}
	.side .domain ul>div.hide,.side .vhost ul>div.hide{ display: none;}

	.side .webapp li,.side .everyday li{ width: 100%;}
}
@media screen and (max-width:640px){
	.banner>div div:first-of-type{ padding-top: 20px; font-size: 35px;}
	.banner>div div:last-of-type{ font-size: 18px;}
	#subMenuItem{ padding: 10px;}
	#subMenuItem a{ font-size: 14px; line-height: 30px;}

	.side li{ padding: 10px;}
	.side .domain li>div:first-of-type{ font-size: 16px; margin: 5px 0;}
	.side .domain li>div:nth-of-type(2){ font-size: 12px; }
	.side .domain li>div:nth-of-type(2) span{ color: #c00; font-size: 20px;}
	.side .domain li>div:last-of-type{ font-size: 12px;}

	.side .multisite ul{ padding: 10px;}
	.side .multisite li{ margin-bottom: 10px;}

	.side .vhost li>div:nth-of-type(3){ font-size: 18px;}
	.side .vhost a{ max-width: 200px; height: 30px; line-height: 30px;}

	.side .webapp .trait div,.side .everyday .trait div{ font-size: 14px;}

	.website_view ul li{
		width: calc((100% - 10px)/2);
		border-width: 5px;
		padding: 5px;
		margin-bottom: 10px;
	}
	.website_view .top_box{
		margin-bottom: 10px;
	}
	.website_view li .header .type{
		font-size: 12px;
	}
	.website_view .header .right_logo{
		padding-top: 25px;
		width: 40px;
	}
	.website_view .header .right_logo img{
		height: 20px;
	}
	.website_view .header .right_logo p{
		height: 42px;
	}
	.website_view .text{
		margin: 20px 0;
		padding: 0 10px;
	}
	.website_view .text p:first-of-type{
		font-size: 14px;
		line-height: 1.5;
	}
	.website_view .num div p:first-of-type{
		font-size: 16px;
		height: 24px;
	}
}
@media screen and (max-width:480px){
	#list li a{ width: calc(100% - 100px);}
	#list li label{ display: block; width: 100%; text-align: right; padding-top: 5px;}
	#pagelist a, #pagelist .page_sub_btn{ font-size: 12px; margin-bottom: 5px;}
	.main>div:first-of-type{ font-size: 16px; margin-bottom: 10px;}

	.banner>div{ height: 100px;}
	.banner>div div:first-of-type{ font-size: 18px; padding-top: 20px;}
	.banner>div div:last-of-type{ font-size: 14px;}

	.side .multisite li div{ font-size: 12px;}

	.side .vhost li>p{ height: 100px;}
	.side .multisite p,.side .vhost li>div:first-of-type{ font-size: 14px;}
	.side .vhost li>div:nth-of-type(3){ font-size: 16px;}
}
@media screen and (max-width:320px){
	.side .multisite img{ width: 100%;}
	.side .vhost li>p{ height: 140px;}

	.side .webapp li>div:nth-of-type(3),.side .everyday li>div:nth-of-type(3){ font-size: 16px;}
	.side .webapp li p,.side .everyday li p{ font-size: 12px;}
	
}


/*手机端*/
@media screen and (max-width: 768px){

	.details_list .list_item{width: 100%;text-align: left;}
	.details_list{margin-top: 10px!important;}
	.details_list .zt{width: 100px;margin: 20px auto 0;font-size: 14px;}

	body>#Pages{padding-bottom: 10px !important;}
	#mbar{padding: 15px 10px 10px;}
	#border{padding: 10px;margin-top: 10px !important;}
	.experience_aview,.register_right_aview{display: none!important;}
	.main>div:nth-of-type(4),.register_bottom_div{margin-bottom: 20px;}
}