/*产品放大镜*/
.bg { width: 100%; height: 510px; margin: 0 auto;overflow: hidden;  box-sizing: border-box; background: #fff; position:relative;z-index:0;}
.bg_left { width: 100%; height: auto; float: left }
.bg_right { float: left ;}
.bg_right .market { margin-left: 60px; float: left; width: 500px; }
.showx { width: 100%; height: 430px; margin-bottom: 10px; position: relative; border: 1px solid #E8E8E8; cursor: move;overflow: hidden;}
.showx img { width: 100%; height: 430px; }
.mask { width: 143px; height: 143px; background: #000; filter: Alpha(opacity=50); opacity: 0.5; position: absolute; top: 0; left: 0; display: none; }
.bigshow { width: 100%; height: 430px; overflow: hidden; margin-left: 10px; display: none; border: 1px solid #E8E8E8; position: relative; top: -512px; left: -100px; }
.bigshow img { width: 1290px; height: 1290px; margin-right: 10px; }
.smallshow { width: 100%; height: 70px; position: relative }
.smallshow img { width: 100%; border: 1px solid #e8e8e8; box-sizing: border-box; transition: all 0.5s }
.smallshow > .middle_box { margin-left: 30px; margin-right: 30px; width: 370px; overflow: hidden; height: 70px; }
.smallshow .middle { overflow: hidden; transition: all 0.5s; height: 70px; }
.smallshow .middle > li { width: 64px; height: 64px; float: left; cursor: pointer; padding: 0 5px; }
.smallshow > p { position: absolute; top: 50%; width: 22px; height: 32px; margin-top: -16px; }
.smallshow > .prev { left: 0; background: url(../images/hover-prev.png) no-repeat; transition: all 0.5s }
.smallshow > .next { right: 0; background: url(../images/hover-next.png) no-repeat; transition: all 0.5s }
.smallshow > .prev.prevnone { left: 0; background: url(../images/prev.png) no-repeat; cursor: not-allowed }
.smallshow > .next.nextnone { right: 0; background: url(../images/next.png) no-repeat; cursor: not-allowed }
#detail_video {height:430px;}
.bg_photo{float:left;width:180px;border:1px red solid;height:430px;}

.rightphoto {float: right; width: 160px; height: 500px; }
.rightphoto .tit { font-size: 18px; color: #4b4b4b; margin-bottom: 10px; line-height: 30px; text-align:center; }

.pdt-left { width: 88px; position: relative; overflow: hidden; height: 465px; margin:0 auto;}
.pdt-left .prev2, .pdt-left .next2 { position: absolute; left: 0; width: 88px; top: 0; line-height: 25px; color: #fff; font-size: 14px; background: rgba(0, 0, 0, 0.5); z-index: 9; text-align: center; opacity: 0; transition: all .5s ease; }
.pdt-left .next2 { top: auto; bottom: 0; }
.pdt-left:hover .prev2,  .pdt-left:hover .next2 { opacity: 1; }
.pdt-left .bd { width: 88px; float: left; height: 465px; }
.pdt-left .bd li { margin-bottom: 6px; cursor: pointer; }
.pdt-left .bd li.on .img { border-color: #01b997; }
.pdt-left .bd .img { display: block; text-align: center; width: 88px; height: 88px; box-sizing: border-box; border: 1px solid #c9c9c9; }
.pdt-left .bd .img img { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: middle; }
.pdt-left .bd .img:after { content: ''; height: 100%; display: inline-block; vertical-align: middle; }
.pdt-left .big-img { box-sizing: border-box; float: right; display: block; text-align: center; width: 465px; height: 465px; border: 1px solid #c9c9c9; }
.pdt-left .big-img img { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: middle; }
.pdt-left .big-img:after { content: ''; height: 100%; display: inline-block; vertical-align: middle; }


.insidedetail{margin-top:10px;}
.insidedetail .nav {width:400px;margin:0 auto;padding-bottom:50px;}
.insidedetail .nav ul { list-style-type: none; }
.insidedetail .nav li { display: inline; float: left; width: 100px; height: 30px; line-height: 30px; text-align: center; margin-right: 30px; font-size: 16px; }
.insidedetail .nav li:hover { border-bottom: 1px #01b997 solid; }
.insidedetail .nav li a:hover{color:#01b997;}

.detail img {max-width:100%;height:auto; }
.spec img { max-width: 100%; height: auto; }
.pack img { max-width: 100%; height: auto; }

.elselist .tit{font-size:36px;line-height:80px;text-align:center;color: #33615f;}

/* 产品放大镜视频播放 */
.click_video{
    position: absolute;
    top: 85%;
    left: 10%;
    width: 50px;
    height: 50px;
    margin: -25px 0 0 -25px;
    background: url(../images/main-circles.png) 0 -55px no-repeat;
    z-index: 999;
}
.click_video:hover{
    background: url(../images/main-circles.png) -55px -55px no-repeat;
}
.popup_video{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    background-color: #000000;
    z-index: 9999;
    display: block;
    overflow: hidden;
}
.popup_video video{
    z-index: 9;
}
.close_video{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 18px;
    height: 18px;
    z-index: 99;
    background-image: url(../images/close_video.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    overflow: hidden;
}
@media only screen and (max-width: 960px){
	
	/*产品放大镜*/
.bg { width: 100%; height: 300px; margin: 0 auto;overflow: hidden;  box-sizing: border-box; background: #fff; position:relative;z-index:0;}
.bg_left { width: 100%; height: 220px; float: left }
.bg_right { float: left ;}
.bg_right .market { margin-left: 60px; float: left; width: 220px }
.showx { width: 100%; height: 220px; margin-bottom: 10px; position: relative; border: 1px solid #E8E8E8; cursor: move;overflow: hidden;}
.showx img { width: 100%; height: 220px; }
.mask { width: 143px; height: 143px; background: #000; filter: Alpha(opacity=50); opacity: 0.5; position: absolute; top: 0; left: 0; display: none; }
.bigshow { width: 100%; height: 220px; overflow: hidden; margin-left: 10px; display: none; border: 1px solid #E8E8E8; position: relative; top: -512px; left: -100px; }
.bigshow img { width: 1290px; height: 1290px; margin-right: 10px; }
.smallshow { width: 100%; height: 70px; position: relative }
.smallshow img { width: 100%; border: 1px solid #e8e8e8; box-sizing: border-box; transition: all 0.5s }
.smallshow > .middle_box { margin-left: 30px; margin-right: 30px; width: 370px; overflow: hidden; height: 70px; }
.smallshow .middle { overflow: hidden; transition: all 0.5s; height: 70px; }
.smallshow .middle > li { width: 64px; height: 64px; float: left; cursor: pointer; padding: 0 5px; }
.smallshow > p { position: absolute; top: 50%; width: 22px; height: 32px; margin-top: -16px; }
.smallshow > .prev { left: 0; background: url(../images/hover-prev.png) no-repeat; transition: all 0.5s }
.smallshow > .next { right: 0; background: url(../images/hover-next.png) no-repeat; transition: all 0.5s }
.smallshow > .prev.prevnone { left: 0; background: url(../images/prev.png) no-repeat; cursor: not-allowed }
.smallshow > .next.nextnone { right: 0; background: url(../images/next.png) no-repeat; cursor: not-allowed }
#detail_video {height:220px;}
.bg_photo{float:left;width:180px;border:1px red solid;height:430px;}

.rightphoto {float: right; width: 160px; height: 240px; }
.rightphoto .tit { font-size: 18px; color: #4b4b4b; margin-bottom: 10px; line-height: 30px; text-align:center; }

.pdt-left { width: 88px; position: relative; overflow: hidden; height: 465px; margin:0 auto;}
.pdt-left .prev2, .pdt-left .next2 { position: absolute; left: 0; width: 88px; top: 0; line-height: 25px; color: #fff; font-size: 14px; background: rgba(0, 0, 0, 0.5); z-index: 9; text-align: center; opacity: 0; transition: all .5s ease; }
.pdt-left .next2 { top: auto; bottom: 0; }
.pdt-left:hover .prev2,  .pdt-left:hover .next2 { opacity: 1; }
.pdt-left .bd { width: 88px; float: left; height: 465px; }
.pdt-left .bd li { margin-bottom: 6px; cursor: pointer; }
.pdt-left .bd li.on .img { border-color: #01b997; }
.pdt-left .bd .img { display: block; text-align: center; width: 88px; height: 88px; box-sizing: border-box; border: 1px solid #c9c9c9; }
.pdt-left .bd .img img { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: middle; }
.pdt-left .bd .img:after { content: ''; height: 100%; display: inline-block; vertical-align: middle; }
.pdt-left .big-img { box-sizing: border-box; float: right; display: block; text-align: center; width: 465px; height: 465px; border: 1px solid #c9c9c9; }
.pdt-left .big-img img { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: middle; }
.pdt-left .big-img:after { content: ''; height: 100%; display: inline-block; vertical-align: middle; }


.insidedetail{margin-top:10px;}
.insidedetail .nav {width:400px;margin:0 auto;padding-bottom:50px;}
.insidedetail .nav ul { list-style-type: none; }
.insidedetail .nav li { display: inline; float: left; width: 100px; height: 30px; line-height: 30px; text-align: center; margin-right: 30px; font-size: 16px; }
.insidedetail .nav li:hover { border-bottom: 1px #01b997 solid; }
.insidedetail .nav li a:hover{color:#01b997;}

.detail img {max-width:100%;height:auto; }
.spec img { max-width: 100%; height: auto; }
.pack img { max-width: 100%; height: auto; }

.elselist .tit{font-size:36px;line-height:80px;text-align:center;color: #33615f;}

/* 产品放大镜视频播放 */
.click_video{
    position: absolute;
    top: 85%;
    left: 10%;
    width: 50px;
    height: 50px;
    margin: -25px 0 0 -25px;
    background: url(../images/main-circles.png) 0 -55px no-repeat;
    z-index: 999;
}
.click_video:hover{
    background: url(../images/main-circles.png) -55px -55px no-repeat;
}
.popup_video{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    background-color: #000000;
    z-index: 9999;
    display: block;
    overflow: hidden;
}
.popup_video video{
    z-index: 9;
}
.close_video{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 18px;
    height: 18px;
    z-index: 99;
    background-image: url(../images/close_video.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    overflow: hidden;
}
	
}