@charset "utf-8";
/* 
* Author: Lin xiao dong
* https://www.openwbs.com
*/

body{ background-color:#fff; }

.ow-page-hero{ background:#f6fafe; border-bottom:1px solid #e7eef5; color:#555; font-size:16px; padding:30px 40px; text-align:center; }
.ow-page-hero h1{ color:#121212; font-size:32px;}
.ow-page-hero h3{ color:#666; font-size:18px; font-weight:normal;}

.ow-client-data{ background:#f6fafe; border-bottom:1px solid #e7eef5; color:#555; font-size:16px; }
.ow-client-data .data{ display:flex; flex-wrap:wrap; justify-content:center; text-align:center; padding:20px 0px;}
.ow-client-data .data .item{ box-sizing:border-box; border-left:1px solid #e7eef5; padding:10px 0px; position:relative; }
.ow-client-data .data .item1{ width:21.2%;}
.ow-client-data .data .item2{ width:31.8%;}
.ow-client-data .data .item3{ width:26%;}
.ow-client-data .data .item4{ width:21%;}
.ow-client-data .data .item:first-child{ border-left:0;}
.ow-client-data .data .item h3{ font-size:20px; }
.ow-client-data .data .item a{ position:relative;}
.ow-client-data .data .item a b{ color:#f20000; font-size:24px; font-weight:normal; padding:0 5px;}
.ow-client-data .data .item a:hover{ color:#f20000;}
.ow-client-data .data .item a:hover b{ color:#c20000;}
.ow-client-data .data .item a::before { content:""; position:absolute; width:0%; height:100%; left:0; top:1px; border-bottom:1px solid #f20000; transition:0.5s;}
.ow-client-data .data .item a:hover::before { width:100%;}
.ow-client-data .data .item span.latest-version{ color:#e20000; padding:0 5px 0 5px;}
.ow-client-data .data .item span.version-time{ color:#e20000; padding:0 0 0 5px;}
.ow-client-data .data .item p b{ color:#f20000; font-size:18px; font-weight:normal; padding:0 3px;}

.ow-products{ box-sizing:border-box; background:#f2f5f9; color:#666; margin:0 auto; padding:0px 0 50px 0; }
.ow-products .wrapper{ width:100%!important; min-width:1200px; max-width:1520px; }
.ow-products .bd{ display:flex; flex-wrap:wrap; justify-content:center; padding:10px 10px; }
.ow-products .sysitem{ box-sizing:border-box; background:#fff; margin:10px 10px 10px 10px; width:calc(50% - 24px); padding:30px 10px 50px 25px; position:relative; -webkit-box-shadow:0 0 6px 3px rgba(0,0,0,0.03); -moz-box-shadow:0 0 6px 3px rgba(0,0,0,0.03); box-shadow:0 0 6px 3px rgba(0,0,0,0.03); }
.ow-products .sysitem b.title-tag{ background:#fe254f; border-radius:10px 0 10px 0px; display:inline-block; color:#fff; font-size:14px; font-weight:normal; margin-left:10px; padding:0px 10px; vertical-align:4px; }
.ow-products .sysitem .imgbox{ background-color:#fff; float:left; margin-right:20px;}
.ow-products .sysitem .imgbox a{ }
.ow-products .sysitem .imgbox img{ border-radius:5px; height:100px; width:100px;}
.ow-products .sysitem:hover .imgbox img{ transform:scale(1.0,1.0); transition-duration:500ms; transition-timing-function:ease-out;}
.ow-products .sysitem .basebox{ min-height:100px; margin-top:-5px; padding:0px 0px 0px 120px; position:relative;  }
.ow-products .sysitem .basebox h3{ font-size:24px; padding:0 0 5px 0px;}
.ow-products .sysitem .basebox h3 a{ color:#222222; position:relative;}
.ow-products .sysitem .basebox h3 a:hover { color:#121212;}
.ow-products .sysitem .basebox h3 a::before { content:""; position:absolute; width:0%; height:100%; left:0; top:1px; border-bottom:1px solid #fe254f; transition:0.5s;}
.ow-products .sysitem .basebox h3 a:hover::before { width:100%;}
.ow-products .sysitem .basebox .version{ font-size:14px; padding:0 0; }
.ow-products .sysitem .basebox .version span.latest-version{ color:#fe254f; padding:0 20px 0 7px;}
.ow-products .sysitem .basebox .version span.version-time{ color:#fe254f; padding:0 0 0 7px;}
.ow-products .sysitem .basebox .p-char{ font-size:14px; padding:0 0; }
.ow-products .sysitem .basebox .p-char span{ box-sizing:border-box; display:inline-block; float:left; padding-right:2px;}
.ow-products .sysitem .basebox .p-char .text{}
.ow-products .sysitem .basebox .p-char b{ color:#fe254f; font-weight:normal; margin-left:5px;}
.ow-products .sysitem .basebox .p-char b:hover{ color:#b61d3b; transition:0.5s;}
.ow-products .sysitem .infobox{ box-sizing:border-box; padding:10px 0px 0px 0px; position:relative;  }
.ow-products .sysitem .infobox .p-text{ font-size:14px; }
.ow-products .sysitem .infobox .p-text span{ box-sizing:border-box; color:#121212; display:inline-block; float:left; font-size:14px; font-weight:bold; width:120px; padding-right:15px; text-align:right; }
.ow-products .sysitem .infobox .p-text .text{ padding-left:120px;}
.ow-products .sysitem .infobox .p-text b{ background:#ebf0fe; box-sizing:border-box; border-radius:5px 0 5px 0; color:#333; display:inline-block; font-weight:normal; margin:0 5px 5px 0; padding:0 6px;}
.ow-products .sysitem .infobox .p-text b:hover{ background:#fe254f; color:#fff; transition:0.5s;}
.ow-products .sysitem .infobox .p-text b.b1{  background:#fe254f; color:#fff; }
.ow-products .sysitem .l-button{ padding:20px 0 0 120px;}
.ow-products .sysitem .l-button a.download{background:#fff url("../images/icon/rar.png") 18px 17px no-repeat; color:#0067ed;border:2px solid #0067ed; border-radius:8px; display:inline-block; font-size:16px; margin-right:10px; padding:10px 25px 10px 43px;}
.ow-products .sysitem .l-button a.download:hover{ background-color:#0067ed; color:#fff; transition:0.5s;}
.ow-products .sysitem .l-button a.download b{ font-weight:normal; padding:0 5px 0 0;}
.ow-products .sysitem .l-button a.detail{ border:1px solid #e6e6e6; border-radius:8px; color:#333; display:inline-block; font-size:16px; padding:10px 20px; }
.ow-products .sysitem .l-button a.detail:hover{  border:1px solid #0067ed; color:#0067ed;}
.ow-products .sysitem .update{ padding:20px 0 15px 120px;}
.ow-products .sysitem .help{ padding:20px 0 0 120px; position:relative;}
.ow-products .sysitem .help::before{ content:''; position:absolute; left:120px; top:5px; width:300px; height:1px; border-top:1px dashed #ccc;}
.ow-products .sysitem .help a{ margin-right:20px; padding-left:10px; position:relative;}
.ow-products .sysitem .help a::after { content:''; width:4px; height:4px; background:#333; border-radius:50%; position:absolute; left:0; top:50%; margin-top:-2px;}
.ow-products .sysitem .help a::before { content:""; position:absolute; width:0%; height:100%; left:10px; top:1px; border-bottom:1px solid #0067ed; transition:0.5s;}
.ow-products .sysitem .help a:hover::before { width:calc(100% - 10px);}
span.sep{ color:#ccc; padding:0 12px; vertical-align:1px;}

/**演示体验**/
.ow-template-demo{ color:#666; font-size:14px; position:relative; padding-left:120px;}
.ow-template-demo h5{ color:#333; padding:0px 0px 10px 0px; position:absolute; left:28px; top:13px;}
.ow-template-demo h5.fobshop{ left:0px; }
.ow-template-demo h5 b{ background-color:#334259; display:inline-block; border-radius:10px 0 10px 0; color:#fff; font-size:14px; font-weight:normal; padding:2px 10px;}
.ow-template-demo a,
.ow-template-demo a:visited{ background:#fafafa; border-radius:5px; color:#2467b2; display:inline-block; padding:1px 8px; }
.ow-template-demo a:hover{ background-color:#0067ed; color:#fff; transition:0.5s;}
.ow-template-demo .item{ padding:8px 0px 0px 0px; position:relative;}
.ow-template-demo .item label{ display:inline-block; min-width:102px;}
.ow-template-demo .item i{ margin:0px 10px 0px 0px;}
.ow-template-demo .mob{ height:150px;}
.ow-template-demo .mob .scan{ color:#888; font-size:14px; position:absolute; left:255px; top:15px;}
.ow-template-demo .mob .qrcode{ display:block; position:absolute; left:104px; top:15px;}
.ow-template-demo .mob .qrcode img{ background:#fff; border:1px solid #ddd; padding:8px;}