/*
CopyRight:DFrobot.com.cn 2017
Author:Fish,Luke
Content:Product
*/
#container .top {height: 528px;width: 100%;}
#container .top .topHere {background: rgba(139, 69, 19, 0.31);padding: 10px 0 33px 0;}
#container .top .topCon {height: 484px;}
#container .top .topCon .img {width: 486px;height: 486px;}
#container .top .topCon .lf .imgInfo {width: 486px;height: 486px;position: absolute;}
#container .top .topCon .lf .imgInfo img {width: 100%;height: 100%;cursor: pointer;opacity: 0;}
#container .top .topCon .lf .imgInfo video{position: absolute;z-index: 1;left: 0;top: 0;}
#container .top .topCon .conImg {width: 105px;height: 100%;position: relative;}
#container .top .topCon .conImg .spanTop {position: absolute;display: block;top: 0;left: 17px;width: 70px;height: 30px;text-align: center;background: #bfbfbf;line-height: 30px;}
#container .top .topCon .conImg .spanBootm {position: absolute;display: block;top: 455px;left: 17px;width: 70px;height: 30px;text-align: center;background: #bfbfbf;line-height: 30px;}
#container .top .topCon .conImg span i {font-size: 19px;color: #ffffff;}
#container .top .topCon .conImg span:hover {background: #434343;cursor: pointer;}
#container .top .topCon .conImg .gallery {position: absolute;top: 30px;left: 17px;width: 70px;height: 430px;overflow: hidden;}
#container .top .topCon .conImg .gallery ul {position: absolute;}
#container .top .topCon .conImg .gallery ul li {margin-bottom: 18px;height: 70px;width: 70px;}
#container .top .topCon .conImg .gallery ul li img {width: 100%;height: 100%;}
#container .top .topCon .conImg .gallery ul li:hover span,#container .top .topCon .conImg .gallery ul .select span{position: absolute;width: 64px;height: 64px;border: 3px solid #e16811;background: none;}
#container .top .topCon .conImg .gallery ul li .icon-ziyuan{position: absolute;border: 2px solid;font-size: 12px;border-radius: 40px;width: 20px;height: 20px;text-align: center;line-height: 20px;top: 20px;left: 20px;color: #FFFFFF;display: none;}
#container .top .topCon .conMes {width: 609px;height: 100%;background: #FFFFFF;position: relative;}
#container .top .topCon .conMes .goodsTitle {padding: 18px 0 5px 26px;font-size: 18px;font-weight: bold;line-height: 25px;}
#container .top .topCon .conMes .goodsTitle .brief{color: #e16811;}
#container .top .topCon .conMes .goodsTitle .freePostage {font-weight: normal;font-size: 14px;padding-top: 5px;}
#container .top .topCon .conMes .goodsTitle .freePostage span {color: #e16811;}
#container .top .topCon .conMes .goodsMes {height: 426px;width: 589px;padding: 0 0 0 20px;position: relative;}
#container .top .topCon .conMes .goodsMes .comPrice {background: #ffdcb9;width: 569px;font-size: 16px;line-height: 30px;text-indent: 15px;padding: 9px 0;}
#container .top .topCon .conMes .goodsMes .comPrice span {color: #959595;text-decoration: line-through;}
#container .top .topCon .conMes .goodsMes .comPrice font {font-size: 24px;font-weight: bold;color: #ff0000;}
#container .top .topCon .conMes .goodsMes .comPrice .surplusTime {font-size: 14px;}
#container .top .topCon .conMes .goodsMes .comPrice .surplusTime b {font-weight: normal;color: #ff0000;}
#container .top .topCon .conMes .goodsMes .prePrice {width: 554px;font-size: 17px;line-height: 40px;height: 43px;padding: 0 0 0 15px;border-bottom: dashed 1px #e37323;}
#container .top .topCon .conMes .goodsMes .prePrice font {color: #e16811;font-weight: bold;}
#container .top .topCon .conMes .goodsMes .prePrice .tradePrice {margin-left: 120px;}
#container .top .topCon .conMes .goodsMes .goodsDetial {height: 322px;width: 554px;padding: 5px 0 0 15px;font-size: 15px;position: relative;}
#container .top .topCon .conMes .goodsMes .goodsDetial .clearfix {height: 30px;line-height: 30px;font-size: 16px;margin-bottom: 8px;clear: both;}
#container .top .topCon .conMes .goodsMes .goodsDetial .name {float: left;width: 84px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .content {float: left;width: 470px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .content .totStock {float: left;margin-left: 10px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .content .totStock b {font-weight: normal;padding-right: 30px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .content .totStock .wlSales{float: right;display: none;}
#container .top .topCon .conMes .goodsMes .goodsDetial .content .totStock .wlSales i{font-weight: normal;font-style: normal}
#container .top .topCon .conMes .goodsMes .goodsDetial .content span {display: block;float: left;padding: 0 10px;margin-right: 10px;border: 1px solid #bfbfbf;margin-bottom: 10px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .rank {cursor: pointer;width: auto;}
#container .top .topCon .conMes .goodsMes .goodsDetial .rank b {color: #e16811;font-weight: normal;}
#container .top .topCon .conMes .goodsMes .goodsDetial .content2 {float: left;width: 190px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .share {font-size: 16px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .share span {float: left;padding-right: 5px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .share span .shareIcon {width: 20px;height: 30px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .share span i {position: absolute;margin-top: 2px;cursor: pointer;}
#container .top .topCon .conMes .goodsMes .goodsDetial .share span .shareBtn {position: absolute;width: 30px;height: 30px;overflow: hidden;opacity: 0;z-index: 1;}
#container .top .topCon .conMes .goodsMes .goodsDetial .share .shareBtn{cursor: pointer;}
#container .top .topCon .conMes .goodsMes .goodsDetial .share .shareBtn textarea{width: 10px;height: 10px;position: absolute;opacity: 0;}
#container .top .topCon .conMes .goodsMes .goodsDetial .spec .content span {cursor: pointer;}
#container .top .topCon .conMes .goodsMes .goodsDetial .spec .content span:hover {background: #e16811;color: #FFFFFF;border: 1px solid #e16811;}
#container .top .topCon .conMes .goodsMes .goodsDetial .spec .content .select {background: #e16811;color: #FFFFFF;border: 1px solid #e16811;}
#container .top .topCon .conMes .goodsMes .goodsDetial .spec .content .select a{color: #FFFFFF;}
#container .top .topCon .conMes .goodsMes .goodsDetial .content .stars {background: url(../images/wujiaoxing.png);background-position: 0 0;width: 22px;padding: 0;overflow: hidden;border: none;height: 22px;margin-top: 3px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .content .son b {display: block;background: url(../images/wujiaoxing.png);background-position: 0 21px;width: 22px;padding: 0;overflow: hidden;border: none;height: 22px;}
#container .top .topCon .conMes .goodsMes .goodsDetial a {color: #313131;}
#container .top .topCon .conMes .goodsMes .goodsDetial .share {height: 33px;margin-top: 14px;line-height: 33px;}
#container .top .topCon .conMes .goodsMes .goodsDetial .numb .lf a,#container .top .topCon .conMes .goodsMes .goodsDetial .numb .lf input {display: block;float: left;}
#container .top .topCon .conMes .goodsMes .goodsDetial .numb .lf .sub {margin-left: 55px;border: #bfbfbf 1px solid;width: 19px;height: 27px;line-height: 27px;text-align: center;}
#container .top .topCon .conMes .goodsMes .goodsDetial .numb .lf .inum {width: 37px;height: 25px;border: 1px #bfbfbf solid;border-left: none;border-right: none;line-height: 25px;text-align: center;background: transparent;}
#container .top .topCon .conMes .goodsMes .goodsDetial .numb .lf .add {border: #bfbfbf 1px solid;width: 19px;height: 27px;line-height: 27px;text-align: center;}
#container .top .topCon .conMes .gotoBuy {height: 45px;width: 528px;bottom: 20px;position: absolute;left: 20px;}
#container .top .topCon .conMes .gotoBuy a {display: block;text-align: center;line-height: 45px;float: left;font-size: 18px;border: solid 1px #e16811;}
#container .top .topCon .conMes .gotoBuy .addCart {background: #e16811;width: 168px;color: #ffffff;}
#container .top .topCon .conMes .gotoBuy .buyNow {background: #ffdcb9;margin-left: 13px;color: #e16811;width: 166px;}
#container .top .topCon .conMes .gotoBuy .tradBuy {background: #ff5a46;color: #ffffff;width: 166px;margin-left: 12px;}
#container .top .topCon .conMes .gotoBuy .destroy {background: #EEEEEE;border: 1px solid #EEEEEE;color: #FFFFFF;}
#container .top .topCon .conMes .gotoBuy .creativityBuyBtn{background: #e16811;width: 168px;color: #ffffff;display: block;text-align: center;line-height: 45px;float: left;font-size: 18px;border: solid 1px #e16811;cursor: pointer;}

#container .middle {width: 100%;margin-top: 15px;}
#container .middle .lf {width: 969px;}
#container .middle .lf .box .boxTop {height: 45px;}
#com_b a,#container .middle .lf .box .boxTop h2 {width: 100px;height: 45px;line-height: 43px;cursor: pointer;text-align: center;float: left;color: #000000;background: #ffffff;margin: 0px 2px 0 3px;font-size: 16px;}
#container .middle .lf .box .boxTop h2:nth-child(1) {color: #ffffff;background: #e16811;}
#container .middle .lf .box .boxMiddle {margin-top: 4px;background: #FFFFFF;}
#container .middle .lf .box .boxMiddle .mainViewone {padding: 16px 30px;}
#container .middle .lf .box .boxMiddle .mainViewone h3 {font-size: 20px;position: relative;color: #e16811;margin: 10px 0;overflow: hidden;height: 30px;line-height: 30px;}
#container .middle .lf .box .boxMiddle .mainViewone h3:after {content: "";position: absolute;top: 15px;background: #e16811;width: 840px;height: 2px;margin-left: 20px;}
#container .middle .lf .box .boxMiddle .mainViewone h3:before {content: "";position: absolute;top: 13px;background: #ffffff;width: 48px;height: 2px;left: 98%;z-index: 10;}
#container .middle .lf .box .boxMiddle .mainViewone h4{font-size: 17px;font-weight: normal;margin: 20px 0 6px 0;}
#container .middle .lf .box .boxMiddle .mainViewone h6{display: none;}
#container .middle .lf .box .boxMiddle .mainViewone ul {top: 17px;font-size: 17px;padding-left: 40px;}
#container .middle .lf .box .boxMiddle .mainViewone ul li {line-height: 30px;list-style: disc;margin-left: 20px;font-size: 16px;}
#container .middle .lf .box .boxMiddle .mainViewone ol li {line-height: 30px;list-style: auto;margin-left: 20px;font-size: 16px;}
#container .middle .lf .box .boxMiddle .mainViewone p {font-size: 16px;padding: 10px 0 0 0;line-height: 21px;}
#container .middle .lf .box .boxMiddle .mainViewone p img,#container .middle .lf .box .boxMiddle .mainViewone .image img {max-width: 800px;height: auto;display: block;margin: 0px auto;}
#container .middle .lf .box .boxMiddle .mainViewone a {line-height: 30px;color: #e16811;}
#container .middle .lf .box .boxMiddle .mainViewone .table{display: flex;justify-content: center;}
#container .middle .lf .box .boxMiddle .mainViewone .table table{border-collapse: collapse; border-spacing: 0; width: 100%; height: 100%; border: 1px double #b3b3b3;}
#container .middle .lf .box .boxMiddle .mainViewone .table table td{min-width: 2em;padding: 0.4em;border: 1px solid #bfbfbf;font-size: 16px;text-align: center;}
#container .middle .lf .box #htmlShowBox figure{margin: 0;padding: 0;}

#container .middle .lf .box .about {width: 100%;background: #FFFFFF;margin-top: 4px;}
#container .middle .lf .box .about h2 {padding: 31px 0 0 34px;}
#container .middle .lf .box .about .abCon {width: 100%;padding: 0 0 20px 0;/*background: http: //localhost/dfrobotcomcnv2/goods.php?id=1390;*/}
#container .middle .lf .box .about .abCon .abMain {width: 274px;margin: 23px 0 0 33px;height: 233px;float: left;border: 1px solid transparent;}
#container .middle .lf .box .about .abCon .abMain img {width: 274px;height: 174px;}
#container .middle .lf .box .about .abCon .abMain p {font-size: 16px;padding: 18px 0 0 0;color: #313131;}
#container .middle .lf .box .about .more {text-align: right;padding: 15px 43px;font-size: 17px;}
#container .middle .lf .box .about .more a {color: #000000;}
#container .middle .lf .box .about .abCon .abMain:hover {border: 1px solid #e16811;}
#container .middle .lf .box .comment {width: 100%;height: auto;background: #FFFFFF;margin-top: 5px;position: relative;}
#container .middle .lf .box .comment .box .peoCom {padding: 28px 0 21px 33px;font-size: 20px;}
#container .middle .lf .box .comment .box .line {width: 897px;height: 1px;background: #a0a0a0;margin: 0 auto;}
#container .middle .lf .box .comment .box .commentList {padding: 0px 34px;}
#container .middle .lf .box .comment .box .commentList .word {border-bottom: 1px dashed #a6a6a6;margin-top: 20px;}
#container .middle .lf .box .comment .box .commentList .word .headFrame {width: 60px;height: 60px;border-radius: 100%;overflow: hidden;float: left;}
#container .middle .lf .box .comment .box .commentList .word .headFrame img {width: 60px;height: 60px;}
#container .middle .lf .box .comment .box .commentList .word .info {float: left;margin-left: 10px;width: 160px;font-size: 16px;padding-right: 10px;}
#container .middle .lf .box .comment .box .commentList .word .info p {padding-bottom: 10px;}
#container .middle .lf .box .comment .box .commentList .word .con {float: right;width: 660px;}
#container .middle .lf .box .comment .box .commentList .word .con .rank {height: 30px;}
#container .middle .lf .box .comment .box .commentList .word .con .rank i {color: #efce4a;}
#container .middle .lf .box .comment .box .commentList .word .con .content {font-size: 16px;}
#container .middle .lf .box .comment .box .commentList .word .con .content p {}
#container .middle .lf .box .comment .box .commentList .word .con .content img {padding: 0 10px 10px 0;float: left;width: 70px;height: 70px;cursor: pointer;}
#container .middle .lf .box .comment .box .commentList .word .con .adminComment {clear: both;padding: 15px;background: #eeeeee;}
#container .middle .lf .box .comment .box .commentList .word .con .adminComment span {display: block;color: #e16811;padding: 5px 0;}
#container .middle .lf .box .comment .box .commentList .word .con .adminComment p {display: block;line-height: 25px;}
#container .middle .lf .box .comment .box #pageBar {text-align: right;width: 100%;height: 50px;position: relative;}
#container .middle .lf .box .comment .box #pageBar a {display: block;float: left;color: #000000;width: 90px;line-height: 38px;margin-left: 11px;background: #ffffff;font-size: 18px;text-align: center;}
#container .middle .lf .box .comment .box #pageBar a:hover {background: #E16811;color: #ffffff;}
#container .middle .lf .box .comment .box #pageBar .pager {position: absolute;right: 20px;}
@keyframes grow {0% {	transform: scale(1, 1);}99% {	transform: scale(4, 4);	opacity: 0;}100% {	transform: scale(1, 1);	opacity: 0;}}
.starability-grow,.growCon {display: block;position: relative;width: 300px;padding: 0 0 0 9px;border: none;}
.starability-grow>input {position: absolute;opacity: 0;}
.starability-grow>input:checked~label,.starability-grow>input:focus~label {background-position: 0 -24px;}
.starability-grow>input:hover~label {background-position: 0 -23.5px;}
.starability-grow>input:focus+label {outline: 1px dotted #999;}
.starability-grow>label {position: relative;display: inline-block;float: right;width: 20px;height: 20px;color: transparent;cursor: pointer;left: -165px;margin-left: 9px;cursor: pointer;background: url(../images/wujiaoxing.png);background-repeat: no-repeat;}
@media screen and (-webkit-min-device-pixel-ratio: 2),(-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {.starability-grow>label {	background: url(../images/wujiaoxing.png);	background-size: 30px auto;}}
.starability-grow>label:before {display: none;position: absolute;content: ' ';width: 20px;height: 20px;background: url(../images/wujiaoxing.png);background-repeat: no-repeat;bottom: 5px;}
@media screen and (-webkit-min-device-pixel-ratio: 2),(-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {.starability-grow>label:before {	background: url(../images/wujiaoxing.png);	background-size: 30px auto;}}
.starability-grow>input:checked+label:before {display: block;animation-duration: 1s;animation-name: grow;animation-fill-mode: forwards;}
.growCon>input {position: absolute;opacity: 0;}
.growCon>input:checked~label,.growCon>input:focus~label {background-position: 0 -24px;}
.growCon>input:hover~label {background-position: 0 -23.5px;}
.growCon>input:focus+label {outline: 1px dotted #999;}
.growCon>label {position: relative;display: inline-block;float: right;width: 20px;height: 20px;color: transparent;cursor: pointer;left: -185px;top: -3px;margin-left: 5px;cursor: pointer;background: url(../images/wujiaoxing.png);background-repeat: no-repeat;}
@media screen and (-webkit-min-device-pixel-ratio: 2),(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {.growCon>label {	background: url(../images/wujiaoxing.png);	background-size: 30px auto;}}
.growCon>label:before {display: none;position: absolute;content: ' ';width: 20px;height: 20px;background: url(../images/wujiaoxing.png);background-repeat: no-repeat;bottom: 5px;}
@media screen and (-webkit-min-device-pixel-ratio: 2),(-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {.growCon>label:before {	background: url(../images/wujiaoxing.png);	background-size: 30px auto;}}
.growCon>input:checked+label:before {display: block;animation-duration: 1s;animation-name: grow;animation-fill-mode: forwards;}
#thumbShow{position: fixed;z-index: 99;top: 0;left: 0;width: 100%;}
#thumbShow .bigImage{position: absolute;z-index: 1;}
#thumbShow .bigImage img{max-width: 800px;max-height: 800px;}
#partsList{width: 100%;height: auto;margin-bottom: 30px;}
#partsList ul{width: 860px;}
#partsList ul li{width: 100%;height: 32px;padding: 6px 0;border-bottom: 1px dashed #bfbfbf;position: relative;}
#partsList ul li .productIndex{float: left;width: 31px;height: 32px;line-height: 32px;}
#partsList ul li .productImg{float: left;width: 48px;}
#partsList ul li .productImg .smallImg{width: 30px;height: 30px;float: left;border: 1px solid #bfbfbf;}
#partsList ul li .productImg .thumbImg{display: none;position: absolute;margin: 0 0 0 40px;width: 300px;height: 300px;border: 1px solid #bfbfbf;top: -150px;background: #FFFFFF;z-index: 1;}
#partsList ul li .productImg:hover .thumbImg{display: block;}
#partsList ul li .productName{float: left;width: 690px;height: 32px;line-height: 32px;overflow: hidden;word-break: break-all;}
#partsList ul li .productNum{float: left;width: 91px;height: 28px;line-height: 28px;text-align: right;}
#partsList ul li .productNum button{width: 18px;height: 28px;background: #ffffff;border: none;outline: none;}
#partsList ul li .productNum button:hover{background: #eeeeee;}
#partsList ul li .productNum .left{float: left;}
#partsList ul li .productNum .right{float: right;}
#partsList ul li .productNum input{width: 40px;height: 28px;padding: 0;text-align: center;border-left: 1px solid #bfbfbf;border-right: 1px solid #bfbfbf;}
#partsList ul li .options{float: left;width: 28px;text-align: center;height: 32px;line-height: 32px;}