﻿@charset "utf-8";
/* CSS Document */

/*banner*/
.pbanner{ width:100%;height:621px;overflow:hidden;position:relative;background:url(../images/shpp/shpp-banner.jpg) bottom center no-repeat; text-align:center;}
.pbanner:before{display: inline-block;content: "";width: 0;height: 100%;vertical-align: middle;font-size: 0;}
.pbanner p{display:inline-block; width:auto;vertical-align:bottom;margin:0 auto;letter-spacing:2px; text-align:center; font-size:45px;height:100px;}

.shpp.bg1{ background:#FFD100;}
.shpp .pwhole-c{padding:50px 0;}

.shpp .pwhole-c h5{ text-align:center;font-size:45px;height:100px;}
.shpp .pwhole-c ul li{float:left;width:25%; text-align:center; position:relative;cursor:pointer;}

.shpp .pp ul li b{font-size:20px;disiplay:block;}
.shpp .pp ul li:after{content:"|"; position:absolute;right:0;font-size:20px;top:0;}
.shpp .pp ul li:last-child:after{display:none;}
.shpp .pp ul li span{display:block;width:auto;height:300px;}
.shpp .pp ul li:hover b{color:#F9501B;}
.shpp .pp ul li:nth-child(1) span{ background:url(../images/shpp/shpp-1-1.png) center bottom no-repeat;}
.shpp .pp ul li:nth-child(2) span{ background:url(../images/shpp/shpp-1-2.png) center bottom no-repeat;}
.shpp .pp ul li:nth-child(3) span{ background:url(../images/shpp/shpp-1-3.png) center bottom no-repeat;}
.shpp .pp ul li:nth-child(4) span{ background:url(../images/shpp/shpp-1-4.png) center bottom no-repeat;}

.shpp .pt ul li span{display:block;width:auto;height:270px;}
.shpp .pt ul li:nth-child(1) span{ background:url(../images/shpp/shpp-2-1.png) center top no-repeat;}
.shpp .pt ul li:nth-child(2) span{ background:url(../images/shpp/shpp-2-2.png) center top no-repeat;}
.shpp .pt ul li:nth-child(3) span{ background:url(../images/shpp/shpp-2-3.png) center top no-repeat;}
.shpp .pt ul li:nth-child(4) span{ background:url(../images/shpp/shpp-2-4.png) center top no-repeat;}
.shpp .pt p{ text-align:center;font-size:20px;}

.shpp .rk{padding:50px 0 0 0;}
.shpp .rk ul li{width:20%; text-align:center;}
.shpp .rk ul li b{font-size:16px;display:block;line-height:35px;}
.shpp .rk ul{height:450px; background:url(../images/shpp/shpp-2-bg.png) center bottom no-repeat;}
.shpp .rk ul li:hover b{color:#F9501B;}
.shpp .rk ul li span{display:block;width:auto;height:179px;}
.shpp .rk ul li:nth-child(1) span{ background:url(../images/shpp/shpp-3-1-a.png) center bottom no-repeat;}
.shpp .rk ul li:nth-child(2) span{ background:url(../images/shpp/shpp-3-2-a.png) 120px 0 no-repeat;}
.shpp .rk ul li:nth-child(3) span{ background:url(../images/shpp/shpp-3-3-a.png) center bottom no-repeat;}
.shpp .rk ul li:nth-child(4) span{ background:url(../images/shpp/shpp-3-4-a.png) center bottom no-repeat;}
.shpp .rk ul li:nth-child(5) span{ background:url(../images/shpp/shpp-3-5-a.png) center bottom no-repeat;}

.shpp .ad ul li{width:33.3%;margin-bottom:50px;}
.shpp .ad ul li:nth-child(3n+1){clear:left;}
.shpp .ad ul li b{font-size:16px;display:block;margin-top:-30px;}
.shpp .ad ul li:hover b{color:#F9501B;}


/*移动端样式*/
@media screen and (max-width: 1300px) 
{
.pbanner{ width:100%;height:500px;margin-top:0px; zoom:0.7;}
.pbanner p{font-size:30px;height:50px;}

.shpp .pwhole-c h5{ text-align:center;font-size:30px;height:80px;}

.shpp .pp ul li{zoom:0.6;}
.shpp .pp ul li b{font-size:25px;disiplay:block;}
.shpp .pp ul li:after{display:none;}
.shpp .pp ul li span{display:block;width:auto;height:300px;}

.shpp .pt ul li{zoom:0.5;}
.shpp .pt p{ text-align:center;font-size:18px;padding:0 15px;}

.shpp .rk{padding:50px 0 0 0;}
.shpp .rk ul li{zoom:0.8;}
.shpp .rk ul li b{font-size:16px;display:block;line-height:35px;}
.shpp .rk ul{height:420px; background:url(../images/shpp/shpp-2-bg.png) center bottom no-repeat;}
.shpp .rk ul li:hover b{color:#F9501B;}
.shpp .rk ul li span{display:none;}

.shpp .ad ul li{width:33.3%;margin-bottom:50px;zoom:0.6;}
.shpp .ad ul li b{font-size:25px;display:block;margin-top:-30px;}
.shpp .ad ul li:hover b{color:#F9501B;}

}


@media screen and (max-width: 767px) 
{
/*banner*/
.pbanner{ width:100%;height:500px;margin-top:160px; zoom:0.4;}
.pbanner p{font-size:40px;height:80px;}

.shpp .pwhole-c{padding:30px 0;}
.shpp .pwhole-c h5{ text-align:center;font-size:22px;height:60px;}

.shpp .pp .pwhole-c{padding:30px 0 10px 0;}
.shpp .pp ul li{zoom:0.45;width:50%;margin-bottom:50px;}
.shpp .pp ul li b{font-size:35px;disiplay:block;}
.shpp .pp ul li:after{display:none;}
.shpp .pp ul li span{display:block;width:auto;height:280px;}

.shpp .pt ul li{zoom:0.4;width:50%;margin-bottom:50px;}
.shpp .pt p{ text-align:center;font-size:16px;padding:0 15px;}

.shpp .rk .pwhole-c{padding:30px 0 0px 0;}
.shpp .rk ul li{zoom:0.7;width:33.3%;margin-bottom:30px;}
.shpp .rk ul li b{font-size:20px;display:block;line-height:35px;}
.shpp .rk ul{height:auto; background:none;}
.shpp .rk ul li:hover b{color:#F9501B;}
.shpp .rk ul li span{display:none;}

.shpp .ad .pwhole-c{padding:30px 0 0px 0;}
.shpp .ad ul li{width:50%;margin-bottom:50px;zoom:0.5;}
.shpp .ad ul li:nth-child(3n+1){clear:none;}
.shpp .ad ul li b{font-size:27px;display:block;margin-top:-30px;}
.shpp .ad ul li:hover b{color:#F9501B;}

}
