html{height: 100%;}
body{height: 100%;padding-top: 96px;}
.product{height: 100%;}
.prod_list img{display: none;}
.prod_left{width: 32%;float: left;height: 200%;background: url("../images/prod2.jpg");position: relative;}
.prod_left .img1{position: absolute;left: 50%;top:170px;margin-left: -94px;}
.prod_left .con{position: absolute;text-align: center;left: 50%; margin-left: -40px;top:44%;}
.prod_left .con>div{position: relative;padding: 25px 16px 12px 10px;}
.prod_left .con>div .text{overflow: hidden;}
.prod_left .con>div p{width: 30px;padding: 36px 5px 0;float: right; font-size: 18px;line-height: 18px;color: #eccc77;font-family: "宋体";}
.prod_left .con>div p:first-child{padding-top: 0;}
.prod_left .con>div i{width: 100%;left: 0;top:0;height: 100%;position: absolute;border: 2px solid #eccc77;display: block;}
.prod_left .con>div .i2{left: -7px;top:7px;}
.prod_tit{position: absolute;overflow: hidden;top: 350px;width: 256px;padding: 10px 10px;left: 50%;margin-left: -128px;}
.prod_tit li{position: relative;width: 96px;height: 96px;cursor: pointer;float:left;margin-bottom: 20px;    margin-right: 20px;}
.prod_tit li::before{width: 100%;height: 100%;border: 1px solid rgba(255,255,255,0.3);border-radius: 100%;position: absolute;content: " ";left:0;top:0;z-index: 1;}
.prod_tit li:first-child{float: left;}
.prod_tit li .pic{width: 100%; overflow: hidden;position: relative;z-index: 2; border: 1px solid rgba(255,255,255,0.3);border-radius: 100%;  -webkit-transition: .5s;  -moz-transition: .5s;  -ms-transition: .5s;  -o-transition: .5s;  transition: .5s;}
.prod_tit li .pic img{width: 110%;height: 110%;  -webkit-transition: .5s;  -moz-transition: .5s;  -ms-transition: .5s;  -o-transition: .5s;  transition: .5s;}
.prod_tit li:hover .pic{width: 110%;}
.prod_tit li i{position: absolute;right: -3px;bottom: -3px;z-index: 3; background: #E2B06A;height: 30px;font-size: 14px;line-height: 30px; color: #eccc77;text-align: center;font-style: normal; -webkit-transition: .5s;  -moz-transition: .5s;  -ms-transition: .5s;  -o-transition: .5s;  transition: .5s; padding:0 5px; border-radius:5px;    }
.prod_tit li.on i{color: #fff;}
.prod_right{float: right;width: 68%;height: 100%;position: relative;}
.prod_list{position: absolute;width: 100%;height: 100%;background: #fff;z-index: 1;}
.prod_list.on{z-index: 2;}
.prod_list .swiper-container{height: 100%;width: 100%;}
.prod_list .swiper-wrapper{height: 100%;}
.prod_list .swiper-container .swiper-slide{position: relative; height: 100%;width: 100%;background-repeat: no-repeat;background-size: cover;background-position: center;}
.prod_list .swiper-container .swiper-slide .con{ position: absolute;left: 50%;padding: 4px 5px;bottom: 10%;text-align: center;background: #93010b;-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);transform: translateX(-50%);}
.prod_list .swiper-container .swiper-slide .con .ico{white-space: nowrap; line-height: 66px;border: 1px solid rgba(255,255,255,0.5);padding: 0 30px;font-size: 42px;color: #fff;position: relative;}
.prod_list .swiper-container .swiper-slide .con .ico i{position: absolute;width: 7px;height: 8px;}
.prod_list .swiper-container .swiper-slide .con .ico .i1{background-image: url("../images/prod1_12.jpg");left: -1px;top:-1px;}
.prod_list .swiper-container .swiper-slide .con .ico .i2{background-image: url("../images/prod1_14.jpg");right: -1px;top:-1px;}
.prod_list .swiper-container .swiper-slide .con .ico .i3{background-image: url("../images/prod1_18.jpg");left: -1px;bottom: -1px;}
.prod_list .swiper-container .swiper-slide .con .ico .i4{background-image: url("../images/prod1_19.jpg");right: -1px;bottom: -1px;}
.prod_list .swiper-button-prev{left: 26px;outline:0 none !important; width: 60px;height: 60px;margin-top: -30px; background: url("../images/ind1_64.png") no-repeat center;background-size: 100%;cursor: pointer;  -webkit-transition: .5s;  -moz-transition: .5s;  -ms-transition: .5s;  -o-transition: .5s;  transition: .5s;}
.prod_list .swiper-button-next{right: 26px;outline:0 none !important; width: 60px;height: 60px;margin-top: -30px; background: url("../images/ind1_67.png") no-repeat center;background-size: 100%;cursor: pointer;  -webkit-transition: .5s;  -moz-transition: .5s;  -ms-transition: .5s;  -o-transition: .5s;  transition: .5s;}
.prod_list .swiper-button-prev:hover{background-image: url("../images/ind1_65.png");box-shadow: 0 0 30px -6px #000;}
.prod_list .swiper-button-next:hover{background-image: url("../images/ind1_68.png");box-shadow: 0 0 30px -6px #000;}
@media (max-width: 1400px) {
    .prod_left .img1{width: 150px;margin-left: -75px;    top: 180px;}
    .prod_left .con{top: 30%;}
    .prod_tit{width: 256px;    top: 350px;margin-left: -120px;}
    .prod_list .swiper-container .swiper-slide .con .ico{font-size: 30px;line-height: 50px;}

}
@media (max-width: 1100px) {
    body{padding-top: 50px;}
}
@media (max-width: 767px){
    .product{height: auto;padding-bottom: 20px;}
    .prod_left{width: 100%;height: auto;padding: 30px 20px 50px;float: none;overflow: hidden;}
    .prod_left .img1{width: 40%;float:none;position: relative;left: auto;top:auto;margin:16% auto 0;}
    .prod_left .con{float: right;position: relative;left: auto;top:auto;margin: 0 12% 0 0;}
    .prod_right{width: 100%;float: none;height: 500px;}
    .prod_tit li{width: 40%; height:auto; margin:0 5%;margin-bottom:20px;}
    .prod_list .swiper-container .swiper-slide .con .ico{font-size: 18px;line-height: 30px;padding: 0 15px;}
    .prod_list .swiper-button-next{right: -10px;}
    .prod_list .swiper-button-prev{left: -10px;}
    .prod_list img{display: block;}
    .prod_list{position: relative;left: auto;top:auto;}
    /*.product_2{position: absolute;top: 0;left: 0;width: 100%;}*/
    .prod_list.on{display: block !important;}
    .prod_list .swiper-container .swiper-slide{height: auto;background: none !important;}
	.prod_tit {
    width: auto;
    bottom: 15px;
    margin-left: auto;
    position: static;
}
.prod_tit li:first-child {
    float: left;
}
.prod_tit li {
    float: left;
}




}