@charset "utf-8";
.pusher { transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s; -webkit-transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s; width:86%; max-width:1480px; float:right; position:relative;}
.pusher-black { position: fixed; width: 100%; height: 100%; left: 0px; top: 0px; background: url(../images/black_50.png) repeat; background:none rgba(0,0,0,0.5); display: none; z-index: 900; }
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-loading .slick-list {  }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-list, .slick-track, .slick-slide, .slick-slide img { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; left: 0; top: 0; display: block; zoom: 1; }
.slick-track:before, .slick-track:after { content: ""; display: table; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
/* Arrows */
.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0; font-size: 0; cursor: pointer; background: transparent; color: transparent; padding: 0; border: none; outline: none; }
/* Dots */
.slick-dots { position: absolute; list-style: none; display: block; text-align:left; padding: 0px; width:350px; }
.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0px 5px; padding: 0px; cursor: pointer; }
.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0; font-size: 0; color: transparent; padding: 5px; cursor: pointer; outline: none; }
.slick-dots li button:focus { outline: none; }
@-webkit-keyframes scaleUpDown {
    from { -webkit-transform: scale(1.08); transform: scale(1.08); }
    to { opacity: 1;  -webkit-transform: scale(1); transform: scale(1);}
}

@keyframes scaleUpDown {
    from { -webkit-transform: scale(1.08); transform: scale(1.08);}
    to { opacity: 1;  -webkit-transform: scale(1); transform: scale(1);}
}

/*index style*/
.align-vertical { height: 100%; width: 100%; position: relative; display: table; }
.vertical-inner { display: table-cell; vertical-align: middle; }
.bannerddBox{ position: relative; overflow: hidden; color: #fff;}
.bannerddBox .bannerdd{ visibility: hidden; transition: visibility 300ms; -webkit-transition: visibility 300ms;}
.bannerddBoxShow .bannerdd{ visibility: visible;}
.bannerdd a:link, .bannerdd a:visited{ color: #fff;}
.bannerdd a:active,.bannerdd a:hover { color: #fff;}
.bannerdd .pimg{ display: block; width: 100%;border-radius: 20px 0 20px 20px;}
.bannerdd .item{ position: relative; overflow: hidden; z-index: 10;}
.binbox{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block;}
.binbox .vertical-inner{ padding: 0px 152px; transform: translateX(88px); -webkit-transform: translateX(88px); transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; opacity: 0;}
.binbox .t{ font-weight: bold; font-size: 50px; line-height: 1.2;}
.binbox .bot{ width: 26px; height: 4px; background-color: #fff; margin: 12px 0px 18px 2px; display: block;}
.binbox .c{ font-size: 26px; line-height: 1.2; margin-bottom: 20px;}
.btn-more{ background-color: #fff; width: 102px; height: 36px; line-height: 36px; text-align: center; display: block; position: relative; z-index: 1;}
.btn-more .txt{ color: #626262;}
.btn-more:before{ content:""; width:100%; height:100%; z-index: -1; position:absolute; left:0; top:0; background-color:#E40D08; transform-origin:100%; -webkit-transform-origin:100%; -webkit-transition:-webkit-transform .38s cubic-bezier(.4,0,.2,1); transition:transform .38s cubic-bezier(.4,0,.2,1);  transform:scaleX(0); -webkit-transform:scaleX(0); visibility:hidden\9;}
.btn-more:hover:before{ transform:scaleX(1); -webkit-transform:scaleX(1); -moz-transform:scaleX(1); transform-origin:0; -webkit-transform-origin:0; visibility:visible\9;}
.btn-more:hover .txt{ color: #fff;}
.bannerdd .slick-dots{ bottom:100px; z-index: 105; right:0;}
.bannerdd .slick-dots li{ position: relative; display: inline-block; width:35px; height:2px; margin:0 5px 0 0; cursor: pointer; }
.bannerdd .slick-dots li a{ height:2px; width: 35px; line-height: 20px; text-indent: -10em; display: block; overflow: hidden; padding: 0px; cursor: pointer;  border-radius: 0%; background-color:rgba(255,255,255,0.5); }
.bannerdd .slick-dots li a:focus{ background-color:#fff;  }
.bannerdd .slick-dots li.slick-active a { opacity: 1; visibility: visible;background-color:#fff;}
.bannerdd .slick-arrow{ width: 37px; height: 64px; z-index: 105;  top: 50%; margin-top: -32px; }
.bannerdd .slick-arrow i{ width: 100%; height: 100%; display: block; transition: 300ms; -webkit-transition: 300ms;}
.bannerdd .slick-prev{ left: 0; }
.bannerdd .slick-next{ right: 0;}
 .bannerdd .slick-active .pimg{/* visibility: visible !important; -webkit-animation: scaleUpDown 6s forwards cubic-bezier(0.250, 0.460, 0.450, 0.940); animation: scaleUpDown 6s forwards cubic-bezier(0.250, 0.460, 0.450, 0.940);*/}
.slick-active .binbox .vertical-inner{ transform: translate(0,0); -ms-transform: translate(0,0); -webkit-transform: translate(0,0); opacity: 1; transition: 680ms 120ms; -webkit-transition: 780ms 120ms; }
.bannerdd .item{ opacity:1 !important;}
@-webkit-keyframes slideIn { 0% {-webkit-transform:translateX(100%);opacity:1;} 100% {-webkit-transform:translateX(0);opacity:1;} } 
@keyframes slideIn { 0% {transform:translateX(100%);opacity:1;} 100% {transform:translateX(0);opacity:1;} } 
@-webkit-keyframes imgIn { 0% {-webkit-transform:-webkit-translateX(-85%);opacity:1;} 100% {-webkit-transform:-webkit-translateX(0);opacity:1;}}
@keyframes imgIn { 0% {transform:translateX(-85%);opacity:1;} 100% {transform:translateX(0);opacity:1;}}
.bannerdd .slick-active.item {-webkit-animation: slideIn 1600ms cubic-bezier(0.190, 1, 0.420, 1); animation: slideIn 1600ms cubic-bezier(0.190, 1, 0.420, 1); -moz-animation: slideIn 1600ms cubic-bezier(0.190, 1, 0.420, 1);}
.bannerdd .slick-active .pimg { -webkit-animation: imgIn 1600ms cubic-bezier(0.190, 1, 0.420, 1); animation: imgIn 1600ms cubic-bezier(0.190, 1, 0.420, 1); -moz-animation: imgIn 1600ms cubic-bezier(0.190, 1, 0.420, 1); } 
.btitle{ position:absolute; background-color:rgba(236,64,70,0.8); width:550px; right:-100px; box-sizing:border-box; padding:70px 30px 40px 100px; bottom:-120px;}
.btitle p{ font-size:16px; color:#fff; line-height:30px;}
@media screen and (max-width:1370px){
.btitle{ padding:40px 30px 30px 100px; bottom:-75px;}
.btitle p{ line-height:24px;}
}
@media screen and (max-width:1200px){
.btitle{ width:450px; padding:50px 30px 40px 80px; bottom:-99px;}
.bannerdd .slick-dots {  width:269px; right:0;bottom: 94px;}
}
@media screen and (max-width:1024px){
.pusher {width:97%;}
.btitle{right:-68px;}
.bannerdd .slick-dots {  width:269px; right:0;bottom: 86px;}
.bannerdd .slick-dots {width: 298px;}
}
@media screen and (max-width:930px){
.pusher {width:100%;}
.btitle{ width:100%; padding:20px; bottom:auto; right:0;/* display: none;*/background-color: rgba(236,64,70,1);}
.bannerdd .pimg{ border-radius: 0}
.bannerdd .slick-dots {  width:58%; right:0;bottom: 12px;}
.btitle p{  line-height:24px;        font-size: 14px;}

.page1:before{background:none;}
}










/* CSS Document */

