.rule_banner{ position:relative; overflow:hidden;}
.rule_banner img{ display:block; position:relative; width:600px; left:50%;
 -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

.Modular{padding:0;background: #fdd000;background: linear-gradient(45deg, #fdd000, #fda085); overflow: hidden;}
.Modular-box{ position: relative;}
.Modular-box .left{width:250px;height:515px; position: relative; background-size:auto 100%; margin:0 auto; box-shadow: 15px 30px 200px rgba(0,0,0,0.4),0 0 4px rgba(0,0,0,0.4) inset; border-radius:35px;}

.Modular .swiper-container{width: 306px; height:544px; margin: 85px 0 0 22px;}
.swiper-container .swiper-slide{height:500px; width: 100%;}
.arrow-left,.arrow-right{position: absolute;top: 50%;margin-top: -15px;width: 40px;height: 40px;z-index:999;display: block;}
.arrow-left {background: url(../images/left.png) no-repeat left top;left: -60px;}
.arrow-left:hover{background: url(../images/left_hover.png) no-repeat left top;}
.arrow-right {background: url(../images/right.png) no-repeat left bottom;right: -60px;}
.arrow-right:hover{background: url(../images/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{padding:5% 3%; color:#fff;}
.Modular-box .right h2{font-size:26px; font-weight: bold; line-height: 100%; padding:15px 0;}
.Modular-box .right p{ line-height:1.8;}
.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; padding: 0 12px; opacity: 0.7;}
.Details-info img{max-width: 100%;display: inline-block;margin: 20px auto;}




.right-info{ }
.Modular-box h3{ padding-left: 15px; line-height: 100%; font-size:18px; border-left: 3px solid #fff;}
.Modular-box .info-item{ padding:20px 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:7px 10px; line-height:1.5; margin:12px 25px 8px 0;font-size: 12px;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: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;}


.rule_floatPicB,.rule_floatPicT{ display:none;}