﻿@charset "utf-8";
/* 
* Author:lin xiao dong (1071322670@qq.com)
* www.openwbs.com
*/
.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;}

.case-mbody{ background:#fafafa; }
.case-mbody .wrapper{ width:1200px!important;}
.case-mbody .topmess{ background:#334259; padding:30px 0px 40px 0px;text-align:center;}
.case-mbody .topmess a,
.case-mbody .topmess a:visited{ color:#fff; font-size:16px; margin:0px 0px 0px 8px;}
.case-mbody h1.title{ color:#fff; font-size:32px; font-weight:normal;}
.case-mbody h2.subtitle{ color:#fff; font-size:18px; font-weight:normal;}

/*最新案例*/
.ow-idx-case{ background:#fafafa; padding:20px 0px 20px 0px;}
.ow-idx-case h2{ font-size:30px; font-weight:normal; padding:0px 0px 10px 0px; text-align:center;}
.ow-idx-case .section{ position:relative; }
.ow-idx-case .section .case-wrapper{ height:500px; overflow:hidden; position:relative; top:0px; left:0px; width:1200px; }
.ow-idx-case .section ul.caselist{ height:460px; padding:0px 0px; overflow:hidden; position:absolute; left:0px; top:0px; width:1200px; z-index:1;}
.ow-idx-case .section ul.caselist li{ background:#fff; float:left; margin:10px 30px 60px 10px; height:440px; width:240px; padding:0px; position:relative; -webkit-box-shadow:0 0 5px 5px rgba(0,0,0,0.05); -moz-box-shadow:0 0 5px 5px rgba(0,0,0,0.05); box-shadow:0 0 5px 5px rgba(0,0,0,0.05); }
.ow-idx-case .section ul.caselist li .tagicon{ display:inline-block; height:60px; width:60px; position:absolute; left:10px; top:10px; z-index:10;}
.ow-idx-case .section ul.caselist li .thumbnail{ background-color:#eee; height:160px; width:240px; text-align:center; overflow:hidden;}
.ow-idx-case .section ul.caselist li .thumbnail img{ width:240px; }
.ow-idx-case .section ul.caselist li .case-item-content{ padding:15px 15px 10px 15px; }
.ow-idx-case .section ul.caselist li h3{ color:#333; font-size:16px; padding:0px 0px 5px 0px; text-align:center; }
.ow-idx-case .section ul.caselist li .summary{ color:#666; height:24px; text-align:center; overflow:hidden;}
.ow-idx-case .section ul.caselist li .mob-qrcode{ text-align:center; padding:5px 50px 0px 50px;}
.ow-idx-case .section ul.caselist li .mob-qrcode .qrcode{}
.ow-idx-case .section ul.caselist li .mob-qrcode img{ background:#fff; border:1px solid #ddd; padding:9px;}
.ow-idx-case .section ul.caselist li .mob-qrcode .view{ display:block; padding-top:5px;}
.ow-idx-case .section ul.caselist li:hover .thumbnail img { transform:scale(1.08,1.08); transition-duration:600ms; transition-timing-function:ease-out; }

.ow-idx-case .prev{ background:url("../images/pic-player-pre-next.png") 0px 0px no-repeat; position:absolute; z-index:2; height:40px; width:32px; left:-60px; top:230px; cursor:pointer;}
.ow-idx-case .prev:hover{ background-position:0px -40px;}
.ow-idx-case .next{ background:url("../images/pic-player-pre-next.png") -32px 0px no-repeat; position:absolute; z-index:2; height:40px; width:32px; right:-60px; top:230px; cursor:pointer;}
.ow-idx-case .next:hover{ background-position:-32px -40px;}

/**侧边**/
.ow-case-sider{ float:left; width:160px; padding-top:40px;}
.ow-case-section{ padding-left:180px;}
.ow-case-sider .case-apply{ padding:25px 0px; text-align:center;}
.ow-case-sider .case-apply .tip{ color:#aaa; font-size:12px; padding-bottom:5px; }
.ow-case-sider a.abtn{ background:#fff; border:1px dotted #ccc; color:#333; display:block; font-size:16px; height:auto; padding:12px 12px;}
.ow-case-sider a.abtn:hover{ border:1px solid #c60000; color:#c60000;}

ul.ow-case-cate{ background:#273c59; padding:0px 0px 0px 0px; zoom:1; overflow:auto;}
ul.ow-case-cate li{ display:inline; padding:0px 0px;}
ul.ow-case-cate li a{ border-bottom:1px solid #505761; display:block; font-size:16px; height:24px; line-height:24px; margin:0px 0px 0px 0px; padding:10px 5px 10px 15px;}
ul.ow-case-cate li a:hover{ background:#182a44; text-decoration:none; }
ul.ow-case-cate li a,
ul.ow-case-cate li a:visited{ color:#fff;}
ul.ow-case-cate li.current a{ border-left:4px solid #d30000; text-decoration:none;}

ul.case-list{ margin:auto; padding:40px 0px 0px 0px;}
ul.case-list li{ background:#fff; float:left; margin:0px 30px 60px 10px; height:500px; width:300px; padding:0px; position:relative; -webkit-box-shadow:0 0 12px 12px rgba(0,0,0,0.05); -moz-box-shadow:0 0 12px 12px rgba(0,0,0,0.05); box-shadow:0 0 12px 12px rgba(0,0,0,0.05); }
ul.case-list li .tagicon{ display:inline-block; height:60px; width:60px; position:absolute; left:10px; top:10px; z-index:10;}
ul.case-list li .thumbnail{ background-color:#eee; height:200px; width:300px; text-align:center; overflow:hidden;}
ul.case-list li .thumbnail img{ width:300px; }
ul.case-list li .case-item-content{ padding:15px 15px 10px 15px; }
ul.case-list li h3{ color:#333; font-size:16px; padding:0px 0px 5px 0px; }
ul.case-list li .summary{ color:#666;}
ul.case-list li .mob-qrcode{ text-align:center; padding:10px 80px 0px 80px;}
ul.case-list li .mob-qrcode .qrcode{}
ul.case-list li .mob-qrcode img{ background:#fff; border:1px solid #ddd; padding:9px;}
ul.case-list li .mob-qrcode .view{ display:block; padding-top:5px;}
ul.case-list li:hover .thumbnail img { transform:scale(1.08,1.08); transition-duration:600ms; transition-timing-function:ease-out; }
.case-mbody .pager{ padding:10px 20px 50px 30px;}


@media (min-width:1500px) {
	.case-mbody .wrapper{ width:1470px!important;}
	.ow-case-section{ padding-left:170px;}
	ul.case-list{}
	ul.case-list li{ margin:0px 0px 60px 25px;}
	.ow-idx-case .section .case-wrapper{ width:1470px; }
}

.case-post{ background:#fff; border:1px solid #eee; font-size:16px; margin:0px 0px 50px 0px; padding:10px 20px; }
.case-header{ background-color:#fff; border-bottom:1px solid #eee; min-height:340px;}
.case-header .wrapper{ padding:20px 0px 25px 0px;}
.case-header .thumbnail{ background:#fff; border:1px solid #ccc; float:left; height:267px; width:400px; margin:10px 20px 10px 0px; padding:5px;}
.case-header h1{ color:#272f3d; font-size:24px; padding:5px 0px;}
.case-header i{ color:#333; margin-right:5px;}
.case-header .website{ font-size:20px; padding:5px 0px;}
.case-header .website a{ color:#007fba; font-size:22px;}
.case-header .website a:hover{ text-decoration:underline; }
.case-header .mob-qrcode{ font-size:20px; padding:5px 0px 0px 0px; position:relative;}
.case-header .mob-qrcode .qrcode{ position:absolute; left:620px; top:10px;}
.case-header .mob-qrcode img{ background:#fff; border:1px solid #ddd; padding:10px;}
.case-header .mob-qrcode .view{ display:block; padding-top:5px;}


.introduce{ background:#fff; border:1px solid #eee; border-top:0; padding:10px 25px;}
.introduce h4{ color:#465167; font-size:16px; font-weight:normal; padding:0px 0px;}
.introduce h4 span{ border-bottom:1px solid #f2f2f2; display:inline-block; padding:2px 0px;}
.introduce .byline{ color:#a3a9b4; font-size:14px padding:5px 0px;}
.introduce .byline span{ display:inline-block; margin:0px 8px 0px 0px; padding:0px 8px 0px 0px;}
.introduce .byline span.views{ border-right:none; }
.introduce .summary{ color:#747d8e; font-size:14px; padding:2px 0px 3px 0px; }

.case-content-section{}
.case-content-gallery{ background-color:#292c32; padding:20px; text-align:center;}
.case-content{ background:#fff; border:1px solid #eee; border-bottom:none; font-size:14px; margin-top:10px; padding:20px;}
.case-content-section .tags{ background:#fff; border:1px solid #eee; border-top:1px dotted #eee; font-size:14px; margin-top:0px; padding:10px 20px;}
.case-content-section .tags a{ margin:0px 5px;}
.case-content-section .prev-next{ background:#fff; border:1px solid #eee; font-size:14px; margin-top:10px; padding:15px 20px;}
.case-content-section .prev-next .prev,
.case-content-section .prev-next .next{ padding:3px 0px;}

.recommend-content{ background:#fff; margin-bottom:20px; }