html,body {height: 100%;overflow: hidden;}
body {min-width: 600px;}

/* 头部 */
.header {background: #fbfbfb; border-bottom: 2px solid #dedede; height: 48px; line-height: 48px; position: relative; z-index: 2;}
.full .header {display: none;}
.header .crumbs {float: left; height: 48px; padding-left: 20px; font-size: 14px;}
.header .crumbs a {color: #00bb50; text-decoration: none; }
.header .crumbs span {color: #636363; font-family: 'simsun'; padding: 0 5px; }
.header .btn_list {position: absolute;right:0;top:0;margin-top: 10px; height: 28px; line-height: 28px; text-align: center; z-index: 10;}
.openSide .header .btn_list {right:280px;}
.header .btn_list ul {position: absolute;right: 0;top:0;width: 356px;}
.header .btn_list ul li {background-color: #f2f2f2; border-radius: 2px; border: 1px solid #dedede; float: right; margin-right: 10px; white-space: nowrap; width: auto; _width: 1%; }
.header .btn_list ul li a {color: #666; display: block; height: 26px; line-height: 26px; padding: 0 14px 0 30px; text-decoration: none;}
.header .btn_list ul li.scale {border: none; line-height: 28px; }
.header .btn_list ul li.scale span {border: 1px solid #dedede; color: #666; cursor: pointer; float: left; font-size: 26px; height: 27px; line-height: 24px; overflow: hidden; -webkit-user-select: none; width: 26px; }
.header .btn_list ul li.scale .add {border-top-left-radius: 2px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 2px; }
.header .btn_list ul li.scale .scale_num {-webkit-appearance: none; background: #f2f2f2; border-left: none; border-right: none; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; color: #666; float: left; height: 27px; line-height: 27px; outline: none; padding: 0; text-align: center; width: 50px; }
.header .btn_list ul li.scale .dec {border-top-left-radius: 0; border-top-right-radius: 2px; border-bottom-right-radius: 2px; border-bottom-left-radius: 0; }
.header .btn_list ul li a, .header .mycollect, .thumb .tbtn a {background-image:url('../images/detail_icon.png'); background-repeat: no-repeat; }

.header a:hover, .header .btn_list a:hover {color: #00bb50;}
.header .btn_list li {position: relative;}
.header .btn_list .collect a {background-position: 7px -900px;}
.header .btn_list .shear a {background-position: 7px -144px;}
.header .btn_list .full a {background-position: 7px -270px;}
.header .btn_list .shear a:hover {background-position: 7px -585px;}
.header .btn_list .full a:hover {background-position: 7px -711px;}
.header .btn_list .sub_list {position: absolute; background-color: #f2f2f2; border: 1px solid #bfbfbf; left: -1px; top: 27px; width: 68px; display: none; }
.header .btn_list li:hover .sub_list {display: block;}
.header .btn_list .sub_list li {background-color: #f2f2f2; border-radius: 2px; border: 1px solid #dedede; margin-right: 10px; white-space: nowrap; width: auto; height: 39px; float: none; border:0; margin-right: 0; _width: 1%; }
.header .btn_list .sub_list li a {display: block; width: 68px; height: 39px; line-height: 90px; padding:0; overflow: hidden; text-indent: -999em; background-image: url('../images/shear.png'); background-repeat: no-repeat; }
.header .btn_list .sub_list li a:hover {background-color: #e9e9e9;}

#shareList .weibo {background-position: 0 -4px;}
#shareList .tweibo {background-position: 0 -42px;}
#shareList .qzone {background-position: -1px -86px;}
#shareList .renren {background-position: -1px -126px;}
#shareList .douban {background-position: -1px -164px;}


.header .right-btn {float: right;width: 280px;display: none;}
.openSide .header .right-btn {display: block;}
.header .right-btn .spe {color: #666;}
.header .login-before a {height: 28px;line-height: 28px;}
.header .login:hover {background-position: 0 -114px;}
.header .right-btn .login-before, .header .right-btn .login-after {float: right;padding-right: 20px;}
.header .login {display: inline-block;width: 28px;padding-left: 32px;background-position: 0 -76px;}
.header .mycollect {display: inline-block;height: 24px;background-color: #f2f2f2; background-position: 7px -81px; border: 1px solid #dedede; height: 26px; line-height: 26px; padding-right: 14px;padding-left: 32px;}
.header .collect a:hover, .header .mycollect:hover {background-position: 7px -522px;text-decoration: none;}
.header .login {background-image:url('../images/detail_user.png'); background-repeat: no-repeat; }

/* 主体 */
.content {position: absolute;left:0;top:50px;bottom:0;width: 100%;background-color: #fff;z-index: 1;}
.full .content {top:0;}

.content .sidebar {position: absolute;right:-272px;top:0;bottom:0;width: 280px;background: #f2f2f2;transition: right .3s;z-index: 2;}
.full .content .sidebar {display: none;}
.openSide .content .sidebar {right: 0;}
.content .sidebar .toggleSide {position: absolute;left:0;top:0;width: 8px;height: 100%;transition:all .3s;}
.content .sidebar .toggleSide:hover {background: #ddd;}
.content .sidebar .sideInner {position: relative;margin: 20px 12px;background:#f2f2f2;z-index: 2;}
.content .side_top {margin-bottom: 15px;}
.content .side_top .title {font-size: 16px;}
.content .side_top .page {float: left;margin-right: 20px;color: #333;font-weight: 400;}
.content .side_top .page b, .content .side_top a:hover {color: #00bb50;}
.content .side_top p {margin:10px 0;color: #666;}
.content .side_top p .spe {padding:0 10px;}
.content .side_about {padding-top: 15px;border-top: 1px solid #dedede;}
.content .side_about h4 {margin-bottom: 5px;color: #333; font-size: 14px; font-weight: 400; line-height: 28px;}
.content .side_about ul li {width: 115px;float: left;margin:0 10px 10px 0;}
.content .side_about ul li img {width: 115px; height: 115px; display: block;}

.content .inside {position: absolute;top:0;left:0;bottom:0;right:5px;border-right: 1px solid #dedede;transition:right .3s;z-index: 1;}
.openSide .content .inside {right: 280px;}
.full .content .inside {right: 0;border-right: none;}
body.tran0 .content .inside {margin-right: 0;transition:right 0s;}
#slide{position:relative;height:500px;margin:0 auto;padding:6px;box-shadow:inset 0 0 10px rgba(0,0,0,.1);background:#fff;z-index:2;overflow:hidden;}

.inside .innerbox {height: 100%;overflow: hidden;zoom: 1;}
.full .inside .innerbox {background:#000;}
.inside .bigimgbox {position: absolute;top:0;bottom:30px;width: 100%;overflow: hidden;}
.bigimgbox.bgload {background:url('../images/ajax-loader.gif') center no-repeat;}
.inside .bigimgbox.showThumb {bottom:140px;}
.inside .bigimgbox.btmtran03 {transition:bottom .3s;}
.full .inside .bigimgbox {bottom:0;}
.inside .bigimgbox .imgbox {position: absolute;top:0;bottom:0;left:0;right:0;text-align: center;}
.inside .bigimgbox .imgbox .compatible {height: 100%;transition:height .3s;}
body.tran0 .inside .bigimgbox .imgbox .compatible {transition:height 0s;}
.inside .bigimgbox .imgbox i {display: inline-block;height: 100%;vertical-align: middle;}
.inside .bigimgbox .imgbox img {display: inline;vertical-align: middle;}
.inside .bigimgbox .imgbox.init img {max-width:100%;max-height:100%;}
.thumb {position: absolute;bottom:0;width: 100%;background:#f2f2f2;}
.full .thumb {display: none;}
.thumb .tbtn {height: 30px;line-height: 30px;}
.thumb .tbtn .btnul {float: right;}
.thumb .tbtn .btnul li{background-color: #f2f2f2; border-radius: 2px; border: 1px solid #dedede; float: left; margin-right: 10px; white-space: nowrap;}
.thumb .toggleThumb {color: #666; display: block; height: 26px; line-height: 26px; padding: 0 14px 0 30px; text-decoration: none;background-position: 7px -332px;}
.thumb .toggleThumb.show {background-position: 7px -397px;}
.thumb .toggleThumb:hover {color: #00bb50;background-position: 7px -773px;}
.thumb .toggleThumb.show:hover {background-position: 7px -838px;}

.thumblist {height: 110px;text-align: center;}
.preview {display: inline-block;visibility: hidden;}

.thumblist .scrollWrap {position: relative;width: 570px;overflow: hidden;}
.thumblist .listul {position: relative;height: 84px;margin: 0 0;overflow: hidden;}
.thumblist .listul li {float: left;width: 95px;height: 80px;margin-bottom: 10px}
.thumblist .listul li img {width: 80px; height: 76px; border:2px solid #f2f2f2; }
.thumblist .listul li.curr img {border: 2px solid #4eb51b; box-shadow: 0 0 2px rgba(0,0,0,0.3); }
.preview .arrow-left {background: url(../images/feel3.png) no-repeat left top; position: absolute; left: -20px; top: 50%; margin-top: -9px; width: 9px; height: 18px; z-index: 10; }
.preview .arrow-right {background: url(../images/feel4.png) no-repeat left bottom; position: absolute; right: -20px; top: 50%; margin-top: -9px; width: 9px; height: 18px; z-index: 10; }
.preview .arrow-left.disabled, .preview .arrow-right.disabled {opacity: .4;filter:alpha(opacity=40);cursor: default;}
.preview {margin-top: 10px; position: relative; }
.bigimgbox .btn {display: block; height: 60%; position: absolute; top: 20%; width: 58px; z-index: 20; }
.bigimgbox .large_prev {left:0;}
.bigimgbox .large_next {right:0;}
.bigimgbox .btn span {border-radius: 2px 0 0 2px; cursor: pointer; display: block; height: 35px; left: 0; margin-top: -37px; overflow: hidden; padding: 20px; position: relative; text-indent: -999em; top: 50%; width: 18px; _zoom: 1; }
.bigimgbox .large_prev span{background-position: 20px -37px;}
.bigimgbox .large_next span{background-position: -30px -37px;}
.bigimgbox .large_prev.disabled span {background-position: 20px 19px;opacity:.5;filter:alpha(opacity=50);cursor: default;}
.bigimgbox .large_next.disabled span {background-position: -30px 19px;opacity:.5;filter:alpha(opacity=50);cursor: default;}
.bigimgbox .btn span {background-image:url('../images/scroll_btn.gif');background-repeat: no-repeat;}
.bigimgbox .btn:hover span {background-color: #f2f2f2;}
.inside .close {display: none;position: absolute; right: 0; top: 0; width: 20px;height: 20px;padding: 10px 20px 10px 30px;background:url('../images/close.png') center no-repeat;opacity: 0.6; filter: alpha(opacity=60); z-index: 20;}
.full .inside .close {display: block;}
.inside .close:hover {opacity: 1; filter: alpha(opacity=100);}
.imgmapbox {position: absolute;left:0;top:0;width:152px;height: 152px;background:rgba(0,0,0,0.4);border:1px solid #333;z-index: 10;}
.imgmapbox i {display: inline-block;height: 100%;vertical-align: middle;}
.imgmapbox img {display: inline;max-width:152px;max-height:152px;vertical-align: middle;}
#dragbox {position: absolute;top:0;bottom: 0;left:0;right:0;}
