/*main CSS*/
 
 #pictureViewer {
     width: 100%;
     height: 100%;
     position: fixed;
     top: 0;
     left: 0;
     /*  background-color: rgba(0,0,0,.3); */
     z-index: 10000;
 }
 
 #pictureViewer>.content {
     background-color: #fff;
     position: absolute;
     width: 725px;
     height: 755px;
     margin: auto;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     z-index: 200;
 }
 
 #pictureViewer .menu-bar {
     width: 100%;
 }
 
 #pictureViewer .menu-bar .handel {
     width: 40px;
     height: 40px;
     float: right;
     background-repeat: no-repeat;
     background-position: 50%;
     cursor: pointer;
 }
 
 #pictureViewer .menu-bar .handel:hover {
     background-color: #156DA4;
     -webkit-transition: all .3s;
     -moz-transition: all .3s;
     -ms-transition: all .3s;
     -o-transition: all .3s;
     transition: all .3s;
 }
 
 #pictureViewer .menu-bar .handel.maximization {
     background-image: url(../images/icons/maximization_black.png);
     background-size: 14px;
     display: none !important;
 }
 
 #pictureViewer .menu-bar .handel.maximization:hover {
     background-image: url(../images/icons/maximization_white.png);
 }
 
 #pictureViewer .menu-bar .handel.miniaturization {
     background-size: 16px;
     background-image: url(../images/icons/miniaturization_black.png);
 }
 
 #pictureViewer .menu-bar .handel.miniaturization:hover {
     background-image: url(../images/icons/miniaturization_white.png);
 }
 
 #pictureViewer .menu-bar .handel.close-view {
     background-image: url(../images/close_black.png);
     background-size: 15px;
     position: absolute;
     right: 0;
     top: 0;
     z-index: 301;
     display: none !important;
 }
 
 #pictureViewer .menu-bar .handel.close-view:hover {
     background-image: url(../images/icons/close_white.png);
 }
 
 #pictureViewer .handel-prev,
 #pictureViewer .handel-next {
     display: inline-block;
     width: 50px;
     height: 70px;
     /*position: relative;*/
     position: fixed;
     top: calc(50% - 80px);
     background-repeat: no-repeat;
     background-size: 25px;
     background-position: 50%;
     cursor: pointer;
     -webkit-transition: all .3s;
     -moz-transition: all .3s;
     -ms-transition: all .3s;
     -o-transition: all .3s;
     transition: all .3s;
 }
 
 #pictureViewer .handel-prev {
     background-image: url(../images/prev_blank.png);
     z-index: 100;
     left: 1.5em;
 }
 
 #pictureViewer .handel-next {
     background-image: url(../images/next_blank.png);
     right: 1.5em;
     z-index: 100;
 }
 
 #pictureViewer .handel-prev:hover,
 #pictureViewer .handel-next:hover {
     background-color: #156DA4;
 }
 
 #pictureViewer .handel-prev:hover {
     background-image: url(../images/prev_white.png);
 }
 
 #pictureViewer .handel-next:hover {
     background-image: url(../images/next_white.png);
 }
 
 #pictureViewer .picture-content {
     display: inline-block;
     width: 100%;
     padding-left: 25px;
     padding-top: 30px;
     padding-right: 25px;
     height: calc(100% - 40px);
     position: absolute;
     margin: 0 auto;
     left: 0;
     right: 0;
 }
 
 #pictureViewer .picture-content .cover {
     display: block;
     float: none;
     margin: 0 auto;
     padding: 1em;
 }
 
 #pictureViewer .picture-content .pdes {
     display: block;
     width: 100%;
     padding-top: 1em;
     text-align: center;
     line-height: 2;
     padding-left: 1em;
     padding-right: 1em;
 }
 
 .pvbody {
     width: 256px;
     float: right;
     height: 100%;
     background: #fff;
 }
 
 .pvbody h3 {
     width: 100%;
     height: 35px;
     text-align: center;
     line-height: 35px;
     margin-top: 0px !important;
     padding-left: 0.2em;
     padding-right: 0.2em;
 }
 
 #pictureViewer .counter {
     position: absolute;
     bottom: 0;
     height: 37px;
     line-height: 37px;
     display: none;
     width: 100%;
     text-align: center;
     color: #808080;
     font-size: 13px;
 }
 
 #pictureViewer .hide {
     display: none;
 }
 
 #pictureViewer .left {
     float: left;
 }
 
 #pictureViewer .right {
     float: right;
 }
 
 #pictureViewer .clear-flex {
     clear: both;
 }
 /*txiaof*/
 
 #pictureViewer img {
     max-width: 405px;
     max-height: 675px;
 }
 
 .picture-content .left_image {
     background: #fff;
     float: left;
     width: 405px;
     height: 100%;
 }
 
 .pvbody {
     position: relative;
 }
 
 #bdown {
     position: absolute;
     bottom: 1em;
     right: 2em;
     background: url(../images/download_bimg.png);
     width: 32px;
     height: 32px;
     display: block;
     background-size: 100% auto;
 }
 
 #bdown>img {
     display: none;
 }
 
 #sxlist>.item span {
     display: none;
 }
 
 @media screen and (max-width:1600px) {
     #pictureViewer>.content {
         height: 95%;
     }
     #pictureViewer img {
         max-width: 95%;
         max-height: 100%;
     }
 }
 
 @media screen and (max-width:1440px) {
     #pictureViewer>.content {
         max-width: 670px;
         height: 90%;
     }
     .picture-content .left_image {
         max-width: 355px;
     }
     #pictureViewer .picture-content .pdes {
         padding-top: 1em;
     }
     .pvbody h3 {
         height: 25px;
         line-height: 25px;
         font-size: 20px;
     }
 }
 
 @media screen and (max-width:1366px) {
     #pictureViewer>.content {
         height: 90%;
     }
     #pictureViewer img {
         max-width: 80%;
     }
 }
 
 @media screen and (max-width:1280px) {
     #pictureViewer>.content {}
 }
 
 @media screen and (max-width:525px) {
     .pvbody table {
         vertical-align: top !important;
     }
     .pvbody h3 {
         margin: 5px auto !important;
         margin-top: 0px !important;
     }
     #pictureViewer img {
         max-height: 350px;
     }
     #pictureViewer>.content {
         max-width: 100%;
         height: 95%;
     }
     #pictureViewer .picture-content {
         height: 100%;
         padding-bottom: 1em;
         width: 96%;
         background: #fff;
     }
     #pictureViewer .picture-content .cover {
         max-height: 100%;
     }
     .picture-content .left_image {
         float: none;
         height: 100%;
         max-width: 100%;
     }
     .pvbody {
         width: 100%;
         height: auto;
         float: left;
         left: 0px;
         position: absolute;
         bottom: 0.0em;
         background: rgba(0, 0, 0, 0.55);
         color: #fff;
         padding: 0.75em 0px;
         min-height: 117px;
     }
     #sxlist>.item {
         margin-bottom: 1.5em !important;
     }
     #pictureViewer .handel-prev,
     #pictureViewer .handel-next {
         z-index: 9999 !important;
         width: 35px;
         height: 40px;
         top: calc(50% - 40px);
     }
     #bdown {
         right: 0em;
         width: 26px;
         height: 26px;
         bottom: 0px;
         background: none;
     }
     #bdown img {
         display: block;
         margin: 0 auto;
     }
     #pictureViewer .handel-prev {
         background-image: url(../images/prev_blank.png) !important;
     }
     #pictureViewer .handel-next {
         background-image: url(../images/next_blank.png) !important;
     }
     #pictureViewer .handel-prev,
     #pictureViewer .handel-next {
         background-color: transparent !important;
     }
     #pictureViewer .handel-prev:hover,
     #pictureViewer .handel-next:hover {
         background-color: transparent;
     }
     #pictureViewer .handel-prev:hover {
         background-image: url(../images/prev_blank.png);
     }
     #pictureViewer .handel-next:hover {
         background-image: url(../images/next_blank.png);
     }
     #pictureViewer .handel-prev {
         left: 0.5em;
     }
     #pictureViewer .picture-content .pdes {
         padding-top: 0px;
     }
     #pictureViewer .handel-next {
         right: 0.5em;
     }
     #pictureViewer .picture-content {
         padding-top: 10px;
         padding-left: 10px;
         padding-right: 10px;
         overflow: hidden !important;
     }
     #pictureViewer .picture-content .pdes {
         line-height: 1.75;
         font-size: 13px;
         padding-left: 1.75em;
         padding-right: 1.75em;
     }
     #pictureViewer .menu-bar .handel.close-view {
         display: block !important;
         background-color: none !important;
         right: 0.5em;
     }
     #pictureViewer .menu-bar .handel.close-view {
         background-image: url(../images/close_black.png);
     }
     .pvbody h3 {
         font-size: 16px;
         height: auto;
         line-height: auto;
         margin-top: 0px;
     }
     #pictureViewer .menu-bar .handel {
         width: 38px;
         height: 38px;
     }
     #pictureViewer img {
         max-width: 86%;
     }
     #pictureViewer .picture-content .cover {
         padding: 0px;
     }
 }