﻿
.ow-page-hero{ background:#f6fafe; border-bottom:1px solid #e7eef5; color:#555; padding:15px 0; text-align:center; }
.ow-page-hero h1{ color:#121212; font-size:32px;}
.ow-page-hero h3{ color:#888; font-size:18px; font-weight:normal; padding:3px 0 0 0;}

.ow-template-mbody{ background:#f2f5f9; min-height:600px; margin:0px auto 0px auto;}
.ow-template-mbody .wrapper{ width:100%!important; min-width:1200px; max-width:1680px;}

/**类型筛选**/
.ow-goods-type-section{ background:#fff; display:none; border-bottom:1px solid #dedede; padding:15px 0px 15px 28px;}
.ow-goods-type-section .wrapper{ width:100%!important; min-width:1200px;}
.ow-goods-type-section .type-header{ color:#888; display:none; font-size:14px; font-weight:normal; padding:0px 10px 15px 0px; }
.ow-goods-type-section .type-section{}
.ow-goods-type-section .type-line{ font-size:14px; zoom:1; overflow:auto; padding:5px 0px 5px 0; position:relative;}
.ow-goods-type-section .type-line .type-attr{ color:#888; display:none; float:left; padding:8px 2px 0px 0px; text-align:left; width:80px; }
.ow-goods-type-section .type-line .type-value{ float:left; width:1000px;}
.ow-goods-type-section .type-line .type-value ul{}
.ow-goods-type-section .type-line .type-value li{ float:left; white-space:nowrap; padding:2px 0px;}
.ow-goods-type-section .type-line .type-value li a{ color:#888; display:inline-block; height:24px; line-height:24px; padding:4px 12px;}
.ow-goods-type-section .type-line .type-value li a:hover,
.ow-goods-type-section .type-line .type-value li a.current{ background:#e60022; border-radius:5px; color:#fff;}
.ow-goods-type-section .wrapper{ position:relative;}
.ow-goods-type-section .desiger-join{ background:#6bc30d; display:inline-block; font-weight:bold; height:24px; line-height:24px; padding:3px 10px; position:absolute; top:-5px; right:0px;}
.ow-goods-type-section .desiger-join,
.ow-goods-type-section .desiger-join:visited{ color:#fff;}
.ow-goods-type-section .desiger-join:hover{ background-color:#5eb501; text-decoration:none;}
/**排序**/
.ow-goods-orderby { padding:15px 30px; text-align:center;}
.ow-goods-orderby .order{}
.ow-goods-orderby .order a{ background-color:#fff; border:1px solid #d2d2d2; color:#666; display:inline-block; font-size:12px; height:24px; line-height:24px; margin-right:-1px; padding:0px 12px;}
.ow-goods-orderby .order a:hover{ border:1px solid #e60022; color:#e60022; position:relative;}
.ow-goods-orderby .order a.current{ background:#e60022; border-color:#e60022; color:#fff;}

/*分类页-商品列表*/
.ow-templates-list{ padding:25px 15px;}
.ow-templates-list ul{ display:flex; flex-wrap:wrap; flex-direction:row; justify-content:center;}
.ow-templates-list ul li{ box-sizing:border-box; background-color:#fff; float:left; margin:0px 15px 40px 15px; width:calc(25% - 30px); -webkit-box-shadow:0 0 10px 5px rgba(0,0,0,0.08); -moz-box-shadow:0 0 10px 5px rgba(0,0,0,0.08); box-shadow:0 0 10px 5px rgba(0,0,0,0.08);}
.ow-templates-list ul li:hover{ -webkit-box-shadow:0 0 10px 5px rgba(0,0,0,0.15); -moz-box-shadow:0 0 10px 5px rgba(0,0,0,0.15); box-shadow:0 0 10px 5px rgba(0,0,0,0.15);}
.ow-templates-list ul li .thumb{ background:#fff; border-bottom:1px solid #eee; width:100%; position:relative; text-align:center;}
.ow-templates-list ul li .thumb a.pc{ display:block; position:relative; overflow:hidden; }
.ow-templates-list ul li .thumb a.pc img{ box-sizing:border-box; position:absolute; left:0; top:0; bottom:auto; width:100%; }
.ow-templates-list ul li:hover .thumb a.pc img{ transition-duration:2000ms; transition-timing-function:ease-out;}
.ow-templates-list ul li .thumb a.mob { box-sizing:border-box; height:260px; width:120px; position:absolute; right:10px; bottom:-15px;  }
.ow-templates-list ul li:hover .thumb .mob { bottom:-60px; transition-duration:500ms; transition-timing-function:ease-out; }
.ow-templates-list ul li .thumb a.mob img{ box-sizing:border-box; background:#fff; border-radius:15px; height:260px; width:100%; padding:14px 1px 6px 1px; position:relative; -webkit-box-shadow:rgba(0,0,0,0.3) 0px 0px 12px; -moz-box-shadow:rgba(0,0,0,0.3) 0px 0px 12px; box-shadow:rgba(0,0,0,0.3) 0px 0px 12px; }
.ow-templates-list ul li .thumb .mob::after{ content:''; background:url("../images/mobui.png") no-repeat; background-position:0px 0px; background-size:120px; height:100%; width:100%; position:absolute; top:0; left:0; }
.ow-templates-list ul li .info{ min-height:200px; padding:15px 20px 30px 20px; position:relative; text-align:center; }
.ow-templates-list ul li h3{ font-size:18px; padding:5px 0 10px 0;}
.ow-templates-list ul li h3 a{ position:relative; z-index:1; }
.ow-templates-list ul li h3 a,
.ow-templates-list ul li h3 a:visited{ color:#424242; text-decoration:none;}
.ow-templates-list ul li h3 a:hover{ color:#e60022;}
.ow-templates-list ul li h3 a::before { content:""; position:absolute; width:0%; height:100%; left:0; top:1px; border-bottom:1px solid #ff661f; transition:0.5s; z-index:-1;}
.ow-templates-list ul li h3 a:hover::before { width:100%;}
.ow-templates-list ul li .subtitle{ color:#888; font-size:14px;}
.ow-templates-list ul li .version-type{ padding:5px 0px 0px 0px;}
.ow-templates-list ul li .title-tag{ background:#fe254f; display:inline-block; line-height:22px; border-radius:10px 10px 0 0; color:#fff; font-size:14px; margin:0px 0px 0 0px; padding:2px 10px; vertical-align:4px;}
.ow-templates-list ul li .title-tag a,
.ow-templates-list ul li .title-tag a:visited{ color:#fff; }
.ow-templates-list ul li .tags { padding:0 0;}
.ow-templates-list ul li .tags a{ background:#ebf0fe; box-sizing:border-box; border-radius:0 0 5px 5px; color:#666; font-size:12px; display:inline-block; font-weight:normal; margin:0 5px 5px 0; padding:0 6px;}
.ow-templates-list ul li .tags a:hover{ background:#fe254f; color:#fff; transition:0.5s;}
.ow-templates-list ul li .price{ padding:5px 0px 0px 0px; position:relative;}
.ow-templates-list ul li .price span.money{ color:#e60022; font-size:14px;}
.ow-templates-list ul li .price span.money em{ font-size:14px;}
.ow-templates-list ul li .price span.money b{ font-size:14px; font-weight:bold;}
.ow-templates-list ul li .price span.point{ color:#e60022; font-size:14px; margin-right:5px;}
.ow-templates-list ul li .price span.point b{ font-size:16px; font-weight:bold;}
.ow-templates-list ul li span.view{ color:#aaa; font-size:12px; position:absolute; right:20px; bottom:15px;}
.ow-templates-list ul li span.view i{ font-size:11px; margin-right:5px;}

.ow-templates-list ul li div.buy{ padding:18px 0 0 0; text-align:center;}
.ow-templates-list ul li div.buy a.buy{ background:#ebf0fe; border:1px solid #dee7ff; color:#666; border-radius:20px; display:inline-block; font-size:16px; font-weight:bold; padding:5px 30px 5px 30px;}
.ow-templates-list ul li:hover .buy a.buy{ background:#11b23c; border-color:#06a431; color:#fff; transition:0.5s; }
.ow-templates-list ul li:hover .buy a.buy:hover{ background:#06a431; border-color:#06a431; color:#fff; transition:0.5s; }
.ow-templates-list ul li .buy a.buy i{ margin-right:10px;}

.ow-templates-list ul li .buy a.demo{ background:#f4f4f4; border:1px solid #e0e0e0; color:#666; border-radius:20px; display:inline-block; font-size:16px; font-weight:bold; margin-left:10px; padding:5px 30px 5px 30px;}
.ow-templates-list ul li .buy a.demo:hover{ background:#eee; border-color:#aaa; }

.ow-templates-list .pager{ display:block; padding:20px 0px 40px 0px; text-align:center;}

@media (min-width:1900px) {
	.ow-templates-list ul li{ margin:0px 20px 50px 20px; width:calc(25% - 40px); }
	.ow-templates-list ul li .info{ padding-bottom:40px;}
}

/*tags*/
.ow-tags { background:#f2f5f9; margin:0px auto; padding:0 0 20px 0; text-align:center;}
.ow-tags .hd { border-bottom:1px solid #eeeeee; margin-bottom:25px; padding-bottom:10px; width:100%; position:relative; }
.ow-tags .hd h4{ color:#09101e; font-size:18px;}
.ow-tags .bd{ padding:0px 0px 15px 0px;}
.ow-tags a{ background:#fff; border:1px solid #eee; display:inline-block; padding:5px 10px; margin:0px 10px 10px 0px; white-space:nowrap;}
.ow-tags a,
.ow-tags a:visited{ color:#464646;}
.ow-tags a:hover { background:#fff; border-color:#0067ed; color:#0067ed; text-decoration:none;}




