body,html{background: #fff;height:100%;}
.page-title{font-size:20px;margin:20px;color:#fff;}
.main-container > .head h1{position:relative;font-size: 24px;}
.main-container > .head h1 img{position:absolute; width: 90px;top: 20px;left: 0;}
.main-container > .head h2{position:fixed;z-index: 100; left:0;right:0; top:0;width:8em;margin-left:auto;margin-right: auto;padding:5px;color: #fff; background-color: #7f7ca5;line-height: 1em; font-size:14px;border-bottom-left-radius: 10px;border-bottom-right-radius: 10px;}
.main{ position: relative;}
.main-inner{ width:70%;}
.product { margin-top:40px;}
.product-item {margin-bottom: 40px;}
@media screen and (max-width:999px) {
    .main-inner{ width:100%;}
    .product-item {width: 33.3333%;}
    .product-item.first {width: 100%}
}
@media screen and (max-width:700px) {
    .product-item {width: 50%;}
}
.product-figure {position: relative; margin-left:20px;margin-right: 20px;overflow: hidden;}
.product-img img { width:100%;}
.product-figcaption {position: absolute; z-index: 1; width:100%;bottom:-120px;transition: bottom 0.5s;}
.product-info {text-align: center;background-color: #45426f;padding-top: 10px;padding-bottom: 10px; font-size: 12px;}
.product-info a{display: block; padding-bottom: 10px; color:#fff;padding-left:0.5em;padding-right:0.5px;line-height:1.5;}
.product-info p{color: #8780a5; font-size:12px;}
.product-qrcode {height: 100px;background-color: #fff; padding:10px;}
.product-qrcode img{display:block;max-width: 100%; max-height: 100%;margin-left: auto;margin-right: auto;}
.product-figure:hover .product-figcaption{bottom:0;}
.product-item.first .product-figcaption .product-qrcode::after{content:'扫描二维码体验';display: block;position:relative; top:2em; font-size:12px;text-align: center; color:#888;}
.product-item.first .product-figcaption .product-qrcode::after{content:'扫描二维码体验';display: block;position:relative; top:2em; font-size:12px;text-align: center; color:#888;}

.product-show {display:block; width: 375px;height:667px; margin-left:auto; margin-right:auto;overflow: hidden;}
@media screen and (max-width:700px) {
    .product-show {z-index:1001;position: fixed; top:0;bottom:0;left:0;right:0;width:100%;height:100%;}
}

@media screen and (max-width:999px) {
    .product-figure:hover .product-figcaption{bottom:-120px;}
}
.product-item.first .product-figure{position: static;}
.product-item.first .product-info p{color:#ccc;line-height: 1.5;font-size:14px;}
.product-item.first .product-figcaption{position:absolute;top:163px;;right:-100px;width:15%; bottom: auto;}
.product-item.first .product-figcaption .product-qrcode{position:relative;top:5px;border:1px solid #ccc;}

@media screen and (max-width:1480px){
.product-item.first .product-figcaption{position:relative;top:0;right:auto;width:auto;margin-top:20px;}
.product-item.first .product-figcaption .product-qrcode{height:140px;position:relative;top:20px;margin-bottom: 20px;}
}
/*手机断点*/
@media screen and (max-width:999px){
    .main-container > .head h2 ,.main-container > .head h1 img{display: none;}
    .main-container > .head h1{font-size:14px;}
    .main-container > .main {padding-top: 40px;}
}
.seprate{margin:20px;padding-bottom:20px;border-bottom: 1px solid #ddd; color: #666;}
.footer{position:static; margin-top:20px; color: #999; text-shadow: none;background-color: #45426F;padding:20px; text-align: center;font-size:14px; line-height: 1.8;}
