﻿form,iframe,ul,ol,li{margin:0;padding:0;}
iframe{height:0;width:0;overflow:hidden;}
ul li{box-sizing:border-box;list-style:none;}
a.hot{color:#f00;}
.sechot{background: url("bg-hot.jpg") center top no-repeat;background-size:contain}
.sechot .secM{padding: 20px 0;}
.loading{text-align: center;padding: 5% auto;background: #fff;}
.sotitle{border-bottom:2px solid #006cba;text-align:left;}
.sotitle .bIn{overflow: visible;}
.sotitle h2{display:inline-block;background:#006cba;color:#fff;margin: 0;padding: 5px 90px 5px 20px;font-size:22px;border-radius:5px 5px 0 0}
.sotitle h2 a{color:#fff;}
.sotitle em{font-style:normal;font-size:80%;font-weight:400}
.morelnk {float:right;margin: 15px 0 0 0;}
.morelnk a{border:1px solid #006cba;border-radius: 3px 3px 0 0;padding: 7px 10px;color:#006cba;margin:0 0 0 -1px;background: #fff;}
.morelnk a.hot{color:#f00;}
.morelnk a.cur{background:#006cba;color:#fff}
.rellnks{text-align:left;margin:10px 0 0 2%;}
.piclst {}
.piclst ul{margin:1%;padding:0;}
.piclst li{float:left;width:18%;margin:1%;position:relative;}
.piclst em{display:block;width:100%;height:180px;height:15vw;overflow:hidden;position:relative;}
.piclst img,.piclst video{width:100%;height:180px;height:15vw;object-fit:cover;display:block;}
.piclst a{text-decoration:none;}
.piclst b{display:block;position:absolute;left:0;top:auto;bottom:30px;background:rgba(0,0,0,0.6);width:100%;color:#fff;box-sizing:border-box;padding:5px 10px;font-weight:400;}
.piclst i{float:left;width:50%;line-height:30px;font-style:normal;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;}
.piclst li:hover img,.piclst li:hover video{width:120%;height:240px;height:19vw;margin:-2vw 0 0 -10%;}
.piclst video+span{position:absolute;top:0;right:0;content:" ";width:100%;height:100%;background:url(http://odp.cn/file/play.png) center no-repeat;background-size:30%;opacity:0.5;}
.pager{clear:both;margin-bottom:2%;}
.pager span{display:inline-block;}
.pager a{display:inline-block;margin:5px 3px;border:1px solid #360;border-radius:3px;padding:2px 5px;color:#360;}

#freshIframe{display:none;}
.hotlst{margin: 20px 0;text-align:left;line-height:50px;border:1px solid #eee;background: #fff;counter-reset: zone-counter;}
.olh{background: #303c40;line-height:48px;color:#fff;margin: -1px;}
.olh .olh1{float: left;width:24%;text-align: left;box-sizing: border-box;padding-left: 20px;}
.olh .olh2{float: left;}
.olh .olh3{float: right;margin-right: 20px;}
#sotem{position: relative;overflow: visible;display: inline-block;vertical-align: top;margin: 4px 0 0 3px;z-index: 2;}
.btps{position: absolute;display: inline-block;background: #006cba;padding: 0 25px 0 5px;text-align: right;width: 85px;box-sizing: border-box;}
.btps:after{content: "▼";position: absolute;right:5px;font-size:12px;top:5px}
.btps li{display: none;white-space: nowrap;}
.btps:hover li{display:block;cursor:pointer;}
.btps li.cur{display:block;}
.hotlst ol{clear: both;}
.hotlst ol li{padding:0 20px 0 24%;border-top:1px solid #eee;list-style-type: none;position: relative;}
.hotlst ol a{color:#00c;}
.hotlst ol li:before {
    content: counter(zone-counter);counter-increment: zone-counter;
    display: block;color: #313130;font-size: 18px;line-height: 36px;background: #f8f8f8;
    width: 36px;height: 36px;box-sizing: border-box;text-align: center;
    position: absolute;top:7px;left:18px;border-radius: 50% 50%;overflow: hidden;
}

.hotlst ol li:first-child{border-top:0;}
.hotlst ol li:nth-child(100):before {font-size: 16px;}
.hotlst ol li:hover{background:#e2e7f3}
.hotlst ol li:hover a{color:#00f;}
.hotlst ol i{float:right;font-size:12px;color:#c00;}

.hot-11 ol li:nth-child(-n+11):before {background: #006cba;color:#fff;}


.hot-3 ol li:nth-child(-n+3):before{
    background: url(icon-hot.png) 0 0 no-repeat;border-radius:0;width: 52px;height: 40px;text-indent: -99px;top:4px;left:10px;
}
.hot-3 ol li:nth-child(2):before {
    background-position: 0 -100px;
}
.hot-3 ol li:nth-child(3):before {
    background-position: 0 -200px;
}





.hot-11 ol li:nth-child(1):before {
    background: url(icon-hot1.png) 0 0 no-repeat;border-radius:0;width: 52px;height: 40px;text-indent: -99px;top:4px;left:10px;
}

.ctip{color:#360;font-size:12px;vertical-align:bottom}
.actnum{text-align:center;font-size: 14px;color:#666;font-style: italic;}
.actnum i{color:#360;font-size: 13px;}
.duringbox{float:right;margin: 6px 10px 0 0;line-height: 0;font-size: 0;}
.duringbox a{cursor:pointer;font-size:14px;padding: 0 4px;vertical-align:middle;box-sizing: border-box;border: 1px solid #ccc;line-height: 24px;margin-right: -1px;display: inline-block;background: #fff;}
.duringbox a.cur{background:#ddd;color:#000;}
.dtpickerinput{width:96px;font-size: 14px;line-height: 24px;margin: 7px -1px 7px 0;box-sizing: border-box;border: 1px solid #ccc;color: #333;text-align:center;vertical-align: middle;}
#DuringBtn{box-sizing:border-box;background:#eee;border: 1px solid #ccc;padding: 0 8px;font-size: 14px;line-height: 24px;vertical-align:middle;}
@media only screen and (max-width: 800px) {
body {-webkit-text-size-adjust: none;}
.sechot {background-size: 240%;background-position: 15% top;}
.sechot .secM{padding: 5px 0;}
.sotitle{margin-top:0;line-height: 0;font-size: 0;height: 38px;box-sizing: border-box;margin-bottom: 28px;}
.sotitle h2{font-size: 17px;line-height: 30px;padding: 3px 65px 3px 5px;margin: 0 0 0 5px;box-sizing: border-box;max-width: calc(100vw - 140px);white-space: nowrap;text-overflow: ellipsis;}
#sotem{margin:1px}
.btps{width:65px;}
.btps:after{top:0;}
.morelnk{font-size: 14px;line-height:24px;margin: 10px 5px -1px 0;}
.morelnk a{padding:4px 5px 3px 5px;box-sizing: border-box;border-bottom: 0;line-height: 18px;display: inline-block;}
.piclst li{width:48%;margin:1%;font-size:14px;}
.piclst em{height:40vw;}
.piclst img,.piclst video{height:40vw;}
.piclst li:hover img,.piclst li:hover video{width:120%;height:50vw;margin:-5vw 0 0 -10%;}
.hotlst{margin: 2px;}
.duringbox{margin: 0 2px;float: none;position:relative;z-index: 1;}
.dtpickerinput{width: calc((100vw - 161px) / 2 );margin: 5px -1px 5px 0;}
#DuringBtn{position:absolute;right:0;top:5px;}
}

@media only screen and (max-width:500px) {
.piclst li{width:98%;}
.piclst em{height:80vw;}
.piclst img,.piclst video{height:80vw;}
.piclst li:hover img,.piclst li:hover video{width:120%;height:100vw;margin:-10vw 0 0 -10%;}
}
@media only screen and (max-width:320px) {
.sotitle h2{font-size:14px;}
.btps{width: 45px;padding: 0 15px 0 2px;}
.btps:after{font-size:9px;right: 2px;}
.morelnk{font-size: 12px;}
.actnum{font-size: 12px;}
.actnum i{font-size: 12px;}
.dtpickerinput{font-size:12px;}
}