.imagedetail{padding:60px 0; background:#fff;}
.imagedetail-content{display:block;}
.imagedetail-info{margin:20px 0 30px 0; padding-bottom:10px; border-bottom:1px solid #e8e8e8; color:#808080;}
.imagedetail-info>b{font-weight:normal;}
.imagedetail-info>i{font-style:normal; padding-right:18px;}
.imagedetail-info>i>a{color:#808080;}
.imagedetail-info>i>a:hover{color:#0062be;}

.imagedetail-swiper{overflow:hidden; position:relative; margin-bottom:28px; border-radius:5px;}
.imagedetail-outer{width:10000%; display:flex; align-items:flex-start;}
.imagedetail-item{float:left; width:1%;}
.imagedetail-item img{max-width:100%; margin:0 auto; display:block;}
.imagedetail-item b{display:block; margin-top:16px; font-size:18px; color:#fff;}
.imagedetail-prev,
.imagedetail-next{position:absolute; z-index:8; top:50%; width:38px; height:38px; line-height:38px; border-radius:3px; 
text-align:center; margin-top:-18px; background:rgba(0,0,0,0.28); cursor:pointer; opacity:0; transition:0.3s;}
.imagedetail-swiper:hover .imagedetail-prev,
.imagedetail-swiper:hover .imagedetail-next{opacity:1;}
.imagedetail-prev i,
.imagedetail-next i{color:#fff; font-size:28px; line-height:inherit;}
.imagedetail-prev:hover,
.imagedetail-next:hover{background:#0062be;}
.imagedetail-prev{left:0;}
.imagedetail-next{right:0;}
.imagedetail-param{display:block; margin-top:18px;}
.imagedetail-param>dl+dl{margin-top:8px;}
.imagedetail-param>dl:after{display:block; content:''; clear:both;}
.imagedetail-param>dl>dt{float:left; color:#808080;}
.imagedetail-param>dl>dd{float:left;}
.imagedetail-content>aside{padding-bottom:38px;}
.imagedetail-content>aside>p+p{margin-top:8px;}
.imagedetail-content>dir{text-align:left; border-top:1px solid #e8e8e8; padding:12px 0;}
.imagedetail-content>dir>dl{padding:6px 0;}
.imagedetail-content>dir>dl:after{display:block; content:''; clear:both;}
.imagedetail-content>dir>dl>dt{float:left; margin-right:8px;}
.imagedetail-content>dir>dl>dt>b{font-weight:normal; color:#989898;}
.imagedetail-content>dir>dl>dd{float:left;} 
.imagedetail-content>dir>dl>dd>i{font-style:normal;}
.imagedetail-tags{padding:0 0 18px 0;}
.imagedetail-tags>a{display:inline-block; border:1px solid #eee; padding:8px 18px; background:rgba(0,0,0,.01); border-radius:3px;}
.imagedetail-tags>a:hover{color:#fff; background:#0062be;}
.imagedetail-comment{padding-top:28px;}

.imagedetail-recom{padding:15px 0 0;}
.imagedetail-recom h2{text-align: center; font-size: 32px;}
.imagedetail-recom li{display:block; position:relative; z-index:2; overflow:hidden; border-bottom:1px solid #eee; padding:10px 0;}
.imagedetail-recom li a{display: block;}
.imagedetail-recom li a:after{display:block; content:''; clear:both;}
.imagedetail-recom li h4{float: left; font-weight:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.imagedetail-recom li u{float: right; display:block; text-decoration:none; color:#989898;}
@media(max-width:1199px){
.imagedetail{padding:40px 0;}
.imagedetail-recom h2{font-size:28px;}
}
@media(max-width:767px){
.imagedetail{padding:20px 0;}
.imagedetail-info{margin:12px 0 18px 0;}
.imagedetail-swiper{margin-bottom:18px;}
.imagedetail-content>h1{font-size:20px;}
.imagedetail-content>aside{padding-bottom:18px;} 
.imagedetail-recom h2{font-size:22px;}
}