/* productCat
----------------------------------------------- */
#productCat {
}
/* -- product-list -- */
.product-list {
 padding: 50px 0;
}
.product-list .row {
 margin-left: -9px;
 margin-right: -9px;
}
.product-list .col-md-3, .product-list .col-6 {
 padding-left: 9px;
 padding-right: 9px;
}
.product-list .item {
 margin-bottom: 20px;
 background-color: #FFF;
}
.product-list .item a {
 display: block;
 border: 1px solid #DDD;
 padding: 35px 10px;
 text-align: center;
}
.product-list .item .icon {
 border-bottom: 1px solid #DDD;
 padding-bottom: 15px;
 margin: 0 30px 15px 30px;
}
.product-list .item .icon .fa {
 font-size: 60px;
 color: #19B4EA;
 margin-bottom: 8px;
 border-radius: 50%;
}
.product-list .item a:hover {
 border: 1px solid #A0E2F8;
 box-shadow: 0 0 15px 0 rgb(0 0 0 / 10%);
}
.product-list .item .name {
 font-size: 18px;
 color: #000;
 font-weight: bold;
}
.product-list .item .price {
 font-family: Arial, Lucida, Verdana, Helvetica, sans-serif;
 margin-bottom: 15px;
 color: #FC1934;
}
.product-list .item .desc {
 color: #999;
 margin-bottom: 6px;
 height: 45px;
}
.product-list .item .coop {
 margin-bottom: 5px;
 color: #555;
}
.product-list .item .plat {
 color: #555;
 margin-bottom: 20px;
}
.product-list .item .more {
 display: inline-block;
 border: 1px solid #19B4EA;
 color: #19B4EA;
 padding: 5px 40px;
}
.product-list .item a:hover .more {
 background-color: #19B4EA;
 color: #FFF;
}
/* product
----------------------------------------------- */
/* -- head-nav -- */
.head-nav {
 border-bottom: 1px solid #EEE;
 background-color: #f8fbff;
}
.head-nav .item {
 text-align: center;
 padding: 20px 0;
}
.head-nav .item a {
 display: inline-block;
}
.head-nav .item em {
 display: block;
 font-size: 13px;
}
.head-nav .item .fa {
 font-size: 16px;
 background-color: #19B4EA;
 color: #FFF;
 padding: 8px;
 margin-bottom: 8px;
 border-radius: 50%;
}
.head-nav .item a:hover {
 border-left: 1px solid #EEE;
 border-right: 1px solid #EEE;
 padding: 0 20px;
}
.head-nav .item a:hover .fa {
 background-color: #0072C6;
}
/* -- brief -- */
#product {
 background-color: #FFF;
}
#product .brief .info {
 text-align: center;
 padding: 80px 0 30px 0;
}
#product .brief .info h1 {
 font-size: 40px;
 color: #333;
 margin-bottom: 5px;
}
#product .brief .info .price {
 font-family: Arial, Lucida, Verdana, Helvetica, sans-serif;
 margin-bottom: 15px;
 color: #FC1934;
}
#product .brief .info .desc {
 display: inline-block;
 color: #999;
 font-size: 16px;
 max-width: 700px;
 margin-bottom: 10px;
}
#product .brief .info .coop {
 margin-bottom: 5px;
 color: #999;
}
#product .brief .info .plat {
 margin-bottom: 40px;
 color: #999;
}
#product .brief .info .action a {
 display: inline-block;
 padding: 8px 30px;
 font-size: 14px;
 border-radius: 40px;
 margin: 0 5px;
}
#product .brief .info .action a i {
 margin-right: 5px;
 font-size: 16px;
}
#product .brief .info .action a.btn-buy {
 background-color: #19B4EA;
 border: 1px solid #19B4EA;
 color: #FFF;
}
#product .brief .info .action a.btn-demo {
 border: 1px solid #19B4EA;
 color: #19B4EA;
}
#product .brief .info .action a.btn-demo:hover {
 background-color: #19B4EA;
 color: #FFF;
}
#product .brief .img {
 text-align: center;
}
/* -- advantage -- */
#product .advantage {
 padding: 50px 0;
 border-top: 1px solid #EEE;
 border-bottom: 1px solid #EEE;
}
#product .advantage .item {
 text-align: center;
}
#product .advantage .item .icon {
 margin-bottom: 15px;
}
#product .advantage .item .icon .fa {
 font-size: 30px;
 color: #333;
}
#product .advantage .item .name {
 color: #000;
}
/* -- ladder -- */
#product .ladder {
 padding: 50px 0;
}
#product .ladder .item {
 zoom: 1;
 overflow: hidden;
 margin-bottom: 40px;
}
#product .ladder .item .left {
 width: 50%;
 float: left;
}
#product .ladder .item .left .box {
 margin-right: 20px;
}
#product .ladder .item .right {
 width: 50%;
 float: left;
}
#product .ladder .item .right .box {
 margin-left: 20px;
}
#product .ladder .item .text .name {
 display: block;
 margin: 70px 0 20px;
 font-size: 26px;
}
#product .ladder .item .text .name a {
 color: #083C88;
}
@media (max-width:768px) {
 #product .ladder .item .left {
  width: 100%;
  float: none;
 }
 #product .ladder .item .left .box {
  margin-right: 0;
 }
 #product .ladder .item .right {
  width: 100%;
  float: none;
 }
 #product .ladder .item .right .box {
  margin-left: 0;
 }
 #product .ladder .item .text .name {
  margin: 0 0 20px;
 }
}
#product .ladder .item .text p {
 color: #666;
 font-size: 16px;
 line-height: 1.8em;
}
#product .ladder .item .m_img {
 margin-bottom: 10px;
}
#product .ladder .item .m_img img {
 width: 100%;
}
#product .ladder .item .img img {
 width: 100%;
}
#product .ladder .item .img .emptyImg {
 background-color: #DDD;
 text-align: center;
 line-height: 300px;
 color: #BBB;
 font-size: 30px;
}
/* -- content -- */
#product .content {
 padding: 50px 0;
 text-align: center;
}
/* -- conScreenshot -- */
#product .content .conScreenshot {
 text-align: center;
}
#product .content .conScreenshot a {
 display: inline-block;
 width: 180px;
 margin: 0 10px 10px 0;
 border: 2px solid #FFF;
 cursor: pointer;
 position: relative;
}
#product .content .conScreenshot a img {
 width: 100%;
}
#product .content .conScreenshot a i {
 display: none;
 position: absolute;
 font-size: 30px;
 left: 50%;
 top: 50%;
 margin-left: -15px;
 margin-top: -15px;
 color: #FFF;
}
#product .content .conScreenshot a em {
 display: none;
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 height: 320px;
 background-color: #000;
 opacity:0.3;
 filter(alpha=30);
}
#product .content .conScreenshot a:hover i, #product .content .conScreenshot a:hover em {
 display: block;
}