html {
  position: relative;
  min-height: 100%;
}



.buy-main-son {
  margin: 0 auto;
  width: 1280px;
}
.buy-main {
  width: 100%;
  height: 269px;
  margin-top: 64px;
  background: url(img/banner-bg.jpg) no-repeat center center;
}


.buy-main .buy-main-son {
  height: 100%;
  position: relative;
}
.fs-14{
  font-size: 14px;
}

.selectpicker {

  border:1px solid #2358fe; 
}


.buy-main .buy-main-son h2 {
  color: #fff;
  position: absolute;
  top: 80px;
  font-size: 28px;
}

.buy-main .kangd-main1-son .firstP {
  position: absolute;
  width: 640px;
  line-height: 30px;
  top: 150px;
  color: #fff;
}

.buy-main .kangd-main1-son .secondP {
  position: absolute;
  width: 540px;
  line-height: 30px;
  top: 305px;
  color: #fff;
}

.buy-main .kangd-main1-son .secondP span {
  font-size: 16px;
  font-weight: bold;
  color: #00abff;
}

.buy-main .buy-main-son .kangd-main1-btn {
  position: absolute;
  bottom: 65px;
  left: 0;
}

.buy-main .buy-main-son .kangd-main1-btn button {
  width: 120px;
  height: 40px;
  background-color: #2358fe;
  border: none;
  color: #fff;
  font-size: 14px;
  cursor: pointer;
  border-radius: 3px;
}

.buy-main .buy-main-son .kangd-main1-btn button:hover {
  background-color: #fff;
  color: #2358fe;
}

.buy-main .buy-main-son .kangd-main1-gl {
  display: inline-block;
  line-height: 40px;
  width: 120px;
  height: 40px;
  border: 1px solid #fff;
  border-radius: 3px;
  position: absolute;
  bottom: 65px;
  left: 155px;
  text-align: center;
  color: #fff;
}

.buy-main .buy-main-son .kangd-main1-gl:hover {
  background-color: #fff;
  color: #2358fe;
}

.buy-main .buy-main-son .kangd-main1-wd {
  position: absolute;
  bottom: 65px;

  display: inline-block;
  height: 40px;
  line-height: 40px;
  color: #ff7f00;
  font-size: 13px;
  vertical-align: middle;
}

.buy-main .buy-main-son .kangd-main1-wd img {
  vertical-align: middle;
  margin-left: 3px;
  margin-top: -2px;
}


.buy-top {
	height: 56px;
	line-height: 56px;
	background-color: #fff;
	box-shadow: 1px 1px 3px rgba(58, 58, 58, 0.2);
}
.buy-top-title {
      margin-top: 15px;
	display: inline-block;
	border-left: solid 4px #015bfe;
	padding-left: 8px;
	font-size: 20px;
	line-height: 20px;
	color: #015bfe;
}

.server-slogan {
	margin-left: 24px;
	font-size: 14px;
}
.buy-top-right a.text-stress {
	color: #ff6600;
}

.main-content {
	padding-top: 25px;
	background-color: #f6f7f9;
}


.project-item {
	position: relative;
	padding-bottom: 16px;
	padding-top: 32px;
	border: 1px solid #f6f7f9;
	border-left: none;
	background-color: #fff;
	margin-bottom: 16px;
}
.project-item.margin-bottom-0 {
	margin-bottom: 0;
}
.project-item-name {
	position: absolute;
	left: 0;
	top:0;
	width: 50px;
	height: 100%;
	background-color: #ebecee;
}
.project-item-name span {
	word-wrap: break-word;
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 20px;
	margin-top: -20px;
	width: 1em;
	font-size: 14px;
	text-align: center;
	line-height: 14px;
	vertical-align: middle;
	color: #999999;
}
.project-item-name span.text-length-3 {
	margin-top: -21px;
}
.project-item-name span em {
	font-style: normal;
}
.main-content .project-item:hover {
	border-color: #015bfe;
}
.project-item:hover .project-item-name {
	background-color: #015bfe;
}
.project-item:hover .project-item-name span {
	color: #fff;
}
.project-rule-name {
	float: left;
	padding-top: 10px;
	width: 128px;
	text-align: right;
	font-size: 14px;
	color: #999;
}
.project-rule-select {
	padding-left: 144px;
}
.project-rule-item {
	position: relative;
	float: left;
	width: 160px;
	max-width: 160px;
	margin-top: 8px;
	margin-bottom: 16px;
	line-height: 34px;
	text-align: center;
	border: 1px solid #ddd;
	margin-left: -1px;
	background-color: #fff;
	font-size: 14px;
	color: #333;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.project-rule-item:first-child {
	margin-left: 0;
}
.project-rule-item.disabled {
	background-color: #f3f4f6;
	color: #999;
}
.project-rule-item.disabled:hover {
	background-color: #f3f4f6;
	color: #999;
	border-color: #ddd;
	cursor: no-drop;
}
.more-line-box .project-rule-item {
	margin-bottom: 0;
}
.more-line-box .project-rule-select {
	padding-bottom: 16px;
}

.project-rule-item:hover {
	cursor: pointer;
}
.project-rule-item > p {
	font-size: 12px;
	color: #666;
	background-color: #fff;
}
.project-rule-item:hover {
	border-color: #0096e0;
	background-color: #015bfe;
	color: #fff;
	z-index: 10;
}
.project-rule-item:hover .project-rule-item-desc {
	display: block;
}
.project-rule-item:hover > p {
	color: #00a9ff;
}



.product-info{
margin-bottom:15px;
}
.product-info{
margin-top:-50px;
}


.firstbox{
margin-left:130px;
}

	.firstbox li {
    display: block;
    float: left;
    margin-left: 10px;
 line-height: 50px;
	}
	
	
.firstbox  a {
	float: left;
	position: relative;
	z-index: 10;
	width: 140px;
	height: 40px;
	margin-bottom: 10px;
	border: 1px solid #dddddd;
	background-color: #fff;
	line-height: 39px;
	text-align: center;
	font-size: 13px;
	color: #4c4c4c;
}
.card-text{
	line-height: 40px;
	color: #ff4800;
	font-size: 14px;
	margin-left:140px;
}	
.card-text{
	color: #ff4800;
	font-size: 14px;
}

.d-block {border:1px solid #dddddd;background: #ffffff;  color: #dddddd;}	
	
	    #chanp_menu { 
        font:12px verdana, arial, sans-serif; /* Ã¨Â®Â¾Ã§Â½Â®Ã¦â€“â€¡Ã¥Â­â€”Ã¥Â¤Â§Ã¥Â°ÂÃ¥â€™Å’Ã¥Â­â€”Ã¤Â½â€œÃ¦Â Â·Ã¥Â¼Â */
        width: 100%;
    }
    #chanp_menu, #chanp_menu li {
        list-style:none; /* Ã¥Â°â€ Ã©Â»ËœÃ¨Â®Â¤Ã§Å¡â€žÃ¥Ë†â€”Ã¨Â¡Â¨Ã§Â¬Â¦Ã¥ÂÂ·Ã¥Å½Â»Ã¦Å½â€° */
        padding:0; /* Ã¥Â°â€ Ã©Â»ËœÃ¨Â®Â¤Ã§Å¡â€žÃ¥â€ â€¦Ã¨Â¾Â¹Ã¨Â·ÂÃ¥Å½Â»Ã¦Å½â€° */
        margin:0; /* Ã¥Â°â€ Ã©Â»ËœÃ¨Â®Â¤Ã§Å¡â€žÃ¥Â¤â€“Ã¨Â¾Â¹Ã¨Â·ÂÃ¥Å½Â»Ã¦Å½â€° */
        float: left; /* Ã¥Â¾â‚¬Ã¥Â·Â¦Ã¦ÂµÂ®Ã¥Å Â¨ */
        display: block;
        line-height: 30px;
        padding-right: 15px;
        	font-size: 13px;
	color: #333333;
}

	.firstbox .active a {
	 
		background-color: #015bfe;
		color: #ffffff !important;
	}
	.secondbox {
		background-color: #f8f8fb;
	}
	
	
	.firstbox li{
    display: block;
    float: left;
    list-style: none;
	}
	
	.secondbox :hover a {
		color: #ffffff !important;
	}
	.firstbox a,
	.secondbox a {
		color: #333333;
		 font-size: 13px;
	}

	.pro-search-box .border-light {
		border-color: rgba(239, 242, 247, 0.5) !important;
	}
	.pro-search-box .rounded {
		border-radius: 2rem !important;
	}
	.pro-search-box .bg-light,
	.pro-search-box .form-control {
		background-color: rgba(255,255,255,0.15) !important;
		border: 1px solid rgba(255,255,255,0.15) !important;
	}
	
	.pro-search-box input::-webkit-input-placeholder {
      color: #fff;
	}
	.pro-search-box input::-moz-placeholder {
		color: #fff;
	}
.p70 {
    padding: 30px 0;
}
.layui-col-md3{width: 160px;}
.c_hui {
    background-color: #f6f8fb;
}
.dnflex {
    display: box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
}
.layui-row:after,.layui-row:before{content:'';display:block;clear:both}
.subTitle {
    font-size: 10px;
    color: #999;
    margin-bottom: 70px;
    text-align: center;
    text-transform: uppercase;
}
.wrap {
    width: 1280px;
    margin: 0 auto;
}
.dn23 .main>h3 {
    height: 30px;
    line-height: 30px;
    border-left: 4px solid #2468f2;
    padding-left: 15px;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 10px;
}

.dn23 .main>p {
    font-size: 14px;
}

.dn23 .main>p.u1 {
    padding-left: 19px;
    color: #2468f2;
    margin-bottom: 10px;
}

.dn23 .main>p.u2 {
    padding-left: 53px;
    height: 20px;
    line-height: 20px;
    background: url(images/light.png) no-repeat 19px center;
    color: #ff0000;
    font-size: 14px;
    margin-bottom: 15px;
}

.dn23 .main>ul>li {
    background-color: #fff;
    height: 126px;
    width: 100%;
}

.dn23 .main>ul>li+li {
    margin-top: 20px;
}
/* Ã¦Â¸Â¯Ã¤Âºâ€˜Ã§Â½â€˜Ã§Â»Å“dn23.comÃ§â€¹Â¬Ã¥Â®Â¶Ã¥Ë†Â¶Ã¤Â½Å“Ã¯Â¼Å’Ã¤Â»Â£Ã§Â ÂÃ¦Â Â·Ã¥Â¼ÂÃ¥Â·Â²Ã¥Â¤â€¡Ã¦Â¡Ë†Ã¯Â¼Å’Ã¤Â¸Â¥Ã§Â¦ÂÃ§â€ºâ€”Ã¥Ââ€“Ã¯Â¼Å’Ã¥ÂÂ¦Ã¥Ë†â„¢Ã¤Â¾ÂÃ¦Â³â€¢Ã¨Â¿Â½Ã§Â©Â¶Ã¦Â³â€¢Ã¥Â¾â€¹Ã¨Â´Â£Ã¤Â»Â»Ã¯Â¼Å’Ã¦â€ºÂ´Ã¦â€“Â°QQ:2154121 Ã¦â€”Â¶Ã©â€”Â´Ã¯Â¼Å¡2021.03.29*/
.dn23 .main>ul>li .content {
    border: dashed 1px #ddd;
    border-left-color: transparent;
    height: 100%;
    width: 1228px;
    padding: 0 20px 0 35px;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -ms-justify-content: space-between;
    -o-justify-content: space-between;
    justify-content: space-between;
}




.layui-row:after,.layui-row:before{content:'';display:block;clear:both}
.dn23 .main>ul>li .item-title {
    background-color: #ebecee;
    color: #999999;
    height: 100%;
    line-height: 50px;
    text-align: center;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    letter-spacing: 1px;
}
.dn23-name{
width: 700px;
}

.dn23 .main>ul>li .content .c6 h5 {
    color: #333333;
    float: left;
    font-size: 22px;
}
.dn23 .main>ul>li .content .c6 dn23top {
    color: #fff;
    float: left;
    padding: 2px 5px;
    border-radius: 2px; 
    font-size: 8px;
    margin-top: 5px;
    margin-left: 10px;
    background-color: #ff4e00;
	box-shadow: 1px 1px 3px rgba(58, 58, 58, 0.2);
}
.dn23 .main>ul>li .content .c6 p {
    color: #666;
    font-size: 14px;
    width: 700px;
    line-height: 26px;
}

.dn23 .main>ul>li .content .layui-row {
    width: 900px;
    text-align: center;
    height: 100%;
}

.dn23 .main>ul>li .content .layui-row h4 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 12px;
}

.dn23 .main>ul>li .content .layui-row p {
    font-size: 14px;
}
.dn23 .main>ul>li .content .layui-row .dn23 {
    border-left: 1px solid #ccc;

}
.dn23 .main>ul>li .content .layui-row .hasline {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.dn23 .main>ul>li .content .layui-row .hasline1 {
    border-right: 1px solid #ccc;
}

.dn23 .main>ul>li .content .layui-row .red {
    color: #f00;
}

.dn23 .main>ul>li .content .layui-row img {
    position: absolute;
    left: 23px;
    top: -6px;
}


.dn23 .main>ul>li .content .layui-col-md3 .i3 {
    height: 60px;
    line-height: 60px;
    font-weight: 700;
    color: #666;
    font-family: "Microsoft Yahei";
}

.dn23 .main>ul>li:hover .item-title {
    background-color: #2468f2;
    color: #fff;
}

.dn23 .main>ul>li:hover .content {
    border-color: #2468f2;
    border-left-color: transparent;
}

.dn23 .main>ul>li .content .layui-btn-primary {
    border: solid 1px #dddddd;
    color: #666;
}
/* Ã¦Â¸Â¯Ã¤Âºâ€˜Ã§Â½â€˜Ã§Â»Å“dn23.comÃ§â€¹Â¬Ã¥Â®Â¶Ã¥Ë†Â¶Ã¤Â½Å“Ã¯Â¼Å’Ã¤Â»Â£Ã§Â ÂÃ¦Â Â·Ã¥Â¼ÂÃ¥Â·Â²Ã¥Â¤â€¡Ã¦Â¡Ë†Ã¯Â¼Å’Ã¤Â¸Â¥Ã§Â¦ÂÃ§â€ºâ€”Ã¥Ââ€“Ã¯Â¼Å’Ã¥ÂÂ¦Ã¥Ë†â„¢Ã¤Â¾ÂÃ¦Â³â€¢Ã¨Â¿Â½Ã§Â©Â¶Ã¦Â³â€¢Ã¥Â¾â€¹Ã¨Â´Â£Ã¤Â»Â»Ã¯Â¼Å’Ã¦â€ºÂ´Ã¦â€“Â°QQ:2154121 Ã¦â€”Â¶Ã©â€”Â´Ã¯Â¼Å¡2021.03.29*/


/* Ã¦Â¸Â¯Ã¤Âºâ€˜Ã§Â½â€˜Ã§Â»Å“dn23.comÃ§â€¹Â¬Ã¥Â®Â¶Ã¥Ë†Â¶Ã¤Â½Å“Ã¯Â¼Å’Ã¤Â»Â£Ã§Â ÂÃ¦Â Â·Ã¥Â¼ÂÃ¥Â·Â²Ã¥Â¤â€¡Ã¦Â¡Ë†Ã¯Â¼Å’Ã¤Â¸Â¥Ã§Â¦ÂÃ§â€ºâ€”Ã¥Ââ€“Ã¯Â¼Å’Ã¥ÂÂ¦Ã¥Ë†â„¢Ã¤Â¾ÂÃ¦Â³â€¢Ã¨Â¿Â½Ã§Â©Â¶Ã¦Â³â€¢Ã¥Â¾â€¹Ã¨Â´Â£Ã¤Â»Â»Ã¯Â¼Å’Ã¦â€ºÂ´Ã¦â€“Â°QQ:2154121 Ã¦â€”Â¶Ã©â€”Â´Ã¯Â¼Å¡2021.03.09*/
.layui-btn-primary{
    border:1px solid #C9C9C9;
    background-color:#fff;
    color:#ffffff
}
.layui-btn-primary:hover{
    border:1px solid #C9C9C9;
    border-color:#009688;
    color:#333}
    
.layui-btn{
    display:inline-block;
    height:38px;
    line-height:38px;
    padding:0 18px;
    background-color:#2468f2;
    color:#fff;
    white-space:nowrap;
    text-align:center;
    font-size:14px;
    border:none;
    border-radius:2px;
    cursor:pointer;
}
.layui-btn:hover{opacity:.8;filter:alpha(opacity=80);color:#fff}


.layui-btn-over{
    display:inline-block;
    height:38px;
    line-height:38px;
    padding:0 18px;
    background-color:#9b9b9b;
    color:#fff;
    white-space:nowrap;
    text-align:center;
    font-size:14px;
    border:none;
    border-radius:2px;
    cursor:pointer;
}
.layui-btn-over:hover{opacity:.8;filter:alpha(opacity=80);color:#fff}
.layui-btn-primary{
    border-left:none
    
}
.layui-btn-group .layui-btn-primary:hover{
    border-color:#C9C9C9;
    color:#ffffff;
    
}


/* Ã¦Â¸Â¯Ã¤Âºâ€˜Ã§Â½â€˜Ã§Â»Å“dn23.comÃ§â€¹Â¬Ã¥Â®Â¶Ã¥Ë†Â¶Ã¤Â½Å“Ã¯Â¼Å’Ã¤Â»Â£Ã§Â ÂÃ¦Â Â·Ã¥Â¼ÂÃ¥Â·Â²Ã¥Â¤â€¡Ã¦Â¡Ë†Ã¯Â¼Å’Ã¤Â¸Â¥Ã§Â¦ÂÃ§â€ºâ€”Ã¥Ââ€“Ã¯Â¼Å’Ã¥ÂÂ¦Ã¥Ë†â„¢Ã¤Â¾ÂÃ¦Â³â€¢Ã¨Â¿Â½Ã§Â©Â¶Ã¦Â³â€¢Ã¥Â¾â€¹Ã¨Â´Â£Ã¤Â»Â»Ã¯Â¼Å’Ã¦â€ºÂ´Ã¦â€“Â°QQ:2154121 Ã¦â€”Â¶Ã©â€”Â´Ã¯Â¼Å¡2021.03.09*/
.layui-btn-primary{
    border:1px solid #C9C9C9;
    background-color:#fff;
    color:#ffffff
}
.layui-btn-primary:hover{
    border:1px solid #C9C9C9;
    border-color:#009688;
    color:#333}




.config-content-parent.product_card {
    width: 1200px;
}

.col-sm-product {
    width: calc((100% - 75px) / 4);
    margin-top: 20px;
     margin-bottom: 20px;
    margin-right: 20px;
    display: inline-block;
    vertical-align: top;
}
.product_card>div:nth-child(4n+4) {
  margin-right: -12px;
}
.smc-card.card-md:first-child {
    margin-left: 0;
}
.smc-card.card-md {

    padding-bottom: 20px;
}
.smc-card {
    position: relative;
    background: #fff;
    box-shadow: 0 16px 16px 0 rgba(55,69,103,.02), 0 8px 8px 0 rgba(235,240,252,.02);
    border: 1px solid #e1e6f0;
    text-align: left;
}
.smc-card:before {
    content: "";
    position: absolute;
    width: 60px;
    height: 4px;
    background: #3860f4;
    box-shadow: 0 16px 16px 0 rgba(55,69,103,.02), 0 8px 8px 0 rgba(235,240,252,.02);
    border-radius: 0 0 2px 2px;
    left: 24px;
}
.smc-card .card-tag {
    position: absolute;
    top: 16px;
    right: 0px;
    padding: 2px 10px 2px 17px;
    background: linear-gradient(90deg,#f9faff 0,#ebf0fc 100%);
    border-radius: 4px;
    /* -webkit-clip-path: polygon(10px 3%,13px 0,100% 0,100% 100%,13px 100%,10px 97%,2px 19px,0 56%,0 44%,2px 9px); */
    /* clip-path: polygon(10px 3%,13px 0,100% 0,100% 100%,13px 100%,10px 97%,2px 19px,0 56%,0 44%,2px 9px); */
    font-size: 12px;
    line-height: 24px;
    font-weight: 700;
    color: #3860f4;
    top:4px;
}
a.button-base.button-yellowgradient.h34.no {
    background: linear-gradient(45deg, #ffcb84 0%, #ffbc76 100%);
    color: #cc6a12;
    border: 1px solid #ffa53d;
    text-shadow: 0 0.1em 0 #ffd7b4;
}
a.button-base.button-yellowgradient.h34.no:hover{
    background: linear-gradient(45deg, #ffcb84 0%, #ffbc76 100%);
    color: #cc6a12;
    }
a.button-base.button-yellowgradient.h34:hover{
    background: linear-gradient(to right,#537ffa,#3357df);
    color: #fff;
    }
.smc-card .card-tag:before {
    position: absolute;
    top: 12px;
    left: 8px;
    content: '';
    width: 4px;
    height: 4px;
    background: linear-gradient(90deg,#2948df 0,#ebf0fc 100%);
    border-radius: 2px;
}
.smc-card.card-md .card-top {
    margin: 0 24px;
    padding: 36px 0 16px 0;
    border-bottom: 1px solid #ebf0fc;
}
.smc-card .card-bottom .bottom-wrap {
    border-top: 1px solid #ebf0fc;
}
.smc-card .card-top .title {
    font-size: 18px;
    font-weight: 700;
    line-height: 32px;
    color: #000000;
}

.col-sm-product:hover .smc-card .card-top .title{
    color: #015bfe;
}


.smc-card .card-top .desc {
    display: inline-block;
    margin-top: 4px;
    color: #7a8ba6;
    font-size: 14px;
    line-height: 28px;
}
.smc-card.card-md .card-content {
    margin: 0 24px;
    padding: 16px 0 16px 0;
}
.smc-card .card-bottom {
    /*position: absolute;*/
    bottom: 0;
    width: 100%;
}
.card-content li {
    height: 28px;
    line-height: 28px;
    font-size: 12.5px;
    letter-spacing: 1.2px;
    color: #212529;
}
.smc-card.card-md .card-bottom .bottom-wrap.label-tags {
    padding: 15px 0 0px 0;
    margin: 0 24px;
}
.smc-card .card-bottom .bottom-wrap .price-detail {
    display: block;
    font-size: 12px;
    color: #374567;
    margin-bottom: 20px;
}
.smc-card .card-bottom .bottom-wrap .price-detail .font-num {
    font-size: 25px;
    color: #3860f4;
    font-weight: 700;
}
.smc-card .card-bottom .bottom-wrap .price-detail .desc {
    display: inline-block;
    line-height: 17px;
}
a.button-base.button-radius-4.button-blueborder.h34-border.ml16 {
    border: 1px solid #3860f4;
    background: #fff;
    color: #3860f4;
    margin-right: 20px;
}
.button-base {
    display: block;
    padding: 0 24px;
    font-size: 14px;
    box-sizing: border-box;
    border-radius: 2px;
    transition: all .25s ease-in-out;
    height: 34px;
    line-height: 34px;
    background: linear-gradient(to right,#5f87f8,#3860f4);
    color: #fff;
    text-align: center;
}
.list_nome{
    font-size: 14px;
    margin-left: 10px;
}
.font-num em{
    font-size: 14px;
}
.original_price {
    font-size: 13px;
    display: grid;
    color: #ff1100;
    font-weight: 400;      
}
.price-detaily {
    display: inline-block;
    font-size: 12px;
    color: #374567;
    font-weight: 400;    
}