.console-desc {
  margin-bottom: 20px;
}

.product-bg {
  background-color: rgb(243, 243, 243)
}

.vpc-class-tab {
  margin: 40px auto 10px;
  width: 930px;
}

.vpc-right-content {
  padding-left: 50px;
}
.vpc-tab-item {
  cursor: pointer;
  float: left;
  font-size: 16px;
  width: 100px;
  height: 116px;
  line-height: 100px;
  margin-right: 30px;
  text-align: center;
  background: url(../img/product/vpc-class.png) no-repeat;
}
.vpc-tab-item-active {
  background-image: url(../img/product/vpc-class-active.png);
  color: #fff;
}

.vpc-palyer-container {
  width: 930px;
  overflow: hidden;
}
.vpc-palyer-box {
  width: 930px;
  height: 459px;
}

.vpc-palyer {
  margin-top: 10px;
  width: 930px;
  height: 459px;
  margin: 10px auto 10px;
  background: url(../img/product/vpc-player-bg.png) no-repeat;
  position: relative;
  float: left;
}

.vpc-player-bg {
  position: relative;
  width: 690px;
  height: 367px;
  top: 35px;
  left: 120px;
  z-index: 1;
  overflow: hidden;
}

.vpc-palyer-bg_box {
  width: 4900px;
  position: absolute;
  top: 0;
  left: -2070px;
  height: 100%;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

.vpc-player-left {
  top: 0;
  left:  2070px;
  width: 690px;
  height: 367px;
  position: absolute;
} 

.vpc-left-1 {
  background: url(../img/product/vpc-change.png) no-repeat;
  left: 0;
}

.vpc-left-2 {
  background: url(../img/product/vpc-change.png) no-repeat;
  left: 690px;
}

.vpc-left-3 {
  background: url(../img/product/vpc-change.png) no-repeat;
  left: 1380px;
}

.vpc-left-4 {
  background: url(../img/product/vpc-change.png) no-repeat;
  left: 2070px;
}

.vpc-left-5 {
  background: url(../img/product/vpc-change.png) no-repeat;
  left: 2760px;
}

.vpc-left-6 {
  background: url(../img/product/vpc-change.png) no-repeat;
  left: 3450px;
}

.vpc-left-7 {
  background: url(../img/product/vpc-change.png) no-repeat;
  left: 4140px;
}
.vpc-player-btn {
  position: absolute;
  top: 0;
  width: 691px;
  height: 230px;
  z-index: 2;
  left: 0;
  cursor: pointer;
}

.vpc-palyer-desc {
  position: absolute;
  bottom: 0;
  color: #fff;
  width: 691px;
  height: 137px;
  z-index: 2;
  left: 0;
  background-color: rgb(90,90,90);
  opacity: 0.9;
}

.vpc-try-btn {
  cursor: pointer;
  display: block;
  width: 152px;
  height: 41px;
  background: url(../img/product/vpc-try-btn.png) no-repeat;
  position: absolute;
  bottom: 173px;
  left: 85px;
  z-index: 3;
}

.player-btn {
  display: block;
  width: 76px;
  height: 76px;
  background: url(../img/product/play.png) no-repeat;
  margin: 75px auto;
}

.vpc-palyer-desc p{
  margin: 35px 50px;
}

.video-player-container {
  position: relative;
  width: 0;
  height: 0;
  overflow: hidden;
  z-index: 0;
  opacity: 0;
  -webkit-transition: all.3s;
  -moz-transition: all.3s;
  -ms-transition: all.3s;
  -o-transition: all.3s;
}

.kloud-layer-show {
  overflow: visible;
  z-index: 9999;
  opacity: 1;
}

.video-player-block {
  position: absolute;
  background: #000;
  opacity: 0.3;
  filter: alpha(opacity=30);
}

.video-player-box {
  position: absolute;
  overflow: hidden;
}

.y-dly {
  padding: 4px;
  width: 908px;
  height: 508px;
  background: #9cddf5;
  background: rgba(0,162,202,.5);
}

.dialog-video .icon-wrong {
  position: absolute;
  right: 0;
  top: 0;
  background: #00a2ca;
  padding: 3px;
  color: #fff;
  cursor: pointer;
  z-index: 999;
}

.icon-wrong:before {
  content: "x";
}

/** video controller **/

.mejs-inner,
.mejs-inner div,
.mejs-inner a,
.mejs-inner span,
.mejs-inner button {
  margin: 0;
  padding: 0;
  border: none;
  outline: none;
}

.mejs-container {
  position: relative;
  background: #000000;
}

.mejs-inner {
  position: relative;
  width: inherit;
  height: inherit;
}

.me-plugin { position: absolute; }

.mejs-container-fullscreen .mejs-mediaelement,
.mejs-container-fullscreen video,
.mejs-embed,
.mejs-embed body,
.mejs-mediaelement {
  width: 100%;
  height: 100%;
}

.mejs-embed,
.mejs-embed body {
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.mejs-container-fullscreen {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  z-index: 1000;
}

.mejs-poster img { display: block; }

.mejs-background,
.mejs-mediaelement,
.mejs-poster,
.mejs-overlay {
  position: absolute;
  top: 0;
  left: 0;
}

.mejs-overlay-play { cursor: pointer; }

.mejs-inner .mejs-overlay-button {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 76px;
  height: 76px;
  margin: -38px 0 0 -38px;
  background: url(../img/product/play.png) no-repeat;
}

/* Controls Container */
.mejs-container .mejs-controls {
  position: absolute;
  width: 100%;
  height: 34px;
  left: 0;
  bottom: 0;
  background: rgb(0,0,0); /* IE8- */
  background: rgba(0,0,0, .7);
}

/* Controls Buttons */
.mejs-controls .mejs-button button {
  display: block;
  cursor: pointer;
  width: 16px;
  height: 16px;
  background: transparent url(../img/product/controls.png);
}

/* Play & Pause Button */
.mejs-controls div.mejs-playpause-button {
  position: absolute;
  top: 12px;
  left: 15px;
}

.mejs-controls .mejs-play button,
.mejs-controls .mejs-pause button {
  width: 12px;
  height: 12px;
  background-position: 0 0;
}

.mejs-controls .mejs-pause button { background-position: 0 -12px; }

/* Mute & Unmute */
.mejs-controls div.mejs-volume-button {
  position: absolute;
  top: 12px;
  left: 45px;
}

.mejs-controls .mejs-mute button,
.mejs-controls .mejs-unmute button {
  width: 14px;
  height: 12px;
  background-position: -12px 0;
}

.mejs-controls .mejs-unmute button { background-position: -12px -12px; }

/* Full-Screen Button */
.mejs-controls div.mejs-fullscreen-button {
  position: absolute;
  top: 7px;
  right: 7px;
}

.mejs-controls .mejs-fullscreen-button button,
.mejs-controls .mejs-unfullscreen button {
  width: 27px;
  height: 22px;
  background-position: -26px 0;
}

.mejs-controls .mejs-unfullscreen button { background-position: -26px -22px; }

/* Volume Slider */
.mejs-controls div.mejs-horizontal-volume-slider {
  position: absolute;
  cursor: pointer;
  top: 15px;
  left: 65px;
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
  width: 60px;
  background: #d6d6d6;
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
  position: absolute;
  width: 0;
  top: 0;
  left: 0;
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
  height: 4px;

  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

/* Progress Bar */
.mejs-controls div.mejs-time-rail {
  position: absolute;
  width: 100%;
  left: 0;
  top: -10px;
}

.mejs-controls .mejs-time-rail span {
  position: absolute;
  display: block;
  cursor: pointer;
  width: 100%;
  height: 10px;
  top: 0;
  left: 0;
}

.mejs-controls .mejs-time-rail .mejs-time-total {
  background: rgb(152,152,152); /* IE8- */
  background: rgba(152,152,152, .5);
}

.mejs-controls .mejs-time-rail .mejs-time-loaded {
  background: rgb(0,0,0); /* IE8- */
  background: rgba(0,0,0, .3);
}

.mejs-controls .mejs-time-rail .mejs-time-current { width: 0; }

/* Progress Bar Handle */
.mejs-controls .mejs-time-rail .mejs-time-handle {
  position: absolute;
  cursor: pointer;
  width: 16px;
  height: 18px;
  top: -3px;
  background: url(../img/product/handle.png);
}

/* Progress Bar Time Tooltip */
.mejs-controls .mejs-time-rail .mejs-time-float {
  position: absolute;
  display: none;
  width: 33px;
  height: 23px;
  top: -26px;
  margin-left: -17px;
  background: url(../img/product/tooltip.png);
}

.mejs-controls .mejs-time-rail .mejs-time-float-current {
  position: absolute;
  display: block;
  left: 0;
  top: 4px;

  font-family: Helvetica, Arial, sans-serif;
  font-size: 10px;
  font-weight: bold;
  color: #666666;
  text-align: center;
}

.mejs-controls .mejs-time-rail .mejs-time-float-corner { display: none; }

/* Green Gradient (for progress and volume bar) */
.mejs-controls .mejs-time-rail .mejs-time-current,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
  background: #82d344;
  background: -webkit-linear-gradient(top, #82d344 0%, #51af34 100%);
  background: -moz-linear-gradient(top, #82d344 0%, #51af34 100%);
  background: -o-linear-gradient(top, #82d344 0%, #51af34 100%);
  background: -ms-linear-gradient(top, #82d344 0%, #51af34 100%);
  background: linear-gradient(top, #82d344 0%, #51af34 100%);
}

/** product paltform **/

.product-platform-box {
  margin: 20px 10px;
  position: relative;
}

.product-left-menu {
  float: left;
  width: 157px;
}

.product-right-desc {
  position: absolute;
  margin-left: 200px;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
  filter: alpha(opacity=0);
  opacity: 0;
  z-index: 1;
}

.product-right-desc_show {
  opacity: 1;
  filter: alpha(opacity=100);
  z-index: 100
}

.product-platform-bg {
  background: url(../img/product/paltform-bg.jpg) repeat;
}

.platform-class {
  display: block;
  width: 87px;
  height: 87px;
  text-align: center;
  line-height: 87px;
  background: url(../img/product/class-bg.png) no-repeat;
  cursor: pointer;
}

.platform-class-style-2 {
  margin-left: 65px;
  margin-top: -20px;
}

.platform-class-active {
  background-image: url(../img/product/class-bg-active.png);
  color: #fff;
}

.platform-class-line {
  display: block;
  width: 0;
  height:14px;
  border: 1px solid rgb(234, 234, 234);
  
}

.platform-class-line-1 {
  margin-left: 73px;
  margin-top: -11px;
  margin-bottom: 6px;
  -webkit-transform: rotate(671deg);
  -moz-transform: rotate(671deg);
  -o-transform: rotate(671deg);
  -ms-transform: rotate(671deg);
  transform: rotate(671deg)
}

.platform-class-line-2 {
  margin-left: 78px;
  margin-top: -9px;
  margin-bottom: -13px;
  -webkit-transform: rotate(761deg);
  -moz-transform: rotate(761deg);
  -o-transform: rotate(761deg);
  -ms-transform: rotate(761deg);
  transform: rotate(761deg);
  height: 25px;
}

.paltform-desc-img {
  text-align: center;
}

.platform-desc {
  margin: 20px 0;
}

.paltform-desc-img span {
  display: inline-block;
  width: 650px;
  height: 450px;

}

.paltform-desc-img-1 span {
  background: url(../img/product/platform-1.png) no-repeat;
}

.paltform-desc-img-2 span {
  background: url(../img/product/platform-2.png) no-repeat;
}

.paltform-desc-img-3 span {
  background: url(../img/product/platform-3.png) no-repeat;
}

.paltform-desc-img-4 span {
  background: url(../img/product/platform-4.png) no-repeat;
}

.paltform-desc-img-5 span {
  background: url(../img/product/platform-5.png) no-repeat;
}

.paltform-desc-img-6 span {
  background: url(../img/product/platform-6.png) no-repeat;
}
.paltform-btn-group {
  text-align: left;
  margin-left: 200px;
}

.platform-title {
  font-size: 17px;
  margin: 10px 0;
}

.free-use {
  display: inline-block;
  width: 143px;
  height: 41px;
  border: 0;
  outline: 0;
  background-image: url(../img/product/gray-btn.png);
  background-position: -143px 0px;
  background-repeat: no-repeat;
  background-color: transparent;
  color: #fff;
  text-align: center;
  line-height: 36px;
  margin-right: 40px;
}

.free-use:hover {
  background-position: 0px 0px;
  color:#fff;
  text-decoration: none;
}

.free-use:active {
  background-position: -286px 0px;
}

.view-video {
  width: 143px;
  height: 41px;
  border: 0;
  outline: 0;
  background-image: url(../img/product/blue-btn.png);
  background-position: -143px 0px;
  background-repeat: no-repeat;
  background-color: transparent;
  color: #fff;
  text-align: center;
  line-height: 36px;
}

.view-video:hover {
  background-position: 0px 0px;
}

.view-video:active {
  background-position: -286px 0px;
}

.product-tools-bg {
  background-color: rgb(243,243,243);
}

.proudct-circle-tool {
  position: relative;
  display: inline-block;
  width: 415px;
  height: 415px;
  -webkit-transition:all 1s ease-in-out;
  -moz-transition:all 1s ease-in-out;
  -o-transition:all 1s ease-in-out;
  -ms-transition:all 1s ease-in-out;    
  transition:all 1s ease-in-out;
}
.product-tool {
  display: inline-block;
  position: absolute;
  cursor: pointer;
}

.product-tool-1 {
  width: 290px;
  height: 115px;
  top: 0;
  left: 60px;
  background: url(../img/product/c-blue.png) no-repeat;
}

.product-tool-hover-1 {
  background-image: url(../img/product/c-blue-hover.png);
}

.product-tool-active-1 {
  background-image: url(../img/product/c-blue-select.png); 
  height: 165px;
  top: -48px;
}
.product-tool-2 {
  width: 114px;
  height: 289px;
  top: 62px;
  left: 298px;
  background: url(../img/product/c-green.png) no-repeat;
}

.product-tool-hover-2 {
  background-image: url(../img/product/c-green-hover.png);
}

.product-tool-active-2 {
  background-image: url(../img/product/c-green-select.png); 
  width: 170px;
}
.product-tool-3 {
  width: 290px;
  height: 115px;
  top: 298px;
  left: 60px;
  background: url(../img/product/c-yellow.png) no-repeat;
}

.product-tool-hover-3 {
  background-image: url(../img/product/c-yellow-hover.png);
}

.product-tool-active-3 {
  background-image: url(../img/product/c-yellow-select.png); 
  height: 165px;
}
.product-tool-4 {
  width: 114px;
  height: 289px;
  top: 62px;
  left: 0px;
  background: url(../img/product/c-purple.png) no-repeat;
}

.product-tool-hover-4 {
  background-image: url(../img/product/c-purple-hover.png);
}

.product-tool-active-4 {
  background-image: url(../img/product/c-purple-select.png); 
  left: -49px;
  width: 168px;
}
.product-tool span {
  color: #fff;
  display: inline-block;
  text-align: center;
  font-size: 17px;
}

.proudct-tool-center {
  background: url(../img/product/product-tools.png) no-repeat;
  display: inline-block;
  width: 182px;
  height: 157px;
  position: relative;
  top: -137px;
  left: -300px;
}

.tool-title-1 {
  margin-top: 31px;
  -webkit-transform:rotate(0deg);
  -moz-transform:rotate(0deg);
  -o-transform:rotate(0deg);
  -ms-transform:rotate(0deg);
  transform:rotate(0deg); 
}

.tool-title-2 {
  margin-top: 135px;
  margin-left: 35px;
  width: 58px;
  -webkit-transform:rotate(0deg);
  -moz-transform:rotate(0deg);
  -o-transform:rotate(0deg);
  -ms-transform:rotate(0deg);
  transform:rotate(0deg); 
}

.tool-title-3 {
  margin-top: 60px;
  -webkit-transform:rotate(0deg);
  -moz-transform:rotate(0deg);
  -o-transform:rotate(0deg);
  -ms-transform:rotate(0deg);
  transform:rotate(0deg); 
}

.tool-title-4 {
  margin-top: 135px;
  margin-left: -25px;
  width: 58px;
  -webkit-transform:rotate(0deg);
  -moz-transform:rotate(0deg);
  -o-transform:rotate(0deg);
  -ms-transform:rotate(0deg);
  transform:rotate(0deg); 
}

.product-tool-container {
  text-align: center;
  margin: 20px auto 65px;
}

.product-tool-desc-container {
  width: 507px;
  margin: auto;
}

.tab-line {
  width: 507px;
  height: 8px;
  display: inline-block;
  background-repeat: no-repeat;
  margin-left: -90px;
}

.tab-line-1 {
  background-image: url(../img/product/product-tool-line-1.png);
}
.tab-line-2 {
  background-image: url(../img/product/product-tool-line-2.png);
}
.tab-line-3 {
  background-image: url(../img/product/product-tool-line-3.png);
}
.tool-tab {
  cursor: pointer;
}

.tool-tab-1 {
  float: left;
  padding-left: 26px;
}

.tool-tab-3 {
  float: left;
  padding-left: 135px;
  color: rgb(66,139,202);
}

.tool-tab-2 {
  float: right;
  padding-right: 225px;
}

.product-tool-desc-box {
  margin-left: -60px;
  margin-top: 20px;
  margin-bottom: 80px;
  width: 443px;
}

.product-tool-desc-sys a {
  color: #ff9903;
}
.product-tool-desc-sys .wait-desc {
  color: #ff9903;
}
.product_ul{ list-style:none;}
.product_ul li{ float:left; margin-right:13px; border:1px solid #CCC;}
.product_ul img {
  cursor: pointer;
  transition: opacity 0.3s ease;
}
.product_ul img:hover {
  opacity: 0.9;
}

/* 图片放大预览样式 */
.image-zoom-preview {
  position: absolute;
  z-index: 9999;
  display: none;
  border: 2px solid #fff;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  background: #fff;
  border-radius: 4px;
  overflow: hidden;
  pointer-events: none;
}

.image-zoom-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}