/* CSS Document */
html,body{min-height:100%;-webkit-text-size-adjust: none; height: auto;}
body{font:14px "微软雅黑";color:#ffffff;height: auto;background: rgb(244,244,244);overflow-x: hidden }
body,div,dl,dt,dd,ul,li,p,form,span,em,abbr,input,textarea,table,button,h1,h2,h3{margin:0; padding:0; border:0;font: 14px "微软雅黑";}
input,textarea{font-size:26px;outline:none;}
textarea{color:#333; resize:none;}
img{border:0; vertical-align:top;}
li{list-style:none;}
em{font-style:normal;}
a{text-decoration:none; outline:none;color:#7a7776;}
a:hover{text-decoration:none;}
*{-webkit-touch-callout:none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
body{ background-color:#f6f6f6;}
.cursor{cursor:pointer;}
.boxshadow{-moz-box-shadow:0 0 3px rgba(0,0,0,0.1);	-webkit-box-shadow:0 0 3px rgba(0,0,0,0.1);  box-shadow: 0 0 3px rgba(0,0,0,0.1);}
strong span{font-weight: bold}
/*首页开始*/


/*头部样式*/
.header{ width: 100%; height: 8vh; background: #0e56a0;  position: fixed; top: 0; left: 0; z-index: 1003; box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);}
.header .box{ width:1200px; height: 8vh; background: #0e56a0;  margin: 0 auto; position: relative; }
.header .box .logo{ padding-top: 10px;  }
.header .box .logo img{ width: 154px; }
.header .titlelist{ position: absolute; right: 0; top: 0; }
.header .titlelist li{float: left; margin-left: 77px; line-height: 8vh; color: #ffffff; font-size: 16px; cursor:pointer;}
.header .titlelist li.hover a{ color: #f1983a; }
.header .titlelist li a{ color: #fff}
.header .titlelist li.thisindex a{ color: #f1983a; }
.header .titlelist li.products{ display: flex; align-items: center; }
.header .titlelist li.products span{ font: inherit; }
.header .titlelist li.products img{ width: 20px; transform: rotateX(0deg);}
.header .titlelist li.products.active img{ width: 20px; transform: rotateX(180deg);}

.header .titlelist li.industry{ display: flex; align-items: center; }
.header .titlelist li.industry span{ font: inherit; }
.header .titlelist li.industry img{ width: 20px; transform: rotateX(0deg);}
.header .titlelist li.industry.active img{ width: 20px; transform: rotateX(180deg);}

.header .popover{ background: #FFFFFF; color: black; display: none; padding-bottom: 20px; box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);}
.header .popover .wrapper{ width: 15%; margin: 20px 0 0 15%; float: left;}
.header .popover .wrapper .title{ border-bottom: 1px solid black; margin: 6px 0;padding-bottom: 6px; font-size: 16px;}
.header .popover .wrapper .title img{ width: 40px; vertical-align: bottom; }
.header .popover .wrapper ul{ padding: 0 10px 20px;}
.header .popover .wrapper ul li{ float: left; align-items: center; width: 100%; margin: 6px 0;overflow: hidden;}
.header .popover .wrapper ul li > a{ color: inherit;}
.header .popover .wrapper ul li > a:hover{ color: #f1983a;}
.header .popover .wrapper ul li img{  width: 20px; margin-right: 6px;filter: drop-shadow(#2566a9 80px 0);position: relative;left: -80px;}

.header .tradepopover { background: #FFFFFF; color: black; display: none; padding-bottom: 20px; box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);}
.header .tradepopover .wrapper{ width: 15%; margin: 20px 0 0 15%; float: left;}
.header .tradepopover .wrapper .title{ border-bottom: 1px solid black; margin: 6px 0;padding-bottom: 6px; font-size: 16px;}
.header .tradepopover .wrapper .title img{ width: 40px; vertical-align: bottom; }
.header .tradepopover .wrapper ul{ padding: 0 10px 20px;}
.header .tradepopover .wrapper ul li{ float: left; align-items: center; width: 100%; margin: 6px 0;overflow: hidden;}
.header .tradepopover .wrapper ul li > a{ color: inherit;font-size: 16px;}
.header .tradepopover .wrapper ul li > a:hover{ color: #f1983a;}
.header .tradepopover .wrapper ul li img{ width: 20px; margin-right: 6px;filter: drop-shadow(#2566a9 80px 0);position: relative;left: -80px;}
/*banner区域*/
.banner{ width: 100%; margin-top: 8vh; height: 46vh;}
.banner .box{ width:100%; background: none;  position: relative;height: 100%; }
.banner .box .ai{ position: absolute; right: 0; top: 213px}
.banner .box .logo{ width: 350px;position: absolute; top: 248px; left: 0; }
.banner .box .logo img{display:block;width:100%;}
.banner .box .text{ padding-right: 148px;  text-align: right; font-size: 36px; color: #ffffff; line-height: 32px; margin-bottom: 30px; letter-spacing: 10px; }
.banner .box .text.text3{ font-size: 24px; padding-top: 8px; }
.banner .box .text.text3 span{ display: inline-block; margin-right: 35px; width: 114px; height: 1px; background: #ffffff; position: relative; top: -7px; }
.banner .box .text.text2{ margin-right: -32px;  }
.banner .box .text.text1{ padding-top: 200px; }
.swiper-container{
    height: 100%;
}
.swiper-container img{
    height: 100%;
}
.clearfix::after{
    display: block;
    content: '';
    clear: both;
}
#canvas{
    width: 100%;
    height: 500px;
    position: absolute;
    z-index: 0;
}

.indexinfo .index-header {
    background: url(../images/index-hederbg.jpg) left center/cover no-repeat;
    /* margin-top: 8vh; */
    position: absolute;
    top: 8vh;
    height: 92vh;
    width: 100%;
}



/*首页内容区域*/

.indexinfo{ background: url(../images/indexinfo_top.jpg) center top no-repeat, url(../images/buinfo_bottom.jpg) center bottom no-repeat,#f6f6f6;}
.content{
    /*background: rgb(244,244,244);*/
    /*position: relative;*/
    /*top: 20vh;*/
    color: #fff;
    min-height: 100px;
    text-align: center;
}
.content .imgicon{ position: relative; top: 18vh; }
.content .imgicon img {position: relative; animation: vertical-slide .5s linear infinite alternate;}
@keyframes vertical-slide{
    from  {top: 5px;}
    to  {top: -5px;}
}
.content .mingtech{ height: 36vh; width: 1000px;  margin: 0 auto; padding: 23vh 0 0;}
.content .mingtech .title{  font:32px "微软雅黑"; color: #000000;   margin: 0 auto; text-align: center; line-height: 34px; letter-spacing: 2px;}
.content .mingtech .title span{ display: inline-block; width: 50px; height: 4px; background: #f1983a; position:relative; top: -10px; margin: 0 15px;}
.content .mingtech .small_title{  font-size:30px; line-height: 28px; text-align: center; padding: 35px;   }
.content .mingtech .text{ font-size: 16px; line-height: 27px; text-align: center; padding-top: 18px; }


.content .target{
    width: 100%;
    height: 46vh;
    margin-top: 20vh;
    position: relative;
    /*background: url('../images/target_bg.jpg') left center/cover no-repeat;*/
    text-align: center;
}
.content .mingtech .introduce {
    text-align: center;
    font-size: 44px;
    padding: 40px 0;
    margin-top: 6vh;
    background: url(../images/introducebg.png) left center/cover no-repeat;
    background-size: 100% 100%;
    letter-spacing: 20px;
}

.content .target .title{
    color: #fff;
    /*position: absolute;*/
    /*left: 35%;*/
    /*top: 200px;*/
}

.content .target .title .text{
    font-size: 18px;
}

/*.content .target:hover .title{*/
    /*animation: shake .5s;*/
    /*-o-animation: shake .5s;*/
    /*-webkit-animation: shake .5s;*/
    /*-moz-animation: shake .5s;*/
/*}*/

.content .target .title p{
    font-size: 32px;
    line-height: 46vh;
}

.content .mission{
    width: 100%;
    height: 388px;
    position: relative;
    background: url('../images/mission_bg.jpg') left center/cover no-repeat;
}

.content .mission .title{
    color: #333;
    position: absolute;
    right: 60%;
    top: 200px;
}

.content .mission .title .text{
    font-size: 18px;
}

.mar-t-50{
    margin-top: 50px;
}
/*.content .mission:hover .title{*/
    /*animation: shake .5s;*/
    /*-o-animation: shake .5s;*/
    /*-webkit-animation: shake .5s;*/
    /*-moz-animation: shake .5s;*/
/*}*/

.content .mission .title p{
    font-size: 32px;
    margin-bottom: 10px;
}
.content .news{
    margin-top: 20px;
    background: url('../images/news_bg.jpg') left center/cover no-repeat;
}

.content .news .title{
    color: #333;
}

.content .news .more{
    font-size: 14px;
    color: #333;
    display: inline-block;
    margin-top: 27px;
    padding: 5px 20px;
    border-width: 1px;
    border-style: solid;
    border-color: #333;;
    border-image: initial;
}

.content .news .more a{
    color: #333;
}

.content .news .more:hover{
    border-color: #fff;
}

.content .news .more:hover a{
    color: #fff;
}

.content .bhyh{
    /*position: relative;*/
    /*top: 42vh;*/
    width: 100%;
    height: 426px;
    overflow: hidden;
    /*padding: 70px 0 0;*/
    background: url('../images/indexinfo_top.jpg') top center/cover no-repeat;
}

.content .bhyh .bhyh-content{
    width: 1200px;
    margin: 0 auto;
}

.content .bg2{
    background: url('../images/indexinfo_top.jpg') center center/cover no-repeat;
}

.content .bhyh .title{  font: 32px "微软雅黑"; color: #000000;   margin: 0 auto; text-align: center; line-height: 34px; letter-spacing: 2px; padding-bottom: 70px}
.content .bhyh .title span{ display: inline-block; width: 50px; height: 4px; background: #f1983a; position:relative; top: -10px; margin: 0 15px;}


.content .bhyh .box{
    width: 30%;
    margin: 0 1%;
    float: left;
    position: relative;
    overflow: hidden;
}
.content .bhyh .box:hover .boxHover > img{
    transform: scale(1.1);
}

.content .bhyh .box img{
    width: 100%;
    transition: all .7s;
    height: 300px;
}

.content .bhyh .box > div,
.content .bhyh .box a{
    color: #fff;
    position: absolute;
    left: 0;
    display: inline-block;
    width: 100%;
    text-align: center;
    top: 30%;
}
.content .bhyh .box > div > p,
.content .bhyh .box a > p{
    text-align: center;
    font-size: 25px;
    padding-top: 40px;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
.content .bhyh .box:hover > div > span,
.content .bhyh .box:hover a > span{
    margin-top: -10px;
}
.content .bhyh .box:hover > div > p,
.content .bhyh .box:hover a > p{
    color: #f1983a;
}
.content .bhyh .box > div span,
.content .bhyh .box a span{
    display: inline-block;
    width: 80px;
    height: 80px;
    background: center center/cover no-repeat;
    -webkit-transition: margin-top .5s ease-in-out;
    -moz-transition: margin-top .5s ease-in-out;
    -o-transition: margin-top .5s ease-in-out;
    transition: margin-top .5s ease-in-out;
    background: url('../images/sprite.png');
}
.content .bhyh .box > div .span1,.content .bhyh .box a .span1{ background-position: -80px 0 }
.content .bhyh .box:hover > div .span1,.content .bhyh .box:hover a .span1{ background-position: 0 0 }
.content .bhyh .box > div .span2,.content .bhyh .box a .span2{ background-position: -240px 0 }
.content .bhyh .box:hover > div .span2,.content .bhyh .box:hover a .span2{ background-position: -160px 0 }
.content .bhyh .box > div .span3,.content .bhyh .box a .span3{ background-position: -320px -80px }
.content .bhyh .box:hover > div .span3,.content .bhyh .box:hover a .span3{ background-position: -320px 0 }
.content .bhyh .box > div .span4,.content .bhyh .box a .span4{ background-position: -400px -80px }
.content .bhyh .box:hover > div .span4,.content .bhyh .box:hover a .span4{ background-position: -400px 0 }
.content .bhyh .box > div .span5,.content .bhyh .box a .span5{ background-position: 0 -80px }
.content .bhyh .box:hover > div .span5,.content .bhyh .box:hover a .span5{ background-position: -240px -80px }
.content .bhyh .box > div .span6,.content .bhyh .box a .span6{ background-position: -80px -80px }
.content .bhyh .box:hover > div .span6,.content .bhyh .box:hover a .span6{ background-position: -160px -80px }

.content .bhyh .box > div .span7,.content .bhyh .box a .span7{ background-position: -240px 0px }
.content .bhyh .box:hover > div .span7,.content .bhyh .box:hover a .span7{ background-position: -160px 0 }




.content .titlelist{ width: 100%; height: 278px;-moz-box-shadow:0 0 3px rgba(0,0,0,0.1);	-webkit-box-shadow:0 0 3px rgba(0,0,0,0.1);  box-shadow: 0 0 3px rgba(0,0,0,0.1); background: #ffffff; }
.content .titlelist ul{ position:relative; }
.content .titlelist li{ width: 400px;  color: #000000; float:left;  text-align: center; font-size: 20px; color: #000000; padding-top: 74px; position: relative; height: 204px;cursor:pointer;}
.content .titlelist li img.hover{ display: none; }
/*.content .titlelist li .icon{ width: 55px; height: 51px; background: url(../images/icon1.png) no-repeat ; margin: 0 auto; }*/
.content .titlelist li p{ text-align: center;  font-size: 20px; color: #000000; line-height: 20px;  padding-top: 45px;}
.content .titlelist li .line{ width: 1px; height: 220px; display: block; position: absolute; top: 29px; right: 0; padding: 0; background: url(../images/titlelist_line.png) no-repeat;}
.content .titlelist li.hover .line{ display: none; }
.content .titlelist li span{ display: inline-block; width: 55px; height: 55px; background: center center/cover no-repeat}
.content .titlelist li:hover{ -moz-box-shadow:0 0 51px rgba(0,0,0,0.1);	-webkit-box-shadow:0 0 51px rgba(0,0,0,0.1);  box-shadow: 0 0 51px rgba(0,0,0,0.2); }
.content .titlelist li:hover p{ color: rgb(0 ,72, 151)}
.content .titlelist li .span1{ background-image: url('../images/icon1.png') }
.content .titlelist li:hover .span1{ background-image: url('../images/icon1_1.png') }
.content .titlelist li .span2{ background-image: url('../images/icon2.png') }
.content .titlelist li:hover .span2{ background-image: url('../images/icon2_1.png') }
.content .titlelist li .span3{ background-image: url('../images/icon3.png') }
.content .titlelist li:hover .span3{ background-image: url('../images/icon3_1.png') }
.content .titlelist li .span4{ background-image: url('../images/icon4.png') }
.content .titlelist li:hover .span4{ background-image: url('../images/icon4_1.png') }
.content .titlelist li .span5{ background-image: url('../images/icon5.png') }
.content .titlelist li:hover .span5{ background-image: url('../images/icon5_1.png') }
.content .titlelist li .span6{ background-image: url('../images/icon6.png') }
.content .titlelist li:hover .span6{ background-image: url('../images/icon6_1.png') }

.content .newscontents{-moz-box-shadow:0 0 3px rgba(0,0,0,0.1);	-webkit-box-shadow:0 0 3px rgba(0,0,0,0.1);  box-shadow: 0 0 3px rgba(0,0,0,0.1);margin-bottom: 74px; }
.content .sciences{height: auto; width: 100%; overflow: hidden;}
.content .sciences .right{ width: 800px; float: left; height: 404px; overflow: hidden;border-bottom: 1px solid #ededed }
.content .sciences .right img{ width: 100%; height: 100%; }
.content .sciences .left{ width: 348px; padding-left: 52px; float: left;  height:384px; border-bottom: 1px solid #ededed; padding-top: 20px; background: #ffffff;   }
.content .sciences .left .title{  font:20px "Arial"; color: #d4d3d3;   margin: 0 auto; text-align: left; line-height: 20px; font-weight: bold; }
.content .sciences .left .title p{  color: #000000; font:20px "微软雅黑"; margin-top: 55px; padding-right: 52px; line-height: 30px;}
.content .sciences .left .line{ display: block; width: 56px; height: 4px; background: #f1983a; padding: 0; margin-top: 27px; }
.content .sciences .left .small_title{  font-size:24px;  color: #000000; line-height: 24px; text-align: left; padding-top: 48px;   }
.content .sciences .left .text{ font-size: 14px; color: #4d4948; line-height: 25px; text-align: left; padding-top: 20px; padding-right: 52px; }

/*底部导航*/
.bottom{ width: 100%; height: 32vh;background: url(../images/bottom_bg.jpg) center top no-repeat,#212121; }
.bottom .box{ width: 1200px; height: 300px; background: none; margin: 0 auto;  position: relative; }
.bottom .box .logo{ position: absolute; top: 85px; right: 0; }
.bottom .box .logo img{ width: 241px; }
.bottom .box .us{ width: 100%; height: 258px; border-bottom: 1px solid #353535; position: relative; }
.bottom .box .us li{ width: auto; display: block;  float: left; line-height: 16px; padding-right: 80px; }
.bottom .box .us li .title{ color: #ffffff; font-size: 16px; text-align: left; line-height: 16px; padding: 80px 0 20px 0; }
.bottom .box .us li .text{ color: #9e9e9e; font-size: 14px; text-align: left;  line-height: 14px; margin-bottom: 12px;}
.bottom .box .us li .text a{ color: #9e9e9e }
.bottom .box .us li .text.hover a{ color: #ffffff; }
.bottom .box .us li .text.hover{ color: #ffffff; }
.bottom .box .us li.iconlist{ width: 400px; }
.bottom .box .us li.iconlist .weibo{ width: 150px; position: relative; float: left; margin-right: 20px; min-height: 30px; }
.bottom .box .us li.iconlist .weibo .icon{ width: 132px;height: 36px; border: 1px solid #808080; border-radius: 100px; position: relative; padding-left: 18px; font-size: 14px; line-height: 36px; color: #7a7776; }
.bottom .box .us li.iconlist .weibo .icon img{ position: absolute; top: 8px; right: 11px; width: 26px; }
.bottom .box .us li.iconlist .weibo .code{ width: 150px; height: 176px; background:#404040; position: absolute; top: 0; left: 1px;border-radius: 5px; display: none; }
.bottom .box .us li.iconlist .weibo .code p{ text-align: center; color: #ffffff; font-size: 14px; line-height: 30px; }
.bottom .box .us li.iconlist .weibo .code img{ position: absolute;  width: 132px; height: 132px;margin: 0 auto; bottom: 12px; left: 9px;  }



.bottom .box .us li.iconlist .wechat{ width: 150px; position: relative; float: left;min-height: 30px; }
.bottom .box .us li.iconlist .wechat .icon{ width: 132px;height: 36px; border: 1px solid #808080; border-radius: 100px; position: relative; padding-left: 18px; font-size: 14px; line-height: 36px; color: #7a7776; }
.bottom .box .us li.iconlist .wechat .icon img{ position: absolute; top: 8px; right: 11px; width: 26px; }
.bottom .box .us li.iconlist .wechat .code{ width: 150px; height: 176px; background:#404040; position: absolute; top: 0; left: 1px;border-radius: 5px; display: none; }
.bottom .box .us li.iconlist .wechat .code p{ text-align: center; color: #ffffff; font-size: 14px; line-height: 30px; }
.bottom .box .us li.iconlist .wechat .code img{ position: absolute;  width: 132px; height: 132px;margin: 0 auto; bottom: 12px; left: 9px;  }
.bottom .box .copyright{ text-align: right; font-size: 14px; color: #9e9e9e; line-height: 40px; }
.bottom .box .copyright .police{ padding-left:20px; font-size:14px; background:url(../images/icon-police.png) no-repeat left center / 16px 17px; color: #9e9e9e; }

.effect img{
-webkit-animation: myrotateover 0.7s  linear forwards;
-moz-animation: myrotateover 0.7s  linear forwards;
-ms-animation: myrotateover 0.7s  linear forwards;
-o-animation: myrotateover 0.7s  linear forwards;
animation: myrotateover 0.7s  linear forwards;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
}
.effect.hover img{
-webkit-animation: myrotate 0.7s  linear forwards;
-moz-animation: myrotate 0.7s  linear forwards;
-ms-animation: myrotate 0.7s  linear forwards;
-o-animation: myrotate 0.7s  linear forwards;
animation: myrotate 0.7s  linear forwards;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
}


.literal .hoverbg{
-webkit-animation: textopacityover 1.4s  linear forwards;
-moz-animation: textopacityover 1.4s  linear forwards;
-ms-animation: textopacityover 1.4s  linear forwards;
-o-animation: textopacityover 1.4s  linear forwards;
animation: textopacityover 1.4s  linear forwards;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
}



.literal.hover .hoverbg{
-webkit-animation: textopacity 1.4s  linear forwards;
-moz-animation: textopacity 1.4s  linear forwards;
-ms-animation: textopacity 1.4s  linear forwards;
-o-animation: textopacity 1.4s  linear forwards;
animation: textopacity 1.4s  linear forwards;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
}


@-webkit-keyframes textopacityover{
0%{
	-webkit-transform :scale(1.05);
	opacity: 1;
}
50%{
	-webkit-transform :scale(1);
	opacity: 0.8;
}
100%{
	-webkit-transform :scale(1);
	opacity: 0;
}
}
@-moz-keyframes textopacityover{
0%{
	-moz-transform :scale(1.05);
	opacity: 1;
}
50%{
	-moz-transform :scale(1);
	opacity: 0.8;
}
100%{
	-moz-transform :scale(1);
	opacity: 0;
}
}
@-ms-keyframes textopacityover{
0%{
	-ms-transform :scale(1.05);
	opacity: 1;
}
50%{
	-ms-transform :scale(1);
	opacity: 0.8;
}
100%{
	-ms-transform :scale(1);
	opacity: 0;
}
}
@-o-keyframes textopacityover{
0%{
	-o-transform :scale(1.05);
	opacity: 1;
}
50%{
	-o-transform :scale(1);
	opacity: 0.8;
}
100%{
	-o-transform :scale(1);
	opacity: 0;
}
}
@keyframes textopacityover{
0%{
	transform :scale(1.05);
	opacity: 1;
}
50%{
	transform :scale(1);
	opacity: 0.8;
}
100%{
	transform :scale(1);
	opacity: 0;
}
}

@-webkit-keyframes textopacity{
0%{
	-webkit-transform :scale(1);
	opacity: 0;
}
50%{
	-webkit-transform :scale(1);
	opacity: 0.8;
}
100%{
	-webkit-transform :scale(1.05);
	opacity: 1;
}
}
@-moz-keyframes textopacity{
0%{
	-moz-transform :scale(1);
	opacity: 0;
}
50%{
	-moz-transform :scale(1);
	opacity: 0.8;
}
100%{
	-moz-transform :scale(1.05);
	opacity: 1;
}
}
@-ms-keyframes textopacity{
0%{
	-ms-transform :scale(1);
	opacity: 0;
}
50%{
	-ms-transform :scale(1);
	opacity: 0.8;
}
100%{
	-ms-transform :scale(1.05);
	opacity: 1;
}
}
@-o-keyframes textopacity{
0%{
	-o-transform :scale(1);
	opacity: 0;
}
50%{
	-o-transform :scale(1);
	opacity: 0.8;
}
100%{
	-o-transform :scale(1.05);
	opacity: 1;
}
}
@keyframes textopacity{
0%{
	transform :scale(1);
	opacity: 0;
}
50%{
	transform :scale(1);
	opacity: 0.8;
}
100%{
	transform :scale(1.05);
	opacity: 1;
}
}





/* common:scale(1.05);CD */
@-webkit-keyframes myrotate{
0%{
-webkit-transform :scale(1);
}
100%{
-webkit-transform :scale(1.05);
}
}
@-moz-keyframes myrotate{
0%{
-moz-transform :scale(1);
}
100%{
-moz-transform :scale(1.05);
}
}
@-ms-keyframes myrotate{
0%{
-ms-transform :scale(1);
}
100%{
-ms-transform :scale(1.05);
}
}
@-o-keyframes myrotate{
0%{
-o-transform :scale(1);
}
100%{
-o-transform :scale(1.05);
}
}
@keyframes myrotate{
0%{
transform :scale(1);
}
100%{
transform :scale(1.05);
}
}


@-webkit-keyframes myrotateover{
0%{
-webkit-transform :scale(1.05);
}
100%{
-webkit-transform :scale(1);
}
}
@-moz-keyframes myrotateover{
0%{
-moz-transform :scale(1.05);
}
100%{
-moz-transform :scale(1);
}
}
@-ms-keyframes myrotateover{
0%{
-ms-transform :scale(1.05);
}
100%{
-ms-transform :scale(1);
}
}
@-o-keyframes myrotateover{
0%{
-o-transform :scale(1.05);
}
100%{
-o-transform :scale(1);
}
}
@keyframes myrotateover{
0%{
transform :scale(1.05);
}
100%{
transform :scale(1);
}
}




/*BU页面样式*/

.buinfo{ background: url(../images/buinfo_top.jpg) center top no-repeat, url(../images/buinfo_bottom.jpg) center bottom no-repeat,rgb(244,244,244);}
.bu_banner{  margin-top: 71px; }
.bu_banner .box{ width:1200px; height: 533px; background: none;  margin: 0 auto; position: relative; }
.bu_banner .box .title{ font-size: 36px; color: #ffffff; line-height: 36px; margin-left: 22px; padding-top: 175px; }
.bu_banner .box .text > p{margin: 10px 0;}
.bu_banner .box .text > p > span{color: #f1983a;}
.bu_banner .box .line{ width: 70px; height: 3px; display: block; background: #f1983a; position: relative; top: 20px; margin-left: 22px; }

.pro_banner{ width: 100%; background: url(../images/pro_banner.jpg?v=1) right center #000000 no-repeat; height:  400px; margin-top: 71px; }

.bu_content{ width: 1200px;  margin: 30px auto; min-height: 800px; background: url(../images/content_topbg.jpg) center top no-repeat,
                     url(../images/content_bottombg.jpg) center bottom no-repeat,#ffffff;   position: relative;    overflow: hidden;  }
.bu_content .box{ position: relative; width: 100%; height: 100%; }
.bu_content .leftmenu{  width:  288px;  height: 100%; min-height:300px; float: left;  }
.bu_content .leftmenu .menulist{ width: 228px; margin: 0 auto; padding-top: 40px; }
.bu_content .leftmenu .menulist li{ color: #4d4948; width: 188px; height: 58px; border-bottom: 1px solid #e5e5e5; text-align: center; padding-right: 20px; line-height: 58px; font-size: 18px; position: relative;cursor:pointer; padding-left: 20px;  }
.bu_content .leftmenu .menulist li:first-child{border-top: 1px solid #e5e5e5;  }
.bu_content .leftmenu .menulist li .icon{ position: absolute;  left: 55px; top: 20px; }
.bu_content .leftmenu .menulist li .icon img{ width: 20px; }
.bu_content .leftmenu .menulist li .icon .sec{ display: none; }
.bu_content .leftmenu .menulist li.hover,.bu_content .leftmenu .menulist li.thisindex{ background: url(../images/bu_menu_bg.png) no-repeat; color: #ffffff;    }
.bu_content .leftmenu .menulist li.hover,.bu_content .leftmenu .menulist li.thisindex a{color: #fff}

.bu_content .right_content{  float: left; border-left: 1px solid #e5e5e5; min-height: 100px; width: 911px;padding-bottom: 50px;  }
.bu_content .right_content .right_content_list{ width: 842px;  margin: 0 auto; color: #ccc; }
.bu_content .right_content .right_content_list li{ position: relative; }
.bu_content .right_content .right_content_list li .li_title{ margin-bottom: 10px; padding-left: 35px;font-size: 24px; color: #333; line-height: 24px; margin-top: 40px; padding-bottom:  26px; border-bottom: 1px solid #e5e5e5; position: relative;  }
.bu_content .right_content .right_content_list li .li_title .icon{ position: absolute; top: 0; left: -2px; }
.bu_content .right_content .right_content_list li .li_title .icon img{ width: 28px; }
/*.bu_content .right_content .right_content_list li .li_text{ padding-top:  }*/
.bu_content .right_content .right_content_list li .li_text p{ font-size: 14px; line-height: 28px; color: #4d4948; padding-top: 20px; }
.bu_content .right_content .right_content_list li .li_text img.esg{ margin:  0 auto;  width: 800px; display: block;}
.bu_content .right_content .right_content_list li .li_text img.psg{ margin:  0 auto;  width: 822px; display: block;}
.bu_content .right_content .right_content_list li .li_text img.nsg{ margin:  0 auto;  width: 688px; display: block;}
.bu_content .right_content .right_content_list li .li_text p span{ font-size: 14px; line-height: 28px; color: #4d4948; font-weight: bold;}
.bu_content .right_content .right_content_list li.hover .li_title{ color: #0e56a0; }

.bu_content .right_content .article h5{
    margin: 5px 0;
    color: #333;
    font-size: 18px;
}
.bu_content .right_content .article p{
    font-size: 14px;
    line-height: 1.5;
    color: #333;
}

.bu_content .right_content .article .text-c{
    text-align: center;
    margin: 10px 0;
}

.bu_content .right_content .article img{
    max-width: 80%;
}

.mar-r-50{
    margin-right: 50px;
}

.news_banner{ width: 100%; background: url(../images/news_banner.jpg) center center #000000 no-repeat; height:  400px; margin-top: 71px; }
.news_banner .box{ width:1200px; height: auto; background: none;  margin: 0 auto; position: relative; }
.news_banner .box .title{ font-size: 36px; color: #ffffff; line-height: 36px; margin-left: 22px; padding-top: 175px; }
.news_banner .box .line{ width: 70px; height: 3px; display: block; background: #f1983a; position: relative; top: 20px; margin-left: 22px; }


.newsinfo{ background: url(../images/newsinfo_top.jpg) center top no-repeat, url(../images/newsinfo_bottom.jpg) center bottom no-repeat,#fbfbfb;}
.news_list{ width: 1200px;  margin: 0 auto; min-height: 100px; background: none; margin-top: 8px; margin-bottom: 40px;  }
.news_list .news{height: 230px; width: 100%; margin-top: 32px;  }
.news_list .news .left{ width: 380px; float: left; height: 230px; overflow: hidden;border-bottom: 1px solid #ededed }
.news_list .news .left img{ width: 100%; height: 100%; }
.news_list .news .right{ width: 1000px; padding-left: 40px; padding-right: 160px; float: left;  height:230px; border-bottom: 1px solid #ededed; border-top: 1px solid #ededed;  background: #ffffff; -moz-box-shadow:2px 2px 3px rgba(0,0,0,0.03);	-webkit-box-shadow:2px 2px 3px rgba(0,0,0,0.03);  box-shadow: 2px 2px 3px rgba(0,0,0,0.03); position: relative; overflow: hidden; }
.news_list .news .right .title{ font-size:18px; color: #4c4948; padding-top: 55px;   margin: 0 auto; text-align: left; line-height: 28px; font-weight: bold;   }
.news_list .news .right .box{ position: relative; z-index: 2; }
.news_list .news .right .text{ font-size: 14px; color: #4d4948; line-height: 26px; text-align: left; padding-top: 10px; }
.news_list .news .right.hover{ -moz-box-shadow:0 0 3px rgba(0,0,0,0.1);	-webkit-box-shadow:0 0 3px rgba(0,0,0,0.1);  box-shadow: 0 0 3px rgba(0,0,0,0.1); border: none; }

.news_list .news .right .date{text-align: left; position: absolute; top: 40px; right: 42px; z-index: 2; }
.news_list .news .right .date .month{  font-size:24px; font-weight: bold; line-height: 24px; color: #4c4948; }
.news_list .news .right .date .year{  font-size:16px; line-height: 16px; color: #4c4948;padding-top: 12px;}
.news_list .news .right .godetails{text-align: center; position: absolute; bottom: 40px; right: 42px; width: 60px; height: 28px; line-height: 28px; background: #c3c3c3; font-size: 13px; color: #ffffff; border-radius: 15px; cursor:pointer; z-index: 2;}
.news_list .news .right.hover .godetails{ background: #f1983a; }
.news_list .news .right.hover  .hoverbg{ opacity: 1; }
.news_list .news .right .hoverbg{ background: url(../images/newslist_bg.jpg) left center/100% 100% no-repeat; width: 100%; height:100%; position: absolute; top: 0; left: 0; opacity: 0; display: none;}

.news_list .news .right.hover .title,.news_list .news .right.hover .title p,.news_list .news .right.hover .small_title,.news_list .news .right.hover .text,.news_list .news .right.hover .month,.news_list .news .right.hover .year{ color: #ffffff; }
.detailsbody{ background: url(../images/details_bg_top.jpg) center top no-repeat, url(../images/details_bg_bottom.jpg) center bottom no-repeat,#fbfbfb; }
.details{width: 1200px;  margin: 30px auto; min-height: 300px;    background: url(../images/content_topbg.jpg) no-repeat,#ffffff;}
.details .details_content{ width: 1120px;  margin: 0 auto; }
.details .details_content .goback{ font-size: 14px;  color: #0e56a0;  line-height: 14px; font-weight: 600; padding: 40px 0 20px 0; border-bottom: 1px #e5e5e5 solid; cursor: pointer; }
.details .details_content .goback a{ color: #0e56a0; }
.details .details_content .goback img{ width:18px;margin-right: 10px;  }
.details .details_content .title{ font-size: 36px; line-height: 36px; color: #4c4948; padding-left: 4px; font-weight: bold; padding: 40px 0 27px 0; }
.details .details_content .date{ font-size:14px;  color: #4c4948; padding-left: 4px; line-height: 14px; padding-bottom: 25px; }
.details .details_content .date span{ display: inline-block; position: relative; top: 3px; margin-right: 9px;   width: 16px; height: 16px ; background: url(../images/time_icon.png) no-repeat center center / 100% 100%; }
.details .details_content .content_details p,.details .details_content .content_details{ font-size: 14px; color: #4c4948; line-height: 26px; }
.details .details_content .content_details p{ padding-bottom: 12px;  padding:0 106px 20px 106px;}
.details .details_content .content_details{ padding-left: 4px; font-size: 14px; padding-bottom: 30px; }
.details .details_content .content_details img{ margin:0 auto; padding: 20px 0; display:block; width:700px; height: auto;}
.details .details_content .content_details .smalltitle{ display: block; margin:-10px 0 20px 0; font-size:14px; color:#999; text-align: center; }
.details .details_content .content_details .bigtitle{ margin-top:16px; font-size:18px; font-weight: bold; }

.details .details_content .goback.hover img{
-webkit-animation: goback 1s  infinite linear;
-moz-animation: goback 1s  infinite linear;
-ms-animation: goback 1s  infinite linear;
-o-animation: goback 1s  infinite linear;
animation: goback 1s  infinite linear;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;   }

.missionLines{
    display: block;
    width: 100px;
    height: 4px;
    margin-top: 10px;
    margin-bottom: 10px;
    background: #f1983a;
}

@-webkit-keyframes goback{
0%{
-webkit-transform :translate(0,0);
}
50%{
-webkit-transform :translate(-10px,0);
}
100%{
-webkit-transform :translate(0,0);
}
}
@-moz-keyframes goback{
0%{
-moz-transform :translate(0,0);
}
50%{
-moz-transform :translate(-10px,0);
}
100%{
-moz-transform :translate(0,0);
}
}
@-ms-keyframes goback{
0%{
-ms-transform :translate(0,0);
}
50%{
-ms-transform :translate(-10px,0);
}
100%{
-ms-transform :translate(0,0);
}
}
@-o-keyframes goback{
0%{
-o-transform :translate(0,0);
}
50%{
-o-transform :translate(-10px,0);
}
100%{
-o-transform :translate(0,0);
}
}
@keyframes goback{
0%{
transform :translate(0,0px);
}
50%{
transform :translate(-10px,0);
}
100%{
transform :translate(0,0px);
}
}




.tophide{  height: 1px; display:block; }
.us_banner{ width: 100%; background: url(../images/us_banner.jpg?v=1) #000000 no-repeat center center; height:  400px; margin-top: 71px; }
.us_banner .box{ width:1200px; height: auto; background: none;  margin: 0 auto; position: relative; }
.us_banner .box .title{ font-size: 36px; color: #ffffff; line-height: 36px; margin-left: 22px; padding-top: 175px; }

.us_banner .box .line{ width: 70px; height: 3px; display: block; background: #f1983a; position: relative; top: 20px; margin-left: 22px; }
.contentus{ background: url(../images/contentus_big_bg.jpg) center top no-repeat;  }
.contact_us{width: 1200px;  margin: 0 auto; min-height: 300px;    background: url(../images/content_topbg.jpg) center top no-repeat, #ffffff ; padding-bottom: 40px;}
.contact_us .us_list{  width: 1122px; margin: 0 auto; color: #ccc; }
.contact_us .us_list li .title{ color: #0e56a0; font-size: 24px; padding-left:15px; line-height: 22px;  position: relative; height: 22px; margin:  40px 0 24px 0;  }
.contact_us .us_list li .title2{ font-size: 22px; padding-left:15px; border-left: 3px solid #ccc; line-height: 22px;  position: relative; height: 22px; margin:  40px 0 24px 0;  }
.contact_us .us_list li .line{ width: 100%; height: 1px ; background: #e5e5e5; }
.contact_us .us_list li .iconlist{ height: 50px; background: none; margin: 40px 0 35px 0; position: relative; }
.contact_us .us_list li .iconlist .left{  display: inline-block; float: left;  font-size: 18px; color: #4d4948; padding-left: 74px; font-weight: bold; position: relative; line-height: 22px; padding-right: 40px; }
.contact_us .us_list li .iconlist .left span{  font-size: 18px; color: #4d4948; display: block; padding-top: 4px; }
.contact_us .us_list li .iconlist .left img{ position: absolute; top: 0; left: 2px; }
.contact_us .us_list li .iconlist .left.right{  border-left: 1px #ccc solid; padding-left: 108px; }
.contact_us .us_list li .iconlist .left.right img{ left:40px;  }
.contact_us .us_list li .iconlist .left.phone{ padding-left: 68px; }
.phone img{ width: 46px; }
.time img{ width: 50px; }
.email img{ width: 56px; }
.addressimg img{ width: 50px; }
/*.contact_us .us_list li .text{ font-size: 16px; line-height: 28px; color: #4d4948; } */
.contact_us .us_list li .text{ font-size: 16px; line-height: 28px; color: #4d4948; padding-top: 25px;}
.contact_us .us_list li .answer{ font-size: 16px; padding: 7px 25px; background: #ffffff; border:1px solid #4d4948; display: inline-block; color: #4d4948; margin-top: 20px; line-height: 16px;}
.contact_us .us_list li .answer.hover{ background: #0e56a0; color: #ffffff;border:1px solid #0e56a0;}
.contact_us .us_list li.address .left span{   padding: 0; line-height: 50px; }
.contact_us .us_list li .map{ position: relative; width: 1120px; height: 616px; overflow: hidden;  }
.contact_us .us_list li .map .info{ position: absolute; top: 202px; left: 418px; -webkit-transform: translate(0,-100px); opacity: 0; }

.contact_us .us_list li .map .info.hover{
opacity: 1;
-webkit-animation: map 0.8s  cubic-bezier(0.32, 1.52, 1, 1.01) forwards;
-moz-animation: map 0.8s  cubic-bezier(0.32, 1.52, 1, 1.01) forwards;
-ms-animation: map 0.8s  cubic-bezier(0.32, 1.52, 1, 1.01) forwards;
-o-animation: map 0.8s  cubic-bezier(0.32, 1.52, 1, 1.01) forwards;
animation: map 0.8s  cubic-bezier(0.32, 1.52, 1, 1.01) forwards;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
}


.contact_us .us_list li .iconlist .left.hover img{
-webkit-animation: aboutus 1s  linear;
-moz-animation: aboutus 1s  linear;
-ms-animation: aboutus 1s  linear;
-o-animation: aboutus 1s  linear;
animation: aboutus 1s  linear;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
}







@-webkit-keyframes aboutus{
0%{
-webkit-transform :translate(0,0);
}
50%{
-webkit-transform :translate(0,-10px);
}
100%{
-webkit-transform :translate(0,0);
}
}
@-moz-keyframes aboutus{
0%{
-moz-transform :translate(0,0);
}
50%{
-moz-transform :translate(0,-10px);
}
100%{
-moz-transform :translate(0,0);
}
}
@-ms-keyframes aboutus{
0%{
-ms-transform :translate(0,0);
}
50%{
-ms-transform :translate(0,-10px);
}
100%{
-ms-transform :translate(0,0);
}
}
@-o-keyframes aboutus{
0%{
-o-transform :translate(0,0);
}
50%{
-o-transform :translate(0,-10px);
}
100%{
-o-transform :translate(0,0);
}
}
@keyframes aboutus{
0%{
transform :translate(0,0);
}
50%{
transform :translate(0,-10px);
}
100%{
transform :translate(0,0);
}
}



@-webkit-keyframes map{
0%{
-webkit-transform :translate(0,0);
}
100%{
-webkit-transform :translate(0,0);
}
}
@-moz-keyframes map{
0%{
-moz-transform :translate(0,0);
}
100%{
-moz-transform :translate(0,0);
}
}
@-ms-keyframes map{
0%{
-ms-transform :translate(0,0);
}
100%{
-ms-transform :translate(0,0);
}
}
@-o-keyframes map{
0%{
-o-transform :translate(0,0);
}
100%{
-o-transform :translate(0,0);
}
}
@keyframes map{
0%{
	opacity: 0;
transform :translate(0,-100px);
}
100%{
	opacity: 1;
transform :translate(0,0);
}
}





.banner .box .ai,.banner .box .text.text1,.banner .box .text.text2,.banner .box .text.text3{
	opacity: 0;
-webkit-transform :translate(20px,0);
-moz-transform :translate(20px,0);
-ms-transform :translate(20px,0);
-o-transform :translate(20px,0);
transform :translate(20px,0);

-webkit-animation: titleright 1s 1s  ease forwards;
-moz-animation: titleright 1s 1s  ease forwards;
-ms-animation: titleright 1s 1s  ease forwards;
-o-animation: titleright 1s 1s  ease forwards;
animation: titleright 1s 1s  ease forwards;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
}

.IE .banner .box .text.text1,.IE .banner .box .text.text2,.IE .banner .box .text.text3{
	opacity: 1;
}

.banner .box .logo{
	opacity: 0;
	-webkit-animation: title 2s  ease forwards, opacity_t 2s ease forwards;
	-moz-animation: title 2s  ease forwards, opacity_t 2s ease forwards;
	-ms-animation: title 2s  ease forwards, opacity_t 2s ease forwards;
	-o-animation: title 2s  ease forwards, opacity_t 2s ease forwards;
	animation: title 2s  ease forwards, opacity_t 2s ease forwards;
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
.ytzz_banner .box .text,.ytzz_banner .box .button-wrapper,
.ytzx_banner .box .text,.ytzx_banner .box .button-wrapper,
.bu_banner .box .title,.ythy_banner .box .text,.ythy_banner .box .button-wrapper,.bu_banner .box .line,.news_banner .box .title,.news_banner .box .line,.us_banner .box .title,.us_banner .box .line{
-webkit-animation: titleop 0.5s  ease forwards;
-moz-animation: titleop 0.5s  ease forwards;
-ms-animation: titleop 0.5s  ease forwards;
-o-animation: titleop 0.5s  ease forwards;
animation: titleop 0.5s  ease forwards;
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-ms-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
opacity: 0;
}
.IE .bu_banner .box .title,.IE .bu_banner .box .line,.IE .news_banner .box .title,.IE .news_banner .box .line,.IE .us_banner .box .title,.IE .us_banner .box .line{
	opacity: 1
}

@-webkit-keyframes titleright{
0%{
-webkit-transform :translate(20px,0);
	opacity: 0;
}
100%{
-webkit-transform :translate(0,0);
	opacity: 1;
}
}
@-moz-keyframes titleright{
0%{
-moz-transform :translate(20px,0);
	opacity: 0;
}
100%{
-moz-transform :translate(0,0);
	opacity: 1;
}
}
@-ms-keyframes titleright{
0%{
-ms-transform :translate(20px,0);
	opacity: 0;
}
100%{
-ms-transform :translate(0,0);
	opacity: 1;
}
}
@-o-keyframes titleright{
0%{
-o-transform :translate(20px,0);
	opacity: 0;
}
100%{
-o-transform :translate(0,0);
	opacity: 1;
}
}
@keyframes titleright{
0%{
transform :translate(20px,0);
	opacity: 0;
}
100%{
transform :translate(0,0);
	opacity: 1;
}
}




@-webkit-keyframes title{
    0%{
        transform :translate(0, 0);
    }
    100%{
        transform :translate(50px,0);
    }
}
@-moz-keyframes title{
    0%{
        transform :translate(0, 0);
    }
    100%{
        transform :translate(50px,0);
    }
}
@-ms-keyframes title{
    0%{
        transform :translate(0, 0);
    }
    100%{
        transform :translate(50px,0);
    }
}
@-o-keyframes title{
    0%{
        transform :translate(0, 0);
    }
    100%{
        transform :translate(50px,0);
    }
}
@keyframes title{
0%{
transform :translate(0, 0);
}
100%{
transform :translate(50px,0);
}
}

@-webkit-keyframes opacity_t{
0%{
opacity: 0;
}
100%{
opacity: 1;
}
}
@-moz-keyframes opacity_t{
0%{
opacity: 0;
}
100%{
opacity: 1;
}
}
@-ms-keyframes opacity_t{
0%{
opacity: 0;
}
100%{
opacity: 1;
}
}
@-o-keyframes opacity_t{
0%{
opacity: 0;
}
100%{
opacity: 1;
}
}
@keyframes opacity_t{
0%{
opacity: 0;
}
100%{
opacity: 1;
}
}



@-webkit-keyframes titleop{
0%{
-webkit-transform :translate(0,20px);
opacity: 0;
}
100%{
-webkit-transform :translate(0,0);
opacity: 1;
}
}
@-moz-keyframes titleop{
0%{
-moz-transform :translate(0,20px);
opacity: 0;
}
100%{
-moz-transform :translate(0,0);
opacity: 1;
}
}
@-ms-keyframes titleop{
0%{
-ms-transform :translate(0,20px);
opacity: 0;
}
100%{
-ms-transform :translate(0,0);
opacity: 1;
}
}
@-o-keyframes titleop{
0%{
-o-transform :translate(0,20px);
opacity: 0;
}
100%{
-o-transform :translate(0,0);
opacity: 1;
}
}
@keyframes titleop{
0%{
transform :translate(0,20px);
opacity: 0;
}
100%{
transform :translate(0,0);
opacity: 1;
}
}
@keyframes shake {
    0%, 100% {
        -webkit-transform: translateY(0);
    }
10%,
30%,
50%,
70%,
90% {
    -webkit-transform: translateY(-5px);
}
20%,
40%,
60%,
80% {
-webkit-transform: translateY(5px);
}
}
@-o-keyframes shake {
/* Opera */
0%, 100% {
-webkit-transform: translateY(0);
}
10%,
30%,
50%,
70%,
90% {
-webkit-transform: translateY(-5px);
}
20%,
40%,
60%,
80% {
-webkit-transform: translateY(5px);
}
}
@-webkit-keyframes shake {
/* Safari 和 Chrome */
0%, 100% {
-webkit-transform: translateY(0);
}
10%,
30%,
50%,
70%,
90% {
-webkit-transform: translateY(-5px);
}
20%,
40%,
60%,
80% {
-webkit-transform: translateY(5px);
}
}
@-moz-keyframes shake {
/* Firefox */
0%, 100% {
-moz-transform: translateY(0);
}
10%,
30%,
50%,
70%,
90% {
-moz-transform: translateY(-5px);
}
20%,
40%,
60%,
80% {
-moz-transform: translateY(5px);
}
}

/*----------合作伙伴---------------------*/

.ingol-main-partner .ingol-main-partner-box {
    /* background-color: #F8F8F8;*/
    position: relative;
}
.ingol-main-partner .ingol-main-partner-box .ingol-main-partner-img {
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    width: 1200px;
    padding-left: 75px;
}
.ingol-main-partner .ingol-main-partner-box .ingol-main-partner-img > .logo-wrapper {
    display: flex;
    flex-wrap: wrap;
}

.ingol-main-partner .ingol-main-partner-box .ingol-main-partner-img h5{
    color: #333;
    margin: 70px 0 0px;
    font-size: 20px;
}

.ingol-main-partner .ingol-main-partner-box .ingol-main-partner-img img {
    width: 110px;
    height: 110px;
    padding: 24px;
    display: block;
}

#rightContent li{
    display: none;
}



/* 云天慧眼页面样式 */
.bg_grey{background: rgb(239,239,239);}

.b-top{top: 0;left: 2px; border-top: 2px solid rgba(248,185,118,.3);}
.b-right{right: 0;top: 2px; border-right: 2px solid rgba(248,185,118,.3);}
.b-bottom{bottom: 0;right: 2px; border-bottom: 2px solid rgba(248,185,118,.3);}
.b-left{left: 0;bottom: 2px; border-left: 2px solid rgba(248,185,118,.3);}
.b-top:after {
    border-top: 2px solid rgb(248,185,118);
    left: -200%;
    top: -2px;
}
.b-right:after {
    border-right: 2px solid rgb(248,185,118);
    top: -200%;
    right: -2px;
}
.b-bottom:after {
    border-bottom: 2px solid rgb(248,185,118);
    right: -200%;
    bottom: -2px;
}
.b-left:after {
    border-left: 2px solid rgb(248,185,118);
    bottom: -200%;
    left: -2px;
}


.ythy .box section > .wrapper { width: 1200px; margin: 0 auto; padding: 50px 0; }
.ythy .box section.special > .wrapper { width: 100%;}
.ythy .box section > .wrapper > .title{  font:32px "微软雅黑"; color: #000000; margin: 0 auto 50px; text-align: center; line-height: 34px; letter-spacing: 2px;}
.ythy .box section > .wrapper >  .title span{ display: inline-block; width: 50px; height: 4px; background: #f1983a; position:relative; top: -10px; margin: 0 15px;}

/*.ythy_banner{ width: 100%; background: url(../images/ythy/ythy_banner.jpg?v=1) right center #000000 no-repeat; height:  500px; margin-top: 71px; }*/
.spcx_banner{ background: url(../images/ythy/spcx_banner.jpg?v=1);}
.sbfwq_banner{ background: url(../images/ythy/sbfwq_banner.jpg?v=1);}
/*.byaisbq_banner{ background: url(../images/ythy/bysbq_banner1.jpg?v=1) right center #000000 no-repeat; height:  500px; margin-top: 71px;background-size: 100% 100%; }*/
.znyj_banner{ background: url(../images/ythy/znyj_banner.jpg?v=1);}
.ythy_banner .box .title{ padding-top: 150px;}
.ythy_banner .box .text{ color: #ffffff; margin: 20px 22px; width: 350px; font-size: 16px; }
.ythy_banner .box .button-wrapper{ color: #ffffff; margin: 30px 22px; width: 300px; }
.ythy_banner .box .button-wrapper a{ font-size:16px; color: inherit; border-radius: 4px;box-shadow: 0 10px 10px rgba(0,0,0, .3); background: linear-gradient(to bottom, rgba(238,167,61,1) 0%, rgba(206,96,11,1) 100%); padding: 10px 60px; margin-right: 10px;}
.ythy_banner .box .button-wrapper a:hover{ box-shadow: 0 5px 10px rgba(255,255,255, .3); }

.ythy .box section{color: black;}
.ythy .box section:not(.special) .section-content{display: flex;flex-wrap: wrap;margin: 0 6%;justify-content: space-between;}

.ythy .box section.special > .title{margin: 0 auto;}
.ythy .box section .special-wrapper{position: relative;}
.ythy .box section .special-wrapper img.line{width: 100%;}
.ythy .box section .special-wrapper .img_text-wrapper{text-align: center;position: absolute;top: 23%;left: 12.5%;width: 8%;}
.ythy .box section .special-wrapper .site1{top: 47%;left: 28%;}
.ythy .box section .special-wrapper .site2{top: 40%;left: 47%;}
.ythy .box section .special-wrapper .site3{top: 49%;left: 64%;}
.ythy .box section .special-wrapper .site4{top: 28%;left: 79%;}
.ythy .box section .special-wrapper .img_text-wrapper .img-wrapper{position: relative;width: 100%;}
.ythy .box section .special-wrapper .img_text-wrapper > span{display: block;margin: 10px 0;white-space: nowrap;}
.ythy .box section .special-wrapper .img_text-wrapper .img-wrapper > img{width: 100%;}
.ythy .box section .special-wrapper .img_text-wrapper .img-wrapper > img.inside{position: absolute;top: 0;left: 0;}
.ythy .box section .special-wrapper .img_text-wrapper .img-wrapper > img.circle{float: left;}
.ythy .box section .special-wrapper .img_text-wrapper .img-wrapper:hover > img.circle{
    -webkit-animation: turn 1.5s linear infinite;
    -moz-animation:    turn 1.5s linear infinite;
    -o-animation:      turn 1.5s linear infinite;
    animation:         turn 1.5s linear infinite;
}

.ythy .box section.function .section-content > .wrapper{width: 30%;height: 280px;margin-bottom: 30px;box-sizing: border-box;position: relative;overflow: hidden;}
.ythy .box section.function .section-content > .wrapper > .inner-wrapper > div{margin: 0 20px;}
.ythy .box section.function .section-content > .wrapper > .inner-wrapper > img{width: 100%;}
.ythy .box section.function .section-content > .wrapper > .react{position: absolute; width: 100%;height: 100%;transition: .5s all cubic-bezier(0.21, 0.63, 0.75, 0.36);}
.ythy .box section.function .section-content > .wrapper > .react:after{content: '';display: block;position: absolute;height: 100%;width: 100%}
.ythy .box section.function .section-content > .wrapper:hover > .b-top {
    left: 200%;
}
.ythy .box section.function .section-content > .wrapper:hover > .b-right {
    top: 200%;
}
.ythy .box section.function .section-content > .wrapper:hover > .b-bottom {
    right: 200%;
}
.ythy .box section.function .section-content > .wrapper:hover > .b-left {
    bottom: 200%;
}
.ythy .box section.function .section-content > .wrapper .title{font-size: 16px;font-weight: bold;margin-bottom: 6px;text-align: center;}

.ythy .box section.model .section-content > .wrapper{width: 27%;height: 310px;margin-bottom: 30px;box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);transition: all .5s;}
.ythy .box section.model .section-content > .wrapper .img-wrapper{width: 100%;position: relative;margin-bottom: 10px;}
.ythy .box section.model .section-content > .wrapper .img-wrapper > .title{position: absolute;float: left;text-align: center;bottom: 20px;font-size: 18px;width: 100%;font-weight: bold;color: white;}
.ythy .box section.model .section-content > .wrapper .img-wrapper > img{width: 100%;}
.ythy .box section.model .section-content > .wrapper:hover{transform: scale(1.1);}
.ythy .box section.model .section-content > .wrapper .text{margin: 0 20px;}


.ythy .box section.scene .section-content > .wrapper{width: 30%;margin-bottom: 30px;box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);overflow: hidden;}
.ythy .box section.scene .section-content > .wrapper .img-wrapper{width: 100%;position: relative;}
.ythy .box section.scene .section-content > .wrapper .img-wrapper > .title {position: absolute;float: left;text-align: center;bottom: 50%;font-size: 24px;width: 100%;font-weight: bold;color: white;}
.ythy .box section.scene .section-content > .wrapper .img-wrapper > img{width: 100%;transition: all .7s;}
.ythy .box section.scene .section-content > .wrapper:hover .img-wrapper > .title{color: #f1983a;}
.ythy .box section.scene .section-content > .wrapper:hover .img-wrapper > img{transform: scale(1.1);}

/*.ythy .box section.glasses{*/
    /*background: url(../images/ythy/glasses_bg1.jpg);*/
/*}*/
.ythy .box section.glasses.ar{
    background: url(../images/ythy/glasses_bg.jpg);
}
.ythy .box section.glasses .section-content > p {
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
}
.ythy .box section.glasses .section-content > .wrapper{
    height: 600px;
    width: 100%;
    text-align: center;
    position: relative;
}
.ythy .box section.glasses .section-content > .wrapper > img{
    position: absolute;
    width: 60%;
    left: 20%;
    top: 4%;
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper{
    position: absolute;
    width: 180px;
    font-size: 16px;
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper > p{
    text-align: left;
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper > .title{
    font-size: 18px;
    color: rgb(61,167,223);
    margin-bottom: 6px;
}
.ythy .box section.glasses.ar .section-content > .wrapper .text-wrapper{
    color: white;
}
.ythy .box section.glasses.ar .section-content > .wrapper .text-wrapper > .title{
    color: rgb(233,161,101);
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper.text1{
    left: 10%;
    top: 10%;
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper.text2{
    left: 3%;
    top: 35%;
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper.text3{
    left: 12%;
    top: 65%;
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper.text4{
    right: 10%;
    top: 10%;
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper.text5{
    right: 3%;
    top: 35%;
}
.ythy .box section.glasses .section-content > .wrapper .text-wrapper.text6{
    right: 12%;
    top: 65%;
}
@-webkit-keyframes turn{
    0%{
        -webkit-transform :rotate(0deg);
    }
    100%{
        -webkit-transform :rotate(360deg);
    }
}
@-moz-keyframes turn{
    0%{
        -webkit-transform :rotate(0deg);
    }
    100%{
        -webkit-transform :rotate(360deg);
    }
}
@-ms-keyframes turn{
    0%{
        -webkit-transform :rotate(0deg);
    }
    100%{
        -webkit-transform :rotate(360deg);
    }
}
@-o-keyframes turn{
    0%{
        -webkit-transform :rotate(0deg);
    }
    100%{
        -webkit-transform :rotate(360deg);
    }
}
@keyframes turn{
    0%{
        -webkit-transform :rotate(0deg);
    }
    100%{
        -webkit-transform :rotate(360deg);
    }
}


/* 云天智行页面样式 */
.color_blue{
    color: rgb(0,119,206);
}
.color_red{
    color: rgb(255,69,70)
}
.ytzx .box section > .wrapper { width: 1200px; margin: 0 auto; padding: 50px 0; }
.ytzx .box section > .wrapper > .title{  font:32px "微软雅黑"; color: #000000; margin: 0 auto 50px; text-align: center; line-height: 34px; letter-spacing: 2px;}
.ytzx .box section > .wrapper >  .title span{ display: inline-block; width: 50px; height: 4px; background: #f1983a; position:relative; top: -10px; margin: 0 15px;}

/*.ytzx_banner{ width: 100%; background: url(../images/ytzx/qyyb_banner1.jpg?v=1) right center #000000 no-repeat;  margin-top: 71px;background-size: 100% 100%;height:500px; }*/
.hwyb_banner{ background: url(../images/ytzx/hwyb_banner.jpg?v=1);}
/*.djyb_banner{ background: url(../images/ytzx/djyb_banner1.jpg?v=1) left center #000000 no-repeat;background-size: 100% 100%;height: 500px;}*/
.ytzx_banner .box .title{ padding-top: 150px;}
.ytzx_banner .box .text{ color: #ffffff; margin: 20px 22px;width: 350px; font-size: 16px; }
.ytzx_banner .box .button-wrapper{ color: #ffffff; margin: 30px 22px; width: 300px; }
.ytzx_banner .box .button-wrapper a{ font-size:16px; color: inherit; border-radius: 4px;box-shadow: 0 10px 10px rgba(0,0,0, .3); background: linear-gradient(to bottom, rgba(238,167,61,1) 0%, rgba(206,96,11,1) 100%); padding: 10px 60px; margin-right: 10px;}
.ytzx_banner .box .button-wrapper a:hover{ box-shadow: 0 5px 10px rgba(255,255,255, .3); }

.ytzx .box section{color: black;}
.ytzx .box section:not(.special) .section-content{display: flex;flex-wrap: wrap;margin: 0 6%;justify-content: space-between;}

.ytzx .box section.special > .title{ margin: 0 auto; }
.ytzx .box section.special .wrapper > .section-content{
    display: flex;
    justify-content: center;
    align-items: center;
}
.ytzx .box section.special .wrapper > .section-content > ul{
    width: 45%;
}
.ytzx .box section.special .wrapper > .section-content > ul > li{
    margin: 24px;
    border: 1px solid rgb(181,218,237);
    border-radius: 55px;
    height: 110px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
.ytzx.djyb .box section.special .wrapper > .section-content > ul > li{
    border: 1px solid rgb(254,188,188);
}
.ytzx .box section.special .wrapper > .section-content > ul.right > li{
    flex-direction: row-reverse;
}
.ytzx .box section.special .wrapper > .section-content > ul > li >.text{
    margin-left: 40px;
}
.ytzx .box section.special .wrapper > .section-content > ul > li > .text > p{
    font-size: 14px;
    margin-bottom: 6px;
}
.ytzx .box section.special .wrapper > .section-content > ul.right > li >.text{
    margin-left: 0;
    margin-right: 40px;
    text-align: right;
}
.ytzx .box section.special .wrapper > .section-content > ul > li >img{
    width: 110px;
    transition: all .7s;
}
.ytzx .box section.special .wrapper > .section-content > ul > li:hover >img{
    transform: rotateY(360deg);
}
.ytzx .box section.special .wrapper > .section-content > img{
    width: 35px;
}
/*.ytzx .box section.special .wrapper > .section-content > ul.left{*/
/*    margin-top: -56px;*/
/*}*/
/*.ytzx .box section.special .wrapper > .section-content > ul.right{*/
/*    margin-top: 80px;*/
/*}*/

.ytzx .box section.function .wrapper > .section-content{
    display: flex;
    flex-wrap: wrap;
}
.ytzx .box section.function .wrapper > .section-content > div{
    width: 50%;
    margin-bottom: 20px;
    overflow: hidden;

}
.ytzx .box section.function .wrapper > .section-content > div > img{
    transition: all .7s;
}
.ytzx .box section.function .wrapper > .section-content > div:hover > img{
    transform: scale(1.1);
}
.ytzx .box section.function .wrapper > .section-content > div.text-wrapper{
    box-sizing: border-box;
    padding: 5% 0 0 5%;
}
.ytzx .box section.function .wrapper > .section-content > div.text-wrapper > .title{
    font-size: 20px;
    margin-bottom: 6px;
}
.ytzx .box section.function .wrapper > .section-content > div.text-wrapper > p{
    display: flex;
}
.ytzx .box section.function .wrapper > .section-content > div.text-wrapper > p > span{
    line-height: 30px;
}
.ytzx .box section.function .wrapper > .section-content > div.text-wrapper > p > span.left{
    white-space: nowrap;
}
.ytzx .box section.function .wrapper > .section-content > div.text-wrapper > p > span.left > img{
    vertical-align: middle;
    width: 24px;
}
.ytzx .box section.function .wrapper > .section-content > div > img{
    width: 100%;
}



/* swiper样式 */
.swiper-container{
    width: 100%;
    --swiper-pagination-color: #fff;
}
.swiper-container > .nav-button{
    display: none;
}
.swiper-container:hover > .nav-button{
    display: block;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next .nav-button{
    left: 40px !important;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev .nav-button{
    right: 40px !important;
}
.swiper-container img{
    width: 100%;
    transform:scale(1.1);
}
.swiper-container .swiper-slide-active img{
    animation:scale 9s ease;
}
.swiper-pagination-bullet{
    width: 20px !important;
    height: 20px !important;
    margin: 0 8px !important;
    background: #FFFFFF !important;
}
.swiper-pagination-bullet-active{
    opacity: .8 !important;
}
.swiper-slide > span{
    font-size: 26px;
    color: #FFFFFF;
    width: 60%;
    position: absolute;
    left: 48%;
    bottom: 10%;
}
@keyframes scale {
    0% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}


/* 云天智助页面样式 */
.ytzz .box section > .wrapper { width: 1200px; margin: 0 auto; padding: 50px 0; }
.ytzz .box section > .wrapper > .title{  font:32px "微软雅黑"; color: #000000; margin: 0 auto 50px; text-align: center; line-height: 34px; letter-spacing: 2px;}
.ytzz .box section > .wrapper >  .title span{ display: inline-block; width: 50px; height: 4px; background: #f1983a; position:relative; top: -10px; margin: 0 15px;}

/*.ytzz_banner{ width: 100%; background: url(../images/ytzz/ycxz_banner1.jpg?v=1) right center #000000 no-repeat; height:  500px; margin-top: 71px;background-size: 100% 100%; }*/
.gysj_banner{ background: url(../images/ytzz/gysj_banner.jpg?v=1);}
.ytzz_banner .box .title{ padding-top: 150px;}
.ytzz_banner .box .text{ color: #ffffff; margin: 20px 22px; width: 350px; font-size: 16px; }
.ytzz_banner .box .button-wrapper{ color: #ffffff; margin: 30px 22px; width: 300px; }
.ytzz_banner .box .button-wrapper a{ font-size:16px; color: inherit; border-radius: 4px;box-shadow: 0 10px 10px rgba(0,0,0, .3); background: linear-gradient(to bottom, rgba(238,167,61,1) 0%, rgba(206,96,11,1) 100%); padding: 10px 60px; margin-right: 10px;}
.ytzz_banner .box .button-wrapper a:hover{ box-shadow: 0 5px 10px rgba(255,255,255, .3); }

.ytzz .box section{color: black;}
.ytzz .box section .section-content{display: flex;flex-wrap: wrap;margin: 0 6%;justify-content: space-between;}

.ytzz .box section.special > .title{ margin: 0 auto; }
.ytzz .box section.special .wrapper > .section-content > div{
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 15%;
    border-radius: 10px;
    padding: 30px 20px;
    background: rgb(239,239,239);
    text-align: center;
}
.ytzz .box section.special .wrapper > .section-content > div > p{
    text-align: left;
}
.ytzz .box section.special .wrapper > .section-content > div > p.title{
    margin-bottom: 4px;
    font-size: 14px;
    font-weight: bold;
}
.ytzz .box section.special .wrapper > .section-content > div > img{
    margin-bottom: 10px;
    width: 60px;
    transition: all .5s;
}
.ytzz .box section.special .wrapper > .section-content > div:hover > img{
    transform: rotateY(360deg);
}

.ytzz .box section.function .wrapper > .section-content{
    display: flex;
    flex-wrap: wrap;
}
.ytzz .box section.function .wrapper > .section-content > div{
    overflow: hidden;
    width: 50%;
    margin-bottom: 20px;
}
.ytzz .box section.function .wrapper > .section-content > div.text-wrapper{
    box-sizing: border-box;
    padding: 5% 0 0 5%;
}
.ytzz .box section.function .wrapper > .section-content > div.text-wrapper > .title{
    font-size: 20px;
    margin-bottom: 6px;
}
.ytzz .box section.function .wrapper > .section-content > div.text-wrapper > p{
    display: flex;
}
.ytzz .box section.function .wrapper > .section-content > div.text-wrapper > p > span{
    line-height: 30px;
}
.ytzz .box section.function .wrapper > .section-content > div.text-wrapper > p > span.left{
    white-space: nowrap;
}
.ytzz .box section.function .wrapper > .section-content > div.text-wrapper > p > span.left > img{
    vertical-align: middle;
    width: 30px;
}
.ytzz .box section.function .wrapper > .section-content > div > img{
    transition: all .7s;
    width: 100%;
}
.ytzz .box section.function .wrapper > .section-content > div:hover > img{
    transform: scale(1.1);
}
.ytzz .box section.scene .section-content > .wrapper{width: 30%;margin-bottom: 30px;box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);}
.ytzz .box section.scene .section-content > .wrapper .img-wrapper{width: 100%;position: relative;overflow: hidden;}
.ytzz .box section.scene .section-content > .wrapper .img-wrapper > .title {position: absolute;float: left;text-align: center;bottom: 0;font-size: 24px;width: 100%;font-weight: bold;color: white;padding: 10px 0;background: rgba(0,0,0,.6);}
.ytzz .box section.scene .section-content.gysj > .wrapper .img-wrapper > .title{bottom: 40%;}
.ytzz .box section.scene .section-content > .wrapper .img-wrapper > img{width: 100%;}
.ytzz .box section.scene .section-content > .wrapper .text-wrapper{padding: 20px;}

.ytzz .box section.scene .section-content > .wrapper .img-wrapper > img{width: 100%;transition: all .7s;height:214px;}
.ytzz .box section.scene .section-content > .wrapper:hover .img-wrapper > .title{color: #f1983a;}
.ytzz .box section.scene .section-content > .wrapper:hover .img-wrapper > img{transform: scale(1.1);}

.register main{
    height: 100vh;
    width: 100%;
    background: url(../images/register_bg.jpg?v=1);
    background-size: 100% 100%;
    position: relative;
}
.register .title{
    position: absolute;
    top: 30%;
    left: 8%;
    margin-top: 20px;
    font-size: 40px;
    color: #FFFFFF;
}
.register .form-wrapper{
    padding: 20px 80px 20px 60px;
    background: url(../images/border.png?v=1);
    background-size: 100% 100%;
    position: absolute;
    right: 10%;
    top: 20%;
}
.register .form-wrapper > p{
    text-align: center;
    font-size: 24px;
    margin-bottom: 10px;
}
.register .form-wrapper > form > ul > li{
    margin: 20px auto;
    display: flex;
    align-items: center;
}
.register .form-wrapper > form > ul > li > label{
    width: 5em;
    text-align: right;
    margin-right: 10px;
}
.register .form-wrapper > form > ul > li input{
    box-sizing: border-box;
    width: 100%;
    background: rgba(0,0,0,.3);
    height: 30px;
    font-size: 20px;
    padding: 6px 4px 6px 6px;
    color: #FFFFFF;
    outline-style: none ;
    border: 1px solid rgba(36,154,228,.1);
    box-shadow: 0 0 2px 0 rgb(64,116,153);
}
.register .form-wrapper > form > ul > li input::placeholder{
    font-size: 16px;
    color: rgba(255,255,255,.3);
}
.register .form-wrapper > form > ul > li input:focus{
    border: 1px solid rgb(36,154,228);
}
.register .form-wrapper > form > ul > li > .wrapper{
    position: relative;
}
.register .form-wrapper > form > ul > li > .wrapper > .error_tip{
    position: absolute;
    left: 4px;
    top: 100%;
    color: red;
    white-space: nowrap;
    display: none;
}
.register .form-wrapper > form > .button{
    width: 90%;
    text-align: center;
    margin: 30px auto 20px;
    padding: 10px 0;
    border-radius: 4px;
    font-size: 18px;
    background: linear-gradient(to bottom, #00b6fe 0%,#0370d0 100%);
}
.register .form-wrapper > form > .button:hover{
    cursor: pointer;
}
.register .form-wrapper > a{
    font-size: 16px;
    color: #FFFFFF;
    float: right;
}

.register > main .mask{
    background: rgba(0,0,0,.5);
    width: 100%;
    height: 100%;
    position: fixed;
    display: none;
}

.register > main .mask > .confirm{
    overflow: hidden;
    background: url(../images/popover_bg.png?v=1);
    background-size: 100% 100%;
    width: 30%;
    height: 30%;
    margin: 15% auto;
}
.register > main .mask > .confirm > .confirm-title{
    margin-top: 5%;
    font-size: 30px;
    text-align: center;
}
.register > main .mask > .confirm > p{
    margin: 10% 0;
    text-align: center;
}
.register > main .mask > .confirm > .button{
    cursor: pointer;
    width: 40%;
    text-align: center;
    margin: 30px auto 20px;
    padding: 10px 0;
    border-radius: 4px;
    font-size: 18px;
    background: linear-gradient(to bottom, #00b6fe 0%,#0370d0 100%);
}



/*.ytzn_banner{ width: 100%; background: url(../images/ytzn/ytzn_banner.jpg?v=1) center/cover #000000 no-repeat; height: 500px; margin-top: 71px; }*/
.ytzn_banner > img{
    margin-top: 71px;
    width: 100%;
}
.ytzn_banner > .box{
    width: 40%;
    margin-left: 45%;
}
.ytzn_banner > .box > .title{
    margin: 0 0 20px 0;
}
.ytzn_banner > .box > .text{
    font-size: 22px;
    line-height: 1.4;
}

.mxcs img{
    width: 100%;
}
.mxcs .content{
    margin: 40px auto 0;
    color: black;
    width: 1200px;
}
.mxcs .content > nav{
    display: flex;
}
.mxcs .content > nav:not(:first-child){
    border-bottom: 1px solid #0e56a0;
    padding-bottom: 20px;
}
.mxcs .content > nav > div{
    flex-shrink: 0;
}
.mxcs .content > nav .nav-title{
    text-align: center;
    width: 4em;
    font-size: 18px;
    padding-right: 30px;
    border-right: 2px solid #0e56a0;
}
.mxcs .content > nav > ul.type {
    display: flex;
    flex-wrap: wrap;
}
.mxcs .content > nav > ul.type > li{
    width: 5em;
    text-align: center;
    cursor: pointer;
    font-size: 18px;
    margin: 0 30px 20px;
}
.mxcs .content > nav > ul.type > li.active{
    color: #0e56a0;
}
.mxcs section{
    margin-top: 50px;
}
.mxcs section .section-content{display: flex;flex-wrap: wrap;}
.cjfl_banner{ width: 100%; background: url(../images/ytzn/cjfl_banner.jpg?v=1) 100% 100% #000000 no-repeat; height: 500px; margin-top: 71px; }
.cjfl_banner .box .title{ padding-top: 150px;}
.cjfl_banner .box .text{ color: #ffffff; margin: 20px 0 20px 3em; width: 350px; font-size: 36px; }
.mxcs section.model .section-content > .wrapper{width: 23%;margin: 0 1% 30px;box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);transition: all .5s;}
.mxcs section.model .section-content > .wrapper .img-wrapper{width: 100%;position: relative;margin-bottom: 10px;}
.mxcs section.model .section-content > .wrapper .img-wrapper > .title{position: absolute;float: left;text-align: center;bottom: 40%;font-size: 18px;width: 100%;font-weight: bold;color: white;}
.mxcs section.model .section-content > .wrapper .img-wrapper > img{width: 100%;}
.mxcs section.model .section-content > .wrapper:hover{transform: scale(1.1);}
.mxcs section.model .section-content > .wrapper .text{margin: 0 20px 20px; display: flex; justify-content: space-between;}

.course .content{
    margin-top: 71px;
}
.course img{
    width: 100%;
}

.mxxq { font-size: 16px; }
.mxxq .box section > .wrapper { width: 1200px; margin: 0 auto; padding: 50px 0; }
.mxxq .box section > .wrapper > .title{  font:32px "微软雅黑"; color: #000000; margin: 0 auto 50px; text-align: center; line-height: 34px; letter-spacing: 2px;}
.mxxq .box section > .wrapper >  .title span{ display: inline-block; width: 50px; height: 4px; background: #f1983a; position:relative; top: -10px; margin: 0 15px;}

.mxxq .box section .section-content{display: flex;flex-wrap: wrap;justify-content: space-between;}

.mxxq .box section.general{ margin-top: 71px; }
.mxxq .box section.general > .wrapper > .button{ background: #0e56a0; padding: 6px 20px; border-radius: 4px; display: inline-block; margin-bottom: 30px; color: white; font-size: 16px;}
.mxxq .box section.general > .wrapper > .inner-wrapper{
    display: flex;
    border-bottom: 1px solid #0e56a0;
    padding-bottom: 50px;
}
.mxxq .box section.general > .wrapper > .inner-wrapper > img{
    width: 280px;
}
.mxxq .box section.general > .wrapper > .inner-wrapper > .text-wrapper{
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: space-between;
    margin-left: 30px;
}
.mxxq .box section.general > .wrapper > .inner-wrapper > .text-wrapper > .title{
    font-size: 26px;
    color: black;
    font-weight: bold;
}
.mxxq .box section.general > .wrapper > .inner-wrapper > .text-wrapper > .content{
    font-size: 16px;
}
.mxxq .box section.general > .wrapper > .inner-wrapper > .text-wrapper > .content > .tag1 > span{
    font-size: inherit;
    background: #0e56a0; padding: 6px 14px; border-radius: 4px; display: inline-block; margin-right: 20px;
}
.mxxq .box section.general > .wrapper > .inner-wrapper > .text-wrapper > .content > .tag2{
    font-size: inherit;
    background: #0e56a0; padding: 6px 14px; border-radius: 4px; margin: 20px 0;
}
.mxxq .box section.general > .wrapper > .inner-wrapper > .text-wrapper > .content > .keywords{
    font-size: 16px;
    color: black;
}
.mxxq .box section.general > .wrapper > .inner-wrapper > .text-wrapper > .content > .keywords > span{
    font-size: inherit;
    margin-left: 20px;
}

.mxxq .box section.function div > img{ width: 100%; }

.mxxq .box section.model .section-content{}
.mxxq .box section.model .section-content > .wrapper{
    width: 100%;
}
.mxxq .box section.model .section-content > .wrapper > .text{
    text-indent: 2em;
    margin: 0 20px;
    font-size: 20px;
    color: black;
}
.mxxq .box section.model .section-content > .wrapper > .content{
    padding: 50px 0;
    margin-top: 20px;
    background: center / cover no-repeat url(../images/ytzn/bg1.jpg);
    display: flex;
    justify-content: space-around;
}
.mxxq .box section.model .section-content > .wrapper > .content > div{
    width: 40%;
}
.mxxq .box section.model .section-content > .wrapper > .content > div > .title{
    font-size: 28px;
    color: #f1983a;
    margin-bottom: 40px;
}
.mxxq .box section.model .section-content > .wrapper > .content > div > .text{
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
}
.mxxq .box section.model .section-content > .wrapper > .content > div > .text > span{
    font-size: 22px;
}

.mxxq .box section.scene .section-content > .wrapper{width: 30%;margin-bottom: 30px;box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);overflow: hidden;}
.mxxq .box section.scene .section-content > .wrapper .img-wrapper{width: 100%;position: relative;}
.mxxq .box section.scene .section-content > .wrapper .img-wrapper > .title {position: absolute;float: left;text-align: center;bottom: 50%;font-size: 24px;width: 100%;font-weight: bold;color: white;}
.mxxq .box section.scene .section-content > .wrapper .img-wrapper > img{width: 100%;transition: all .7s;}
.mxxq .box section.scene .section-content > .wrapper:hover .img-wrapper > .title{color: #f1983a;}
.mxxq .box section.scene .section-content > .wrapper:hover .img-wrapper > img{transform: scale(1.1);}

.cooperation{
    padding: 60px 0;
    width: 100%;
    background: center / cover no-repeat url(../images/ytzn/bg.jpg);
    display: flex;
    justify-content: center;
    align-items: center;
}
.cooperation > .title,
.contact > .title{
    width: 1em;
    margin-right: 100px;
    font-size: 30px;
    color: #f1983a;
}
.cooperation > .wrapper{
    width: 70%;
    display: flex;
    flex-wrap: wrap;
}
.cooperation > .wrapper > div{
    margin: 20px;
    width: 10%;
}
.contact{
    padding: 50px 0;
    width: 100%;
    background: center / cover no-repeat url(../images/ytzn/contact_bg.jpg);
    display: flex;
    justify-content: center;
    align-items: center;
}
.contact > .wrapper{
    width: 70%;
    display: flex;
}
.contact > .wrapper > div{
    display: flex;
    flex-direction: column;
}
.contact > .wrapper > div.left{
    margin-right: 10%;
    margin-left: 20px;
}
.contact > .wrapper > div > .title{ font-size: 30px; padding-left:20px; border-left: 4px solid white; line-height: 30px;  position: relative; height: 30px; margin: 0 0 20px 0;  }
.contact > .wrapper > div > .text{
    margin: 0 0 20px 25px;
}
.contact > .wrapper > div > .text > p{
    font-size: 14px;
    margin-bottom: 6px;
}
.contact > .wrapper > div > .text > .font24{font-size: 24px;}

.course section.special > .wrapper { width: 100%; margin: 0 auto; padding: 50px 0; background: center / cover no-repeat url(../images/ytzn/bg2.jpg); }
.course section > .wrapper > .title{ font:32px "微软雅黑"; color: #000000; margin: 0 auto 50px; text-align: center; line-height: 34px; letter-spacing: 2px; }
.course section > .wrapper > .title span{ display: inline-block; width: 50px; height: 4px; background: #f1983a; position:relative; top: -10px; margin: 0 15px; }
.course section > .wrapper > .section-content{ display: flex;margin: 0 6%;justify-content: center; }
.course section > .wrapper > .section-content > div{
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 15%;
    text-align: center;
}
.course section > .wrapper > .section-content > div > p{
    font-size: 24px;
    text-align: left;
    color: black;
}
.course section > .wrapper > .section-content > div > img{
    margin-bottom: 20px;
    width: 80px;
    transition: all .5s;
}
.course section > .wrapper > .section-content > div:hover > img{
    transform: rotateY(360deg);
}

.course section.model {
    padding: 50px 0;
}
.course section.model > .wrapper{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.course section.model .section-content{display: flex;flex-wrap: wrap; justify-content: flex-start;}
.course section.model .section-content > .wrapper{width: 23%; margin: 0 1% 40px;box-shadow: 0 3px 10px 1px rgba(0,0,0, .3);transition: all .5s; }
.course section.model .section-content > .wrapper > a {width: 100%;}
.course section.model .section-content > .wrapper .img-wrapper{width: 100%;position: relative;}
.course section.model .section-content > .wrapper .img-wrapper > img{width: 100%;}
.course section.model .section-content > .wrapper:hover{transform: scale(1.1);}
.course section.model .section-content > .wrapper .text{margin: 20px 0; display: flex; justify-content: center;}
.course section.model .section-content > .wrapper .text > span{
    font-size: 24px;
    color: #0e56a0;
}
.course section.model > .wrapper > .button{
    width: 100%;
    display: flex;
    justify-content: center;
}
.course section.model > .wrapper > .button > a{
    font-size: 24px;
    color: #0e56a0;
    padding: 12px 30px;
    border-radius: 6px;
    border: 1px solid #0e56a0;
}


/* 组合应用页面样式 */
.zhyy .box section > .wrapper { width: 1200px; margin: 0 auto; padding: 50px 0; }
.zhyy .box section > .wrapper > .title{  font:32px "微软雅黑"; color: #000000; margin: 0 auto 50px; text-align: center; line-height: 34px; letter-spacing: 2px;}
.zhyy .box section > .wrapper > .title span{ display: inline-block; width: 50px; height: 4px; background: #f1983a; position:relative; top: -10px; margin: 0 15px;}

.zhyy_banner{ width: 100%; background: url(../images/zhyy/zhyy_banner.jpg?v=1) 100% 100% #000000 no-repeat; height: 500px; margin-top: 71px; }
.zhyy_banner .box .title{ padding-top: 150px;}
.zhyy_banner .box .text{ color: #ffffff; margin: 20px 0 20px 3em; width: 350px; font-size: 36px; }
.zhyy_banner .box .button-wrapper{ color: #ffffff; margin: 30px 22px; width: 300px; }
.zhyy_banner .box .button-wrapper a{ font-size:16px; color: inherit; border-radius: 4px;box-shadow: 0 10px 10px rgba(0,0,0, .3); background: linear-gradient(to bottom, rgba(238,167,61,1) 0%, rgba(206,96,11,1) 100%); padding: 10px 60px; margin-right: 10px;}
.zhyy_banner .box .button-wrapper a:hover{ box-shadow: 0 5px 10px rgba(255,255,255, .3); }

.zhyy .box section .section-content > img{
    width: 100%;
}


.ytzx .productsList {width: 1056px;margin: 0 auto;overflow: hidden;}
.ytzx .productsList ul {overflow: hidden;display: flex;}

.ytzx .productsList ul li { float: left;width: 131.88px;border: 1px solid red;height: 40px;line-height: 40px;text-align: center;}
.ytzx .jswmList ul li { float: left;width: 131.88px;border: 1px solid #15b4da;height: 40px;line-height: 40px;text-align: center;}
.ytzx .szxcList ul li { float: left;width: 131.88px;border: 1px solid #0fab86;height: 40px;line-height: 40px;text-align: center;}

.ytzx .productsList ul li {border-right: none;cursor: pointer;}

.ytzx .productsList ul li:last-child{ border-right: 1px solid red;}
.ytzx .jswmList ul li:last-child{ border-right: 1px solid #15b4da;}
.ytzx .szxcList ul li:last-child{ border-right: 1px solid #0fab86;}

.ytzx .productsList ul li.active { background: red;color: #fff;}
.ytzx .jswmList ul li.active { background: #15b4da;color: #fff;}
.ytzx .szxcList ul li.active { background: #0fab86;color: #fff;}

.ytzx .box .productsList .wrapper { padding: 1px;}
.ytzx .productsList .wrapper {width: 100% !important;}
.ytzx .productsList .wrapper .section-content { margin: 0 !important; height: 320px;}
.ytzx .productsList .wrapper .section-content>div {width: 30%!important;}
.ytzx .productsList .wrapper .section-content .text-wrapper { width: 70%!important;}
.ytzx .productsList .wrapper .section-content>div{height: 100%;}
.ytzx .productsList .wrapper .section-content .text-wrapper { height: 100%;}
.ytzx .productsList .wrapper .section-content >div img {height: 90%;margin-top: 3%;}
.ytzx .productsList .wrapper .centtext { width: 90%;}
.ytzx .productsList .wrapper .centtext p { line-height: 30px;}
.ytzx .productsList .function { display: none;}
.ytzx .productsList .function.active {display: block;position: relative;top: 10px}
.wrapper .function .section-content .section-p { font-size: 20px;margin: 20px 0;text-align: left;text-indent: 2em;line-height: 1.7em;font-weight: normal;padding: 0 120px; word-break: initial;}