@charset "utf-8";
/*------------------------------------------------------------------*/
/*  首页式样代码可以写在这里
/*-----------------------------------------------------------------*/

/*------------------------------------------*/
/*  关于我
/*------------------------------------------*/

:root {
  /*BANNER 设置*/
  --primary-height: 600px; /*高度*/
  --second-width: 100%; /*宽度*/
}

/* SuperSlide格式 */
#vk-slideBox{ width:var(--second-width); height:var(--primary-height); overflow:hidden; position:relative;}
#vk-slideBox .hd{width: 100%;
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    height: 30px;
    line-height: 30px;
    text-align: center; }
#vk-slideBox .hd ul li{ cursor:pointer; display:inline-block; *display:inline; zoom:1; width:11px; height:11px; margin:4px; background:url(/assets/vkes/imgs/slide/dot-black.png) 0 0; overflow:hidden; 
	line-height:9999px; filter:alpha(opacity=40);opacity:0.4; 
}
#vk-slideBox .hd ul .on{ filter:alpha(opacity=100);opacity:1;  }
#vk-slideBox .bd{ position:relative; height:100%; z-index:0;background: url(/assets/app/imgs/base/banner_bg.png) 100% 100%;}
#vk-slideBox .bd li{ zoom:1; vertical-align:middle; }
#vk-slideBox .bd img{ width:var(--second-width); height:var(--primary-height); display:block;  }

/* 下面是前/后按钮代码，如果不需要删除即可 */
#vk-slideBox .prev,
#vk-slideBox .next{ position:absolute; left:3%; top:50%; margin-top:-25px; display:block; width:32px; height:40px; background:url(/assets/vkes/imgs/slide/slider-arrow.png) -110px 5px no-repeat; filter:alpha(opacity=50);opacity:0.5;   }
#vk-slideBox .next{ left:auto; right:3%; background-position:8px 5px; }
#vk-slideBox .prev:hover,
#vk-slideBox .next:hover{ filter:alpha(opacity=100);opacity:1;  }
#vk-slideBox .prevStop{ display:none;  }
#vk-slideBox .nextStop{ display:none;  }

/*------------------------------------------*/
/*  主题导航
/*------------------------------------------*/
.vk-holder {
    padding-top: 40px;
    background: url(/assets/app/imgs/base/con_bg.png) center top no-repeat;
	}
.vk-holder .vk-holder-box{border: #ccc 1px solid;height: 278px;margin-bottom: 20px;}
.vk-holder .title
{
	height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #333;
    text-indent: 20px;
    border-bottom: #ccc 1px solid;
    background: url(/assets/app/imgs/base/bg3.png) 10px center no-repeat;
}
.vk-holder .title .more{
	float: right;
    margin: 15px 15px 0 0;
    width: 26px;
    height: 7px;
    background: url(/assets/app/imgs/base/more.png) 0 0 no-repeat;
}

.vk-holder .infor{
	padding: 15px 20px 0;
    }
.vk-holder .infor img{width: 100%;height:auto;max-height: 100px;margin-bottom: 20px;}
.vk-holder .infor p{line-height: 180%;
    font-size: 13px;
    color: #666;margin-bottom: 10px;}    
.vk-holder-icon{ margin-bottom: 20px; text-align: center; }
.b-right { border-right: 1px dashed #e9e9e9; }
.vk-title{color:#004861;font-size:1.75rem;margin-bottom:0.5rem;font-weight:700;}

/*产品搜索*/
.vk-holder-box h3{padding: 15px 10px 10px;text-align: center;}
.vk-holder-box .layui-form-select dl dd.layui-this {
    background-color: #1296DB;
    color: #fff;
}

#nav-img{
    padding: 30px 0;
}
#nav-img .nav-img-box{
	padding: 10px;
    border: #CCCCCC 1px solid;
    height:128px;
    overflow: hidden;
    position: relative;
}
#nav-img .nav-img-box a{
	display: block;
	height:100%;
}
#nav-img img{
	width: 100%;
	height:100%;
}

#nav-img .nav-img-box .text {
    position: absolute;
    right: 20px;
    top: calc(50% - 20px);
    text-align: right;
    font-size: 16px;
    color: #1785d2;
}

/*------------------------------------------*/
/*  产品介绍
/*------------------------------------------*/
#vk-product{padding:20px 0;}

#vk-product .vk-product-box{
	border: #ccc 1px solid;margin-bottom: 20px;padding-bottom:20px;
}
#vk-product .title
{
	height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #333;
    text-indent: 20px;
    border-bottom: #ccc 1px solid;
    background: url(/assets/app/imgs/base/bg3.png) 10px center no-repeat;
}
#vk-product .title .more{
	float: right;
    margin: 15px 15px 0 0;
    width: 26px;
    height: 7px;
    background: url(/assets/app/imgs/base/more.png) 0 0 no-repeat;
}
.vk-product-imgbox{
	padding: 10px;
    border: #CCCCCC 1px solid;
    height:198px;
    overflow: hidden;
	margin-bottom: 10px;
}
.vk-product-imgbox a{display: block;height:100%;}
.vk-product-imgbox img{width:100%;height:100%;}
#vk-product .list-box{padding:20px 20px 0;}
#vk-product p{
    height: 26px;
    line-height: 26px;
    text-align: center;
    font-size: 12px;
    color: #333;
}
#vk-product p.cptitle{font-size:16px;font-weight:bold;}
#vk-product p.last{margin-bottom: 20px;}
#vk-product .vk-title-1{color:#FFFFFF;margin-bottom: 16px;font-size:24px;font-weight:700;}
#vk-product #vk-system{margin-bottom: 30px;height:510px;}
#vk-product #vk-system p{color:#FFFFFF;margin-bottom: 16px;}
#vk-product .table{ margin-top:20px; margin-bottom:20px; width:100%; }
#vk-product .table td,#vk-product .table th{ font-size: 16px; padding: 16px 0; border-top: none; border-bottom: 1px dashed #FFFFFF; }
#vk-product .vk-product-item{ height:208px; border-radius: 6px; padding: 30px; margin-bottom: 30px; background-color: #fff; border: 1px solid #f5f5f5; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); cursor: pointer; }
#vk-product .vk-product-item:hover{ background-color: #FAFAFA; border: 1px solid #f5f5f5; -webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3); box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3); }
#vk-product .vk-title-2{color:#004861;font-size:1.2rem;font-weight:700;margin-bottom: 10px;text-align: center;}
#vk-product .vk-product-item p{font-size: 15px; line-height: 28px; color: #5c6873;}
/*------------------------------------------*/
/*  信息中心
/*------------------------------------------*/
#vk-news{background-color: #FFFFFF;margin:40px 0;}
#vk-news p{color:#888888;font-size:14px;line-height: 21px;}
#vk-news .vk-news-box{ height: 380px; border-radius: 6px; padding: 30px; margin-bottom: 30px; background-color: #FAFAFA; border: 1px solid #F5F5F5; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); cursor: pointer; }
#vk-news .vk-news-box:hover{ background-color: #F5F5F5; border: 1px solid #F5F5F5; -webkit-box-shadow: 0 10px 10px rgba(204, 204, 204, 0.3); -moz-box-shadow: 0 10px 10px rgba(204, 204, 204, 0.3); box-shadow: 0 10px 10px rgba(204, 204, 204, 0.3); }
#vk-news .vk-title-1{color:#004861;margin-bottom: 16px;font-size:18px;font-weight:700;border-bottom: 1px solid #CCCCCC;padding-bottom: 10px;}
#vk-news .vk-title-1 span{font-weight: lighter;font-size: 12px;line-height: 30px;}
#vk-news .vk-title-1 span a{color:#999999;}
#vk-news .vk-title-1 span a:hover{color:#666666;}
#vk-news li{font-size:16px;line-height: 40px;height:40px;border-bottom: 1px dotted #CCCCCC;position: relative;padding-left:20px;}
#vk-news li:before{ content: "\f105"; font-family:FontAwesome; position: absolute;top:0;left:-8px;font-size: 20px;width: 1.28571429em;text-align: center;color:#BBBBBB; }
#vk-news li a{display: block;height:100%;}
#vk-news li a:hover,#vk-news li:hover:before{color: #1296DB;}
/*#vk-news li:last-child{border-bottom: 0px;}*/
#vk-news li .caption{margin-right:0;}
#vk-news li .in-caption{width:100%;overflow: hidden;display: block;
white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis;

}
#vk-news li .date{float:right;font-size:14px;display: none;}
/*------------------------------------------*/
/*  友情链接
/*------------------------------------------*/
#vk-links { padding: 40px 0; }
#vk-links p { color: #888888; font-size: 14px; line-height: 21px; }
#vk-links li{float: left;padding-bottom: 10px;}
#vk-links li img{width:100%;height:50px;border:1px solid #CCCCCC;}
/*------------------------------------------*/
/*  BANNER 图
/*------------------------------------------*/
#vk-banner .layui-carousel-ind { top: -60px; }

@media screen and (min-width: 768px){
	#vk-news li .caption{margin-right:100px;}
	#vk-news li .date{display: block;}
}