@charset "utf-8";
/*banner*/
.i_banner { width: 100%; overflow: hidden; position: relative;}
.i_banner .item { width: 100%; display: block; overflow: hidden; position: relative; }
.i_banner .item .cp_txt { width: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; z-index: 2; }
.i_banner .item img{ width: 100%; height:auto; transition: all 1s ease 2.5s;}
.i_banner .owl-item.active img{ animation-name: uk-kenburns; animation-duration: 15s; }
.i_banner .owl-pagination { position: absolute; left: 0; bottom:5%; text-align: center; }
.i_banner .owl-buttons div { width: 50px; height: 100%; background: url(../images/next.png) no-repeat center; display: block; position: absolute; top: 0; opacity: 0.4; }
.i_banner .owl-buttons div:hover { opacity: 1; }
.i_banner .owl-buttons div.owl-prev, .i_banner .owl-buttons div:hover.owl-prev { left: 3%; -webkit-transform: rotate(180deg); transform: rotate(180deg); }
.i_banner .owl-buttons div.owl-next, .i_banner .owl-buttons div:hover.owl-next { right: 3%; }


.more{ width:auto; display:block; padding:1.3vw 3.2vw;}
.more1{ background:url(../images/bg1.jpg) repeat-y; background-size:100% 100%; color:#FFF;}
.more1:hover{ background:url(../images/bg2.jpg) repeat-y; background-size:100% 100%; color:#FFF;}
/*about*/
.abouts{ width: 100%; overflow: hidden; position: relative; z-index:1;}
.abouts_bg{ width: 100%; background-repeat: no-repeat; background-position: right center; background-size:67.5% 100%;}
.about_nr{ width:63.4375%; padding-left:11%; margin:6.5vw 0;}
.about_nr .about_l{ width:100%;}
.about_nr .about_l .about_ly{ width:69.5%;}
.about_nr .about_l .about_ry{ width:19%;}
.about_nr .about_l .about_ry dl{ padding:2.5vw 0; width:100%;}
.about_nr .about_l .about_ry dl:nth-of-type(1){ background:#60bfa1;}
.about_nr .about_l .about_ry dl:nth-of-type(2){ background:#1db9d0;}
.about_nr .about_l .about_ry dl:nth-of-type(3){ background:#005dad;}
.about_nr .about_l .about_ry dl:nth-of-type(1):hover, .about_nr .about_l .about_ry dl:nth-of-type(2):hover, .about_nr .about_l .about_ry dl:nth-of-type(3):hover{ background:url(../images/bg1.jpg) repeat-y; background-size:100% 100%;}
.about_nr .about_l .about_ry dl dt img{ width:auto; max-height:2.2vw; margin:0 auto;}
.about_nr .about_l .about_ry dl:hover a{ color:#fff;}

/*cplb*/
.cplb{ display: flex; overflow:hidden;}
.cplb dl{ width: 33.33%; background:#333542; transition: .6s; position: relative; overflow:hidden;}
.cplb dl dt{ width:100%; height:42.5vw; background-repeat: no-repeat; background-position: left center; background-size:cover;}
.cplb dl dd{ width: 100%; height:100%; position:absolute; left:0; bottom:0; z-index:1;}
.cplb dl .cplb_txt{ width: 100%; height:100%; position:absolute; left:0; bottom:-100%; z-index:0;}
.cplb dl .cplb_txt .cplb_nr{ width:70%; margin:0 auto;}
.cplb dl .ioc_img img{ width:auto; height:3.3vw;}
.cplb:hover dl{ width: 25.5%;}
.cplb dl:hover{ width: 49%;}
.cplb dl:hover dd{ bottom:-100%;}
.cplb dl:hover .cplb_txt{ bottom:0;}
.cplb dl:hover dt{ background-position: center center;}

/*news*/
.news{ background-image:url(../images/bg3.jpg);}
.news .new_img .item { width: 100%; display: block; overflow: hidden; position: relative; }
.news .new_img .item dl{ background:#FFF;}
.news .new_img .item dl dt p{ background:url(../images/ioc2.png) no-repeat left center; padding-left:26px;}
.news .new_img .item dl:hover{ background:url(../images/bg1.jpg) repeat-y; background-size:100% 100%; color:#FFF;}
.news .new_img .item dl:hover a{ color:#FFF;}
.news .new_img .item dl:hover dt p{ background:url(../images/ioc3.png) no-repeat left center; padding-left:26px;}
.news .new_img .owl-item:nth-of-type(even){ padding-top:6.1vw;}
.news .owl-pagination{ padding-top:25px; text-align:center;}
.news .owl-buttons div{ display:none;}

/*case*/
.case{ position:relative; color:#FFF;}
.case .case_txt{ width:38%; position:absolute; left:11%; top:0; height:100%;}
.case .case_txt .f50 a{ color:#FFF;}
.case .case_fr{ width:auto; position:absolute; right:11%; bottom:17%; text-align:right;}






@media screen and (max-width: 1600px) and (min-width:0) {
/*about*/
.abouts_bg{ background-size:75% 100%;}
.about_nr{ width:66.4375%; padding-left:7%; margin:7vw 0;}
.about_nr .about_l .about_ly{ width:80%;}
.about_nr .about_l .about_ry{ width:16%;}
.about_nr .about_l .about_ry dl{ padding:2vw 0;}
.about_nr .about_l .about_ry dl dt img{ max-height:2vw;}



/*cplb*/
.cplb dl .cplb_txt .cplb_nr{ width:85%;}


/*case*/
.case .case_txt{ width:52%; left:7%;}
.case .case_fr{ right:7%; bottom:12%;}


}


@media screen and (max-width: 1300px) and (min-width:0) {
/*about*/
.abouts_bg{ background-size:85% 100%;}
.about_nr{ width:68.4375%; padding-left:5%; margin:9vw 0;}

.about_nr .about_l .about_ry dl{ padding:1.8vw 0;}
.about_nr .about_l .about_ry dl dt img{ max-height:1.8vw;}
/*cplb*/
.cplb dl .cplb_txt .cplb_nr{ width:90%;}
/*case*/
.case .case_txt{ width:55%; left:5%;}
.case .case_fr{ right:5%; bottom:12%;}
}




@media screen and (max-width: 1100px) and (min-width:0) {

}




@media screen and (max-width: 1024px) and (min-width:0) {
/*banner*/
.i_banner { margin-top: 0.78rem; }
.i_banner .item .cp_txt .f72{ font-size:0.65rem;}
.i_banner .owl-item.active img{ animation-name: none; animation-duration: none; }
.i_banner #owl-demo .owl-item.active .ban_l{ -webkit-animation: none; animation: none;}
.i_banner #owl-demo .owl-item.active .ban_r { -webkit-animation: none; animation: none; }
.i_banner #owl-demo .owl-item.active .text-center{ -webkit-animation: none; animation: none;}

.more{ padding:0.26rem 0.64rem;}


/*about*/
.abouts_bg{ background-position: center center; background-size:100% 100%;}
.about_nr{ width:100%; padding-left:0%; margin:0 0;}
.about_nr .about_l{ width:96%; margin:0 2%;}
.about_nr .about_l .about_ly{ width:100%;}
.about_nr .about_l .about_ly .f40{ font-size:0.36rem;}
.about_nr .about_l .about_ry{ width:100%; padding-top:0.35rem;}
.about_nr .about_l .about_ry dl{ padding:0.5rem 0; width:33.33%; float:left;}
.about_nr .about_l .about_ry dl dt img{ max-height:0.44rem;}

/*cplb*/
.cplb{ display:inherit; overflow:hidden;}
.cplb dl{ width: 100%; z-index:1;}
.cplb dl dt{ height:100%; position:absolute; left:0; bottom:0;}
.cplb dl .cplb_txt{ height:auto; position:inherit; left:inherit; bottom:inherit; z-index:inherit; padding:0.35rem 0;}
.cplb dl .cplb_txt .cplb_nr{ width:96%;}
.cplb dl .ioc_img img{ height:0.6rem;}
.cplb:hover dl{ width: 100%;}
.cplb dl:hover{ width: 100%;}
.cplb dl:hover .cplb_txt{ bottom:inherit;}



/*news*/
.news .new_img .item dl dt p{ padding-left:0.26rem;}
.news .new_img .item dl:hover dt p{ padding-left:0.26rem;}
.news .new_img .owl-item:nth-of-type(even){ padding-top:0;}
.news .owl-pagination{ padding-top:0.25rem;}



/*case*/
.case{ color:#282828}
.case .case_txt{ width:96%; position:inherit; left:inherit; top:inherit; height:auto; padding:0.65rem 2%;}
.case .case_txt .f50 a{ color:#282828;}
.case .case_fr{ width:auto; position:inherit; right:inherit; bottom:inherit; text-align:left; margin:0 2%; float:left;}
.case .case_fr .bob1 { border-bottom: 1px solid rgba(204,204,204,0.5); }
.case .use_bg{ padding-top:0.25rem;}






}


/* animation */
@keyframes uk-kenburns { 0% {
transform:scale(1)
}
100% {
transform:scale(1.2)
}
}
 @-webkit-keyframes tracking-in-contract { 0% {
letter-spacing:1em;
opacity:0
}
40% {
opacity:.6
}
100% {
letter-spacing:normal;
opacity:1
}
}
@keyframes tracking-in-contract { 0% {
letter-spacing:1em;
opacity:0
}
40% {
opacity:.6
}
100% {
letter-spacing:normal;
opacity:1
}
}
.rotate-center { -webkit-animation: rotate-center 4s linear infinite both; animation: rotate-center 4s linear infinite both }
@-webkit-keyframes rotate-center { 0% {
-webkit-transform:rotate(0);
transform:rotate(0)
}
100% {
 -webkit-transform:rotate(360deg);
transform:rotate(360deg)
}
}
.slide-bottom-back { -webkit-animation: slide-bottom-back 2s linear infinite both; animation: slide-bottom-back 2s linear infinite both }
@-webkit-keyframes slide-bottom-back { 0% {
-webkit-transform:translateY(0px);
transform:translateY(0px)
}
20% {
-webkit-transform:translateY(-3px);
transform:translateY(-3px)
}
50% {
-webkit-transform:translateY(8px);
transform:translateY(8px)100% {
-webkit-transform:translateY(0px);
transform:translateY(0px)
}
}
}
@keyframes slide-bottom-back { 0% {
-webkit-transform:translateY(0px);
transform:translateY(0px)
}
20% {
-webkit-transform:translateY(-3px);
transform:translateY(-3px)
}
50% {
-webkit-transform:translateY(8px);
transform:translateY(8px)100% {
-webkit-transform:translateY(0px);
transform:translateY(0px)
}
}
}
.heartbeat { -webkit-animation: heartbeat 1.5s ease-in-out infinite both; animation: heartbeat 1.5s ease-in-out infinite both }
@-webkit-keyframes heartbeat { from {
-webkit-transform:scale(1);
transform:scale(1);
-webkit-transform-origin:center center;
transform-origin:center center;
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
10% {
-webkit-transform:scale(.91);
transform:scale(.91);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
17% {
-webkit-transform:scale(.98);
transform:scale(.98);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
33% {
-webkit-transform:scale(.87);
transform:scale(.87);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
45% {
-webkit-transform:scale(1);
transform:scale(1);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
}
@keyframes heartbeat { from {
-webkit-transform:scale(1);
transform:scale(1);
-webkit-transform-origin:center center;
transform-origin:center center;
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
10% {
-webkit-transform:scale(.91);
transform:scale(.91);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
17% {
-webkit-transform:scale(.98);
transform:scale(.98);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
33% {
-webkit-transform:scale(.87);
transform:scale(.87);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
45% {
-webkit-transform:scale(1);
transform:scale(1);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
}
 @keyframes uk-fade { 0% {
opacity:0
}
100% {
opacity:1
}
}
 @keyframes uk-slide-bottom { 0% {
transform:translateY(100%)
}
100% {
transform:translateY(0)
}
}
