/* layout */
#wrap {}
#header { height: 89px; border-bottom: 1px solid #efefef;}
#banner { height: 550px; background: url(../img/banner-bg.jpg) no-repeat center top;}
#sbanner { border-top: 1px solid #efefef; }
#select { background-color: #104e7b; }
#info { }
#ad {background: url(../img/ad-bg1.jpg) no-repeat center top; background-size: cover; position: relative; z-index:1;}
#ad:before {content:''; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); position: absolute; left: 0;top: 0;}
#blog { }
#site { background-color: #f8f9fb;}
#footer { }

/* container */
.container {width: 1180px; height: inherit; /*background-color: rgba(0,0,0,0.3);*/ margin: 0 auto;}

/* header */
.header {overflow: hidden;}
.header h1 {float: left; padding-top: 20px; padding-right: 30px;}
.header a:hover {color: #1d7abd;}
.header .gnb {float: left;}
.header .gnb ul li {display: inline;}
.header .gnb ul li a {font-size: 18px; padding: 32px 12px; display: inline-block;}
.header .quick {float: right;}
.header .quick li {display: inline; position: relative;}
.header .quick li:before {content: ''; width: 1px; height: 10px; background-color: #ccc; position: absolute; right: 0; top: 1px;} 
.header .quick li:last-child:before {width: 0; height: 0;} 
.header .quick li a {font-size: 14px; padding: 34px 11px 34px 8px; display: inline-block; color: #676767;}

/* banner */
.banner { padding: 115px 50px; }
.banner h2 {font-size: 46px; line-height: 55px;}
.banner p {font-size: 18px; padding: 20px 0; color: #666; font-weight: 300;}
.banner em {font-size: 18px; color:#f66b50; display: block;}
.banner .view {font-size: 16px; display: inline-block; margin-top: 50px; border: 1px solid #333; background-color: #fff; padding: 12px 42px; transition: all 0.3s ease;}
.banner .view:hover {color:#fff; background-color: #333; }

/* sbanner */
.sbanner {overflow: hidden; padding: 70px 0;}
.sbanner > div { float:left; width: 25%; }
.sbanner > div h4 {font-size: 24px; font-weight: bold; padding-bottom: 4px; }
.sbanner > div h4 i {padding-left: 5px;}
.sbanner > div h4:hover { text-decoration: underline;}
.sbanner > div p {font-size: 16px; color: #676767;}

/* select */
.select {overflow: hidden; padding: 90px 0; color:#fff;}
.select h3 {float: left; width: 25%; font-size: 40px;}
.select>div {float: left; width: 17.5%; height: 300px; background-color: #146199; margin-left: 1.5%; padding: 3%;}
.select>div.simg1 {background: #146199 url(../img/select_img_1.png) no-repeat 30px 220px; background-size: 80px;}
.select>div.simg2 {background: #146199 url(../img/select_img_2.png) no-repeat 30px 220px; background-size: 90px;}
.select>div.simg3 {background: #146199 url(../img/select_img_3.png) no-repeat 30px 230px; background-size: 90px;}
.ie8 .select>div.simg1 {background: #146199 url(../img/select_img_1_ie8.png) no-repeat 30px 220px;}
.ie8 .select>div.simg2 {background: #146199 url(../img/select_img_2_ie8.png) no-repeat 30px 220px;}
.ie8 .select>div.simg3 {background: #146199 url(../img/select_img_3_ie8.png) no-repeat 30px 230px;}
.select>div h4 {font-size: 18px; padding-bottom: 20px;}
.select>div p {font-size: 15px; color: #fff;}


/* info */
.info {padding: 70px 0; text-align: center;}
.info h3 {font-size: 40px; padding-bottom: 20px; font-weight: 400;}
.info p {font-size: 18px; color:#666; padding-bottom: 50px;}
.info .info-box {overflow: hidden; text-align: left; padding: 0 210px;}
.info .info-box h4 {font-size: 16px; color: #333; padding-bottom: 5px;}
.info .info-box h4 i {color:#0081c8 ;}
.info .info-box .in-left {float: left; width: 50%; border-right: 1px solid #ccc; box-sizing:border-box;}
/* .info .info-box .in-left:before {content: ''; width: 1px; height: 105px; background-color: #ccc; position: absolute; right: 0; top: 0px;}*/
.info .info-box .in-left em {font-size: 24px; color: #333; width: 170px; display: inline-block;}
.info .info-box .in-left strong {font-size: 30px; color: #0081c8;}
.info .info-box .in-right {float: left; width: 50%; padding-left: 45px; box-sizing: border-box; }
.info .info-box .in-right li {font-size: 16px; color: #666; }

/* ad */
.ad {padding: 85px 0; text-align: center; color: #fff; z-index: 10; position: relative;}
.ad h3 {font-size: 40px; font-weight: 300;}
.ad p {font-size: 16px; padding: 30px 0 35px 0;}
.ad .view {font-size: 16px; color: #fff; display: inline-block; margin-top: 50px; border: 1px solid #fff; padding: 12px 23px; transition: all 0.3s ease;}
.ad .view:hover {color:#000; background-color: #fff;}

/* blog */
.blog {padding: 70px 0;}
.blog h3 {font-size: 34px; padding-bottom: 50px;}

.blog .blog-wrap {overflow: hidden; height: 410px; margin-bottom: 80px;}
.blog .blog-wrap >div {float:left; width: 23.5%; margin-right: 2%; border-top: 2px solid #6f6f6f;}
/* .blog .blog-wrap > div:last-child {margin-right: 0;} */
.blog .blog-wrap >div.last {margin-right: 0;}
.blog .blog-wrap >div h4 {font-size: 22px; padding: 20px 0 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.blog .blog-wrap >div p {font-size: 16px; color: #7e7e7e; margin-bottom: 40px; height: 93px; 
			overflow: hidden; 
			text-overflow: ellipsis; 
			display: -webkit-box;
            -webkit-line-clamp: 4; 
            -webkit-box-orient: vertical; }  
.blog .blog-wrap >div figure {}
.blog .blog-wrap >div figure img {width: 100%; }

.blog .notice-wrap {overflow: hidden; height: 275px;}
.blog .notice-wrap .nw-left {float: left; width: 780px;  }
.blog .notice-wrap .nw-left h3 {font-size: 34px; padding-bottom: 20px; margin-right: 20px;display: inline-block;}
.blog .notice-wrap .nw-left .total {font-size: 14px; color: #666; padding-left: 10px;}
.blog .notice-wrap .nw-left ul {font-size: 16px; border-top: 2px solid #6f6f6f; }
.blog .notice-wrap .nw-left ul li {overflow: hidden; ;border-bottom: 1px solid #e5e5e5; padding: 20px 10px;}
.blog .notice-wrap .nw-left ul li a {float: left; width: 80%; color: #666; font-size: 14px;}
.blog .notice-wrap .nw-left ul li span {float: right; width: 20%; text-align: right; font-size: 14px; color: #999;}
.blog .notice-wrap .nw-right {float: right; width: 380px;}
.blog .notice-wrap .nw-right h3 {font-size: 34px; padding-bottom: 20px}
.blog .notice-wrap .nw-right ul {color: #676767; padding: 20px;border-top: 2px solid #6f6f6f; border-bottom: 1px solid #e5e5e5; height: 145px;}
.blog .notice-wrap .nw-right ul li {padding: 12px 0; font-size: 16px;color: #666;}
.blog .notice-wrap .nw-right ul li span {color:#fff; background-color: #666; padding: 5px 10px; margin-right: 20px;}

/* site */
.site {overflow: hidden; padding: 70px 0; }
.site >div {float: left; width: 16.666%}
.site >div h4 {font-size: 16px; font-weight: bold; padding-bottom: 15px;}
.site >div ul {font-size: 16px; color: #7e7e7e}
.site >div ul li {padding: 3px 0;}
.site >div ul li a {}
.site >div ul li a:hover {text-decoration: underline;}
.site .cloud {float: left; width: 33.3333%; overflow: hidden;}
.site .cloud ul 	{overflow: hidden;}
.site .cloud ul li {float: left; width: 50%;padding: 3px 0;}

/* footer */
.footer {padding: 50px 0; position: relative;}
.footer .policy {font-size: 16px; padding-bottom: 30px;}
.footer .policy li {display: inline-block; padding: 0 20px 0 10px; position: relative;}
.footer .policy li:before {content:"";width: 1px; height: 16px; background-color: #ccc; position: absolute; right: 0;top: 3px;}
.footer .policy li a {}
.footer .policy li:first-child {padding-left: 0;}
/* .footer .policy li:last-child:before {width: 0;height: 0;} */
.footer .policy li.last:before {width: 0;height: 0;}
/* .footer .policy li:last-child a {color: #1d7abd; } */
.footer .policy li.last a {color: #1d7abd; }

.footer .address {color: #666; font-size: 14px;}
.footer .address li {padding-bottom: 5px;}
.footer .address span {padding-right: 20px;}
.footer .address p {padding: 20px 0;}

.footer .icon {overflow: hidden;}
.footer .icon li {float: left; padding-right: 20px;}
/* .footer .icon li:last-child {padding-top: 5px;} */
.footer .icon li.last {padding-top: 5px;}

.footer .family {position: absolute; right: 0;top: 50px; }
.footer .family select {background-color: #fff; font-size: 14px; width: 145px; height: 44px; padding-left: 5px;margin-right: 5px;}
.footer .family button {padding: 10px 15px 11px; border: 1px solid #cfd5da; font-size: 14px; color: #707070;}
.ie8 .footer .family button {vertical-align: 15px;}
.footer .w3c {position: absolute;right: 0;top: 110px; text-align: right;}



/* ---------------- sub page ------------------- */

/* layout */
#sub-banner { background: url(../img/server-bg1.png); repeat-x center top;}
#sub-banner.mail-bg { background: url(../img/mail-bg1.png); repeat-x center top;}
#sub-banner.service-bg {  background: url(../img/service-bg1.png); repeat-x center top;  }
#sub-banner.hosting-bg {  background: url(../img/hosting-bg1.png); repeat-x center top;  }
#product-table {}
#idc-ad {background: #1d7abd;}
#idc-info {}
#idc-cont1 { background: url(../img/hosting-bg2.png) no-repeat center top; background-size: cover; position: relative; z-index:1; }
#idc-cont2 {border-bottom: 1px  solid #f2f2f2;}
#idc-cont3 {}
#idc-cont4 {background: #1d7abd;}



/* sub-banner */
.sub-banner {overflow: hidden; padding: 80px 0; }
.sub-banner .sb-left {float: left; width: 760px;}
.sub-banner .sb-left h2 {font-size: 40px; color: #fff; }
.sub-banner .sb-left p {font-size: 18px; color: #fff;}
.sub-banner .sb-right {float: right; width: 410px; padding-top: 15px; }
.sub-banner .sb-right ul {}
.sub-banner .sb-right ul li {display: inline; margin-left: 10px;  }
.sub-banner .sb-right ul li.icon1 a {background: url(../img/server-sb-icon1.png) no-repeat 20px 13px; }
.sub-banner .sb-right ul li.icon2 a {background: url(../img/server-sb-icon2.png) no-repeat 20px 13px; }
.sub-banner .sb-right ul li.icon3 a {background: url(../img/server-sb-icon3.png) no-repeat 20px 13px; }
.sub-banner .sb-right ul li a {display: inline-block; font-size: 18px; color: #b2ddf9; border: 2px solid #b2ddf9; border-radius: 50px; width: 65px; height: 50px;
	padding-left: 55px; line-height: 50px; }
.sub-banner .sb-right ul li a:hover { color: #fff; border-color: #fff; }

/* product-table */
.product-table {padding: 80px 0;}
.product-table .table-title1{}
.product-table .table-style1 {}

/* table-title1 */
.table-title1{ position: relative; padding-bottom: 20px; }
.table-title1 ul li { display: inline;}
.table-title1 ul li a { font-size: 18px; color: #999; padding: 0 25px; }
.table-title1 ul li.active a { color: #333; }
.table-title1 .detail { position: absolute; right: 0; top: 0; font-size: 18px; color:#1d7abd; }

/* table-style1 */
.table-style1 {}
.table-style1 table {border-top: 2px solid #6f6f6f; border-bottom: 1px solid #9a9a9a;}
.table-style1 table thead {}
.table-style1 table thead tr {}
.table-style1 table thead tr th {font-size: 16px; padding: 20px 0;  border-right: 1px solid #e4e4e4; background: #f9fafc;}
.table-style1 table tbody {}
.table-style1 table tbody tr {}
.table-style1 table tbody tr td {padding: 35px 25px; vertical-align: middle;  border-top: 1px solid #e4e4e4;}
.table-style1 table tbody tr td.td1 {text-align: left;  border-right: 1px solid #e4e4e4;}
.table-style1 table tbody tr td.td1 p span { display: inline-block; font-size: 16px;color: #fff; background: #ff9900; padding: 0 4px; margin-left: 5px; }
.table-style1 table tbody tr td.td1 p img { vertical-align: middle; }
.table-style1 table tbody tr td.td1 p.product-name {font-size: 28px; font-weight: 500; margin-top: 15px; line-height: 30px;}

.table-style1 table tbody tr td.td2 {font-size: 16px; text-align: left; border-right: 1px solid #e4e4e4; color: #666;}
.table-style1 table tbody tr td.td2 ul li span{color:#000;}
.table-style1 table tbody tr td.td3 {font-size: 16px; text-align: center;  border-right: 1px solid #e4e4e4;}
.table-style1 table tbody tr td.td4 {font-size: 16px; text-align: center;  border-right: 1px solid #e4e4e4;}
.table-style1 table tbody tr td.td5 {text-align: center;  border-right: 1px solid #e4e4e4;}
.table-style1 table tbody tr td.td5:last-child { border-right: 0; }
.table-style1 table tbody tr td.td5 em {font-size: 22px;font-weight: 300;}
.table-style1 table tbody tr td.td5 span {font-size: 16px; display: inline-block; color: #fff; background: #34a0ef; padding: 10px 30px;}
.table-style1 .more {text-align: center; margin-top: 30px;}
.table-style1 .more a {font-size: 16px; }

/* table-info */
.table-info {padding-top: 40px;}
.table-info ul li {font-size: 16px; padding: 3px 0;  }
.table-info ul li a {font-size: 18px;}

/* idc-ad */
.idc-ad {overflow: hidden;padding: 50px 0;}
.idc-ad h3 {font-size: 40px; color: #fff; float: left; width:35%;}
.idc-ad >div {float: left; width: 25%; height: 350px; background: #2886ca; margin:0 10px;  padding: 200px 30px 50px;}
.idc-ad >div h4 a {font-size: 16px; color: #fff; }
.idc-ad >div p {font-size: 16px; color: #d2f0ff;  }
.idc-ad >div.ia-box1 {background:  #2886ca url(../img/idc-ad-ic1.png) no-repeat 30px 30px; 
	background-size: width: 100px; height: 100px;	 }
.idc-ad >div.ia-box2  {background:  #2886ca url(../img/idc-ad-ic2.png) no-repeat 30px 30px; 
	background-size: width: 100px; height: 100px;	 }


/* "idc-info */
.idc-info {padding: 70px 0; overflow: hidden; }
.idc-info h3 {font-size: 40px; text-align: center; }
.idc-info p {text-align: center; padding: 40px 0; }
.idc-info p a{font-size: 16px; display: inline-block;  padding: 12px 42px ; border: 1px solid #333;}
.idc-info p a:hover {background-color: #333; color: #fff; transition: all 0.3s ease;}

.idc-info .ii-left {float: left; width: 35%; height: 111px; margin-left: 13%; position: relative;}
.idc-info .ii-left .ii-left-circle {width: 111px;height: 111px; background-color: #1d7abd; border-radius: 50%; 
	display: inline-block;}
.idc-info .ii-left .ii-left-circle h4 {text-align: center; font-size: 16px; color: #fff; position: absolute; top: 30px; left: 25px;}
.idc-info .ii-left ul {display: inline-block; position: absolute;top: 8px;left: 120px;}
.idc-info .ii-left ul li {padding: 10px 0;}
.idc-info .ii-left ul li em {width: 150px; font-size: 16px; display: inline-block; }
.idc-info .ii-left ul li span {font-size: 18px; color: #1d7abd; }

.idc-info .ii-right {float: left; width: 35%; margin-left: 2%; height: 111px; position: relative;}
.idc-info .ii-right .ii-right-circle {width: 111px;height: 111px; background-color: #1d7abd; border-radius: 50%; 
	display: inline-block;}
.idc-info .ii-right .ii-right-circle h4 {text-align: center; font-size: 16px; color: #fff; position: absolute; top: 20px; left: 23px;}
.idc-info .ii-right ul {display: inline-block; position: absolute;top: 8px;left: 120px;}
.idc-info .ii-right ul li {padding: 10px 0;}
.idc-info .ii-right ul li em {width: 85px; font-size: 16px; display: inline-block; }
.idc-info .ii-right ul li span {font-size: 18px; color: #1d7abd; }

/* idc-cont1 */
.idc-cont1 {padding: 70px 0;}
.idc-cont1 h3 {font-size: 40px; color: #fff; text-align: center;}
.idc-cont1 p {font-size: 16px; color: #fff; text-align: center; margin: 20px 0 70px;}
.idc-cont1 img {text-align: center; margin-left: 350px;}

/* idc-cont2 */
.idc-cont2 {padding: 70px 0; overflow: hidden; text-align: center;}
.idc-cont2 h3 {font-size: 40px; }
.idc-cont2 >div {float: left; width: 33.333%; padding: 190px 0 0;}
.idc-cont2 >div h4 {font-size: 18px; margin-bottom: 6px;}
.idc-cont2 >div p {font-size: 16px; color: #666;}
.idc-cont2 >div.ic2-box1 {background: url(../img/idc-cont2-ic1.png) no-repeat 168px 100px;}
.idc-cont2 >div.ic2-box2 {background: url(../img/idc-cont2-ic2.png) no-repeat 165px 100px;}
.idc-cont2 >div.ic2-box3 {background: url(../img/idc-cont2-ic3.png) no-repeat 162px 100px;}

/* idc-cont3 */
.idc-cont3 {padding: 70px 0; overflow: hidden; text-align: center;}
.idc-cont3 h3 {font-size: 40px; }
.idc-cont3 >div {float: left; width: 33.333%; padding: 190px 0 0;}
.idc-cont3 >div h4 {font-size: 18px; margin-bottom: 6px;}
.idc-cont3 >div p {font-size: 16px; color: #666;}
.idc-cont3 >div p a {font-size: 16px; color: #666;}
.idc-cont3 >div.ic3-box1 {background: url(../img/idc-cont3-ic1.png) no-repeat 168px 100px;}
.idc-cont3 >div.ic3-box2 {background: url(../img/idc-cont3-ic2.png) no-repeat 165px 100px;}
.idc-cont3 >div.ic3-box3 {background: url(../img/idc-cont3-ic3.png) no-repeat 162px 100px;}

/* idc-cont4  */
.idc-cont4  {padding: 70px 0; overflow: hidden;}
.idc-cont4 h3 {display: inline-block; font-size: 40px; color: #fff; float: left; width: 30%;}
.idc-cont4 >div {float: left; width: 30%;}

/* table-style2 */
.table-style2 {}


/* table-style3 */
.table-style3 {}





