.Modular{padding: 0px 0 0;background: url(../../images/shop/banner1.png);background-size: 120%; overflow: hidden;height: 580px;}
.Modular-box{ position: relative;margin-top:80px;}
.Modular-box .left{width: 300px;height: 613px; position: relative; background-size: cover; float: left; margin-left: 100px; bottom: -0px; box-shadow: 15px 30px 200px rgb(212, 136, 55), 0px 0px 7px rgb(232, 146, 62) inset; border-radius: 55px;}
.Modular .swiper-container{width: 262px; height: 428px; margin: 73px 0 0 19px;}
.swiper-container .swiper-slide{height:500px; width: 100%;}
.arrow-left,.arrow-right{position: absolute;top: 50%;margin-top: -65px;width: 40px;height: 40px;z-index:999;display: block;}
.arrow-left {background: url(../../images/shop/detail/left.png) no-repeat left top;left: -60px;}
.arrow-left:hover{background: url(../../images/shop/detail/left_hover.png) no-repeat left top;}
.arrow-right {background: url(../../images/shop/detail/right.png) no-repeat left bottom;right: -60px;}
.arrow-right:hover{background: url(../../images/shop/detail/right_hover.png) no-repeat left top;}
.arrow-left,.arrow-right{ opacity: 0.5;}
.arrow-left:hover,.arrow-right:hover{ opacity:1; transform: scale(1.1);}
.arrow-left:active,.arrow-right:active{ opacity:1; transform: scale(0.9);}

.Modular-box .right{margin-left:530px;padding:40px 0 0 0; color:#fff;}
.Modular-box .right h2{font-size: 48px;line-height: 100%;padding-bottom: 0px;}
.Modular-box .right p{height:54px;overflow: hidden;}
.Modular-box h2 i{font-style: initial;font-size:12px; line-height:26px; display: inline-block; margin-left: 20px; font-weight: normal; background:rgba(0,0,0,0.2); border-radius: 3px; vertical-align: bottom; margin-bottom: 5px; padding: 0 12px; opacity: 0.7;}
.Details-info img{max-width: 100%;display: inline-block;margin: 20px auto;}
.right-info{margin-top: 20px;}
.Modular-box h3{ padding-left: 15px; line-height: 100%; font-size:20px; border-left: 3px solid #fff;}
.Modular-box .info-item{padding: 10px 0 20px;}
.Modular-box .info-item:nth-child(n+2){ border-top: 1px solid rgba(255,255,255,0.2);}
.Modular-box .info-item span{padding:0 10px 0 10px; line-height: 32px; margin:0 25px 8px 0;font-size: 16px;display: inline-block; background:rgba(0,0,0,0.1); border-radius: 3px;  color:#fff; position: relative;}
.Modular-box .info-item span:after{ content:""; display: block; width: 0; height: 0; border: 16px solid; border-color:transparent transparent transparent rgba(0,0,0,0.1); position: absolute; top: 0; right:-32px;}
.Modular-box .info-item span i{
    margin-right:30px;
    margin-left:8px;
}
.Modular-box .info-item span:before{ content: ""; display: block; width:8px; height: 8px; border-radius: 50%; position: absolute; top: 12px; right: -6px; background: rgba(0,0,0,0.1);}
.Details h2{padding: 30px 50px;font-size: 30px; background: #f5f5f5;}

.right-info a{margin-top:20px;height: 36px;line-height: 36px;display:inline-block;background: #fff;padding:0 30px;border-radius: 100px;color:#000;}
.right-info a:hover{color:#09BB07;}

.Course{display: none;position: fixed;top: 0;left: 0;width:100%;height:100%;background: rgba(0,0,0,.6);z-index: 999;-webkit-animation: popupbg 0.4s ease forwards;-webkit-opacity: 0;}
.Course .Course-box{position: absolute;top:50%;left: 50%; margin: -270px 0 0 -160px;-webkit-animation: popup 0.4s ease forwards;-webkit-opacity: 0;}
.Course.active{display: block;}
.foot_btn{
	display: none;
}
@media screen and (max-width: 900px){
	  html {
		font-size: 22.08px !important;
	  }
	  html,body{
		  width: 100%;
		  min-width: 100%;
	  }
	  .wrap{
		  width: 100%;
		  max-width: 100%;
		  overflow: hidden;
	  }
	  .Modular{
		  height: auto;
	  }
	  .Details h2{
		  font-size: 24px !important;
		  padding: 30px 0 !important;
		  text-align: center;
	  }
	  .Details-info{
		  padding: 0 10px !important;
	  }
	  .case{
		  padding: 30px 10px !important;
	  }
	  .Modular-box .left{
		  width: 200px;
		  height: 400px;
		  margin-left: 80px;
		  border-radius:35px;
	  }
	  .Modular-box{
		  margin-top: 50px;
	  }
	  .Modular .swiper-container{
		  width: 175px;
		  height: 310px;
		  margin: 49px 0 0 12px;
	  }
	  .Modular-box .right{
		  margin-left: 0px;
		  padding: 10px;
		  overflow: hidden;
		  width: calc(100% - 20px);
	  }
	  .Modular-box .right h2{
		  font-size: 24px;
		  margin: 0px !important;
	  }
	  .Modular-box .right p{
		  font-size: 14px;
		  height: auto;
	  }
	  .right-info{
		  margin-top: 0px;
	  }
	  .Modular-box h3{
		  font-size: 18px;
		  margin-bottom: 10px !important;
	  }
	  .Modular-box .info-item span{
		  font-size: 14px;
		  line-height: 25px;
		  padding: 10px;
	  }
	  .Modular-box .info-item{
		  padding-bottom: 10px;
	  }
	  .right-info a{
		  margin-top: 10px;
		  height: 30px;
		  line-height: 30px;
		  font-size: 16px;
		  padding: 0 15px;
	  }
	  .caselist{
	  		  display: flex;
	  		  justify-content: space-between;
	  		  flex-wrap: wrap;
	  }
	  .foot_btn{
		  display: block;
		  position: fixed;
		  z-index: 9999;
		  color: #FFFFFF;
		  height: 35px;
		  width: 35px;
		  overflow: hidden;
		  border-radius: 100%;
		  text-align: center;
		  line-height: 10px;
		  padding-top: 4px;
		  box-sizing: border-box;
		  border: rgba(255, 255, 255, 0.35) solid 1px;
	  }
	  .foot_btn a{
		  font-size: 12px;
		  color: #FFFFFF;
	  }
	  .yinyong{
		  background:#fc4b69 ;
		  bottom: 140px;
		  right: 10px;
	  }
	   .anli{
		  background:#fc4b69 ;
		  bottom: 100px;
		  right: 10px;
	  }
	  .liucheng{
		  background:#fc4b69 ;
		  bottom: 60px;
		  right: 10px;
	  }
	  .jieru{
		  background:#fc4b69 ;
		  bottom: 20px;
		  right: 10px;
	  }
}