@charset "utf-8";
div.slideBox { position: relative; width: 500px; height: 300px;overflow: hidden; }
div.slideBox ul.slider { position: absolute; float: left; background: 0 0; list-style: none; padding: 0; margin: 0 }
div.slideBox ul.slider li { float: left; background: 0 0; list-style: none; padding: 0; margin: 0;width: 100%;height: 100%; overflow: hidden;position: relative }
div.slideBox ul.slider li a { float: left; line-height: normal !important; padding: 0 !important; border: 0;display: block;width: 100%;height: 100%; }
div.slideBox ul.slider li a img { margin: 0 !important; padding: 0 !important; display: block; border: 0 ;width:100%; height:100%;}
div.slideBox div.tips { position: absolute; bottom: 0; width: 100%; height: 50px; background-color: #000; overflow: hidden;background: linear-gradient(0deg, rgba(0,0,0,0.4), rgba(0,0,0,0)); }
div.slideBox div.tips div.title { position: absolute; left: 0; top: 0; height: 100% }
div.slideBox div.tips div.title a { color: #fff; font-size: 18px; line-height:40px;padding-top: 10px;display:inline-block; margin-left: 10px; text-decoration: none;font-weight: bold; }
div.slideBox div.tips div.title a:hover { text-decoration: underline !important }
div.slideBox div.tips div.nums { position: absolute; right: 0; top: 5px; height: 100% }
div.slideBox div.tips div.nums a { display: inline-block; float: left; width: 20px; height: 20px; background-color: rgba(255,255,255,0.7);*background-color: #fff; text-indent: -99999px; margin: 15px 10px 0 0 }
div.slideBox div.tips div.nums a.active { background-color: orange }

#photo .slideBox, #photo .slideBox img{width:300px;height:200px;}
#photo .slideBox span{display: block;position: absolute;z-index: 11;top:165px;color:#FFF;font-size: 0.6rem;left:10px;width:200px;}
div.slideBox div.tips div.nums a{width:15px;height:15px;margin-top: 20px;}
@media only screen and (min-width:1250px) {
	div.slideBox{width: 630px; height: 378px;}
}

@media only screen and (min-width:960px) and (max-width: 1249px) {
    div.slideBox{width: 50vw; height: 30vw;}
}
@media only screen and (max-width:959px) {
    #photo .slideBox span{width: calc(100vw - 20px); top: calc(60vw - 30px);}
    #photo .inner{padding-left: 0;padding-right: 0;}
	div.slideBox div.tips{}
	div.slideBox div.tips div.title a{height:30px;padding-top:20px;line-height:30px;}
	div.slideBox,div.slideBox ul.slider li a, div.slideBox img,#photo .slideBox img{width:100vw;height:60vw;}
	div.slideBox div.tips div.nums {height:5px;width: 100%;text-align: center;top:0px;}
	div.slideBox div.tips div.nums a{float: none;width:10px;height:5px;border-radius: 1px}
}
@media only screen and (min-width:640px) and (max-width:959px) {
    #photo .slideBox, #photo .slideBox img, #photo div.slideBox ul.slider li a{width: calc(50vw - 20px); height: calc(33.33vw - 14px);max-width: 50vw}
    #photo .slideBox span{width: calc(50vw - 20px); top: calc(33.33vw - 45px);}
}