body {color:#555555; overflow-x: hidden;} a{color:#555555}a:active,a:hover {color:#005ca1}

.null{width:100%;float:left;line-height:100px;text-align:center;}

#obtn{float: left; width: 100%;}

.container1{margin:0 auto;padding-left:15px; padding-right:15px;}

.maxWidth{margin:0 auto; padding-left:15px; padding-right:15px;}

@media (min-width: 768px) {

	 .maxWidth{ width: 768px; }

     .container1{width: 768px;}

 }

 @media (min-width: 992px) {

     .maxWidth{ width: 992px; }

     .container1{width: 992px;}

 }

@media (min-width:1230px) {

    .maxWidth{width:1230px;}

    .container1{width: 1230px;}

}

 @media (min-width: 1500px) {

	 .maxWidth{/*width:1570px;*/width:1400px;}

     .container1{/*width: 100%;*/width:1400px;}

 }
#obtn.header_top{z-index:9999}
#obtn .head{ float:left; width:100%;z-index:66; padding:0 2.35%; background:#fff;

    /*border-bottom: 4px solid #005a9d;*/

    -webkit-transition: 0.5s ease;

    -moz-transition: 0.5s ease;

    -ms-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;}

#obtn .logo{float:left; margin:20px 20px 0 0; width:180px; height:45px; line-height:0;}

#obtn .languageBox{ float:right; position:relative; padding:20px 0 20px 30px;}

#obtn .languageBox h5{ float:left; min-width:70px; text-align:right; color:#333333; font-size:20px; text-transform: uppercase; line-height:45px; padding-left:41px; cursor:pointer;}

#obtn .languageBox h5 img{ float:left; /*position:absolute; left:0; top:50%;*/ width:24px; height:24px; margin-top:12.5px;}

#obtn .languageBox ul{ display:none; float:left; width:100px; position:absolute; left:0; top:69px; background:#fff; padding:10px 0; z-index: 99; margin-left:30px;}

#obtn .languageBox ul li{ float:left; width:100%; color:#333333; font-size:18px; line-height:54px; text-align:center; cursor:pointer;

    -webkit-transition: 0.5s ease;

    -moz-transition: 0.5s ease;

    -ms-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;

}

#obtn .languageBox ul li:hover{ color:#0068b7;}



#obtn .so{ float:right; position:relative; z-index:6; height: 45px; margin: 20px 0 20px 20px; padding-right: 20px;

    -webkit-transition: 0.5s ease;

    -moz-transition: 0.5s ease;

    -ms-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;

}

/*#obtn .so form{

   border-radius: 20px;

  border: solid 1px #c7c7c7;

  padding:0 10px;

  overflow: hidden;   

}*/

#obtn .so:after{position: absolute; content: ''; width:1px; height:30px; right: 0; top:50%; margin-top: -15px; background: #dddddd;}

#obtn .so:before{position: absolute; content: ''; width:0; height:1px; background: #dfdfdf; right: 59px; bottom: 0;

    -webkit-transition: 0.5s ease;

    -moz-transition: 0.5s ease;

    -ms-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;

}

#obtn .so .Search{ float:left; width:0; height:35px; background:#C01; background:none; border:0; line-height:22px; padding:7px 0; overflow:hidden; color:#333333; font-size:16px; margin-top: 5px;

    -webkit-transition: 0.5s ease;

    -moz-transition: 0.5s ease;

    -ms-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;

}

#obtn .so .sear_sub{ float:left; width:24px; height:24px; background:url(../images/top2.png) center no-repeat; margin: 11px 0 10px 0;}

#obtn .so.on .Search,

#obtn .so:hover .Search{ width:220px;}

#obtn .so.on:before,

#obtn .so:hover:before{ width:245px;}

#obtn .so ::-webkit-input-placeholder{color:#999;}

#obtn .so :-moz-placeholder{color:#999;}

#obtn .so ::-moz-placeholder{color:#999;}

#obtn .so :-ms-input-placeholder{color:#999;}

#obtn .shareBox{float: right; margin:29px 0 28px 20px;}

/*20201203start修改*/

/*#obtn .shareBox li{float: left; width: 30px; height: 30px; line-height: 0; cursor: pointer; margin-left: 7px;border-radius: 100%;position: relative;z-index: 99;}*/

#obtn .shareBox li{float: left;line-height: 0; cursor: pointer; margin-left: 7px;border-radius: 100%;position: relative;z-index: 99;}

#obtn .shareBox li a{display: inline-flex;line-height: 25px;}

#obtn .shareBox li img{background: #ababab;border-radius: 100%;}

#obtn .shareBox li a span{padding-left:5px;color:#ff0000;font-size:20px;}

#obtn .shareBox li:hover img{background-color: #0068b7;}

#obtn .shareBox li .wy_ewm{display: none; width: 107px;height: 115px;padding: 4px;padding-top: 15px; position: absolute;left: 50%; background: url(images/img4.png)no-repeat center center;background-size: cover;

-webkit-transform: translate(-50%,0); 

-ms-transform: translate(-50%,0);

top: -moz-calc(100% + 6px);

top: -o-calc(100% + 6px);

top: -webkit-calc(100% + 6px);

top: calc(100% + 6px);}

#obtn .shareBox li .wy_ewm .ewm{width: 100%;height: 100%;}

#obtn .shareBox li:hover .wy_ewm{display: block;}

#obtn .shareBox li .tel_text{
  display: none;
  width: 170px;
  height: 45px;
  text-align: center;
  padding: 4px;
  padding-top: 15px;
  position: absolute;
  left: 50%; 
  background:#fff;
  -webkit-transform: translate(-50%,0); 
  -ms-transform: translate(-50%,0);
  top: -moz-calc(100% + 6px);
  top: -o-calc(100% + 6px);
  top: -webkit-calc(100% + 6px);
  top: calc(100% + 6px);
}

#obtn .shareBox li .tel_text span{font-size: 20px;line-height: 25px;color:#0068b7}

#obtn .shareBox li:hover .tel_text{display: block;}

/*20201203end修改*/

/*menu*/

#obtn .menu{float: right;}

#obtn .menu .nli{ float:left; padding:0 5px; margin:0; position:relative;}

#obtn .menu .nli span a{ float:left; position:relative; padding:0; color:#000; font-size:18px; line-height: 85px; text-transform: uppercase;font-weight: 600;font-family: Arial;}

#obtn .menu .nli span a:hover,

#obtn .menu .nli.on span a{color:#005ca1}

#obtn .menu .sub{display: none; float:left; position:absolute; /*left:50%; margin-left: -130px;*/ top:85px; width:260px; z-index:99; border-top:4px solid #0068b7;}

#obtn .menu .sub .l2{ float:left; width:100%; background:#fff;}

#obtn .menu .sub .l2 .la2{ float:left; width:100%; padding:0 0 0 20px; color:#333333; font-size:18px; font-family: Arial; line-height:54px; position:relative;}

#obtn .menu .sub .l2 .la2 i{position: absolute; right: 20px; width: 8px; height: 14px; top:50%; margin-top: -7px; line-height: 0;

    -webkit-transition: 0.5s ease;

    -moz-transition: 0.5s ease;

    -ms-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;

}

#obtn .menu .sub .l2 .la2 i:last-child{opacity: 0; filter:alpha(opacity=0);}

#obtn .menu .sub .l2:hover .la2 i:first-child{opacity: 0; filter:alpha(opacity=0);}

#obtn .menu .sub .l2:hover .la2 i:last-child{opacity:1; filter:alpha(opacity=100);}

#obtn .menu .sub .l2:first-child{padding-top: 9px;}

#obtn .menu .sub .l2:last-child{padding-bottom: 9px;}

#obtn .menu .sub .l2:hover .la2{ background:#e8ecef; color:#0068b7;}

#obtn .menu .ul3{ display:none; float:left; width:260px; position:absolute; left:100%; top:0; background:#e8ecef; padding:9px 5px 9px 20px; }

#obtn .menu .ul3 .l3{ float:left; width:100%;}

#obtn .menu .ul3 .l3 .la3{ float:left; width:100%; color:#333333; font-size:18px; line-height:54px;font-family: Arial;}

#obtn .menu .ul3 .l3 .la3:hover{ color:#0068b7;}

#obtn .menu .sub .l2:hover .ul3{ display:block;}

/*投资者关�?*/

#obtn .bk{width:1320px; float:left;margin:0 125px;}

#obtn .ad{width:660px;float:left; padding:30px 30px;}

#obtn .ad .title{width:100%;float:left; padding-left:20px;background:rgb(0, 104, 183);font-size: 20px; line-height:58px;color:#fff}

#obtn .ad .content{width:100%; float:left;padding:20px;font-size:16px;line-height:30px;border-left:1px solid #dddddd;border-right:1px solid #dddddd;border-bottom:1px solid #dddddd}

@media screen and (max-width:1570px){

    .maxWidth{padding: 0 15px;}

    #obtn .bk{width:1240px; float:left;margin:0 0px;}

    #obtn .ad{width:620px;float:left; padding:10px;}



}

@media screen and (max-width:1230px){

    

}

@media screen and (max-width:1700px){

    #obtn .menu .nli{padding: 0 20px;}

    #obtn .menu .nli span a{font-size: 18px;}

    #obtn .languageBox h5{font-size: 18px;}

    #obtn .so{margin: 20px 0 20px 40px;padding-right: 40px;}

    #obtn .so:before{right:40px;}

    #obtn .so.on .Search,#obtn .so:hover .Search{ width:180px;}

    #obtn .so.on:before,#obtn .so:hover:before{ width:205px;}

    #obtn .shareBox {margin: 29px 0 28px 30px;}

    #obtn .menu .sub .l2 .la2{font-size: 16px;}

    #obtn .menu .ul3 .l3 .la3{font-size: 16px;}

    #obtn .languageBox ul li{font-size: 16px;}

    /*#obtn .bk{width:100%;margin:0}

    #obtn .ad{width:100%; margin:6px 0;}*/

}

@media screen and (max-width:1569px){

    #obtn .head{padding: 0;}

    #obtn .menu .nli{padding: 0 20px;}

    #obtn .menu .nli span a{font-size: 16px;}

    #obtn .languageBox{padding: 20px 0 20px 20px;}

    #obtn .languageBox h5{font-size: 16px; padding-left: 35px}

    #obtn .languageBox ul li{font-size: 15px; line-height: 50px;}

    #obtn .so{margin: 20px 0 20px 20px;padding-right: 20px;}

    #obtn .so .Search{font-size: 14px;}

    #obtn .so:before{right:20px;}

    #obtn .so.on .Search,#obtn .so:hover .Search{ width:150px;}

    #obtn .so.on:before,#obtn .so:hover:before{ width:175px;}

    #obtn .menu .sub{width: 140px; margin-left: -15px;}

    #obtn .menu .sub .l2 .la2{font-size: 15px; line-height: 50px;}

    #obtn .menu .ul3 .l3 .la3{font-size: 15px;line-height: 50px;}

    #obtn .shareBox{margin: 30px 0 30px 20px;}

    /*#obtn .shareBox li{width: 25px; height: 25px;}*/
  
    #obtn .shareBox li img{width: 25px; height: 25px;}

}

@media screen and (max-width:1229px){

    #obtn .logo{width: 140px; height: 35px; margin: 15px 0;}

    #obtn .menu .nli{padding: 0 10px;}

    #obtn .menu .nli span a{font-size: 14px;line-height:65px;}

    #obtn .menu .sub{top:65px; width:200px;}

    #obtn .menu .sub .l2 .la2{padding: 0 0 0 15px; line-height: 45px;}

    #obtn .menu .sub .l2 .la2 i{right: 15px;}

    #obtn .menu .ul3{width: 240px;}

    #obtn .menu .ul3 .l3 .la3{line-height: 45px;}

    #obtn .languageBox{padding: 10px 0 10px 20px;}

    #obtn .languageBox h5{font-size: 14px; padding-left: 30px;}

    #obtn .languageBox h5 img{width: 20px; height: 20px; /*margin-top: -10px;*/}

    #obtn .so{height: 41px;margin: 12px 0 12px 15px;padding-right: 15px;}

    #obtn .so .sear_sub{width: 20px; height: 20px;background: url(../images//top2.png) center no-repeat; background-size: cover; position: relative; z-index: 3;}

    #obtn .so:before{right:15px;}

    #obtn .so:after{height: 26px;margin-top: -13px;}

    #obtn .so .Search{position: absolute; right:5px; z-index: 1;}

    #obtn .so.on .Search,

    #obtn .so:hover .Search{ width:160px; background: #f5f5f5; text-indent: 12px;}

    #obtn .so.on:before,

    #obtn .so:hover:before{ width:0;}

    #obtn .shareBox{margin: 22px 0 22px 15px;}

    #obtn .shareBox li{margin-left: 5px; /*width: 25px; height: 25px;*/}

    #obtn .languageBox ul{top:59px;padding:5px 0;}

    #obtn .languageBox ul li{line-height: 40px;}

}

@media screen and (max-width:991px ){

    /*20201203start修改*/

    #obtn .head{position: fixed; z-index: 99;}

    /*20201203end修改*/

    #obtn .logo{ margin:15px 0; width:122px; height:30px;}

    #obtn .menu{ display:none;}

    #obtn .languageBox{padding:15px 0 15px 20px;}

    #obtn .languageBox h5{line-height: 30px;}

    #obtn .so{ display:none;}

    #obtn .so:after{display:none;}

    #obtn .soPH{ display:block; position:relative; width:100%; margin:15px 0;}

    #obtn .soPH .Search{ width:100%; margin-right:0; background: #0068b7; background:rgba(0,104,183,0.8); padding:7px 40px 7px 0; text-indent: 15px; color:#fff; right: 0;}

    #obtn .soPH.on .Search,

    #obtn .soPH:hover .Search{ width:100%;background: #0068b7;text-indent: 15px;}

    #obtn .soPH .sear_sub{ right:10px; position:absolute; background: url("../images//top2_1.png") no-repeat; background-size: cover; margin: 0; top:50%; margin-top: -10px;}

    #obtn .shareBox{margin:10px 0; width: 100%; display: block; text-align: center;}

    #obtn .shareBox li{width: 25px; height: 25px; float: none; margin: 0 5px; display: inline-block;}

    #obtn .so ::-webkit-input-placeholder{color:#fff;}

    #obtn .so :-moz-placeholder{color:#fff;}

    #obtn .so ::-moz-placeholder{color:#fff;}

    #obtn .so :-ms-input-placeholder{color:#fff;}

    #obtn .pcShare{display: none}

    #obtn .languageBox ul{top:49px;}

}



/*鎵嬫�?瀵艰埅鎸夐挳*/

#obtn .menuph{ display:none; float:right; width:28px; height:22px; cursor: pointer; text-align: center; margin:20px 0 18px 20px;}

#obtn .menuph .point { float:left; width: 28px;  height: 22px; position: relative;}

#obtn .menuph .point:hover .navbtn,

#obtn .menuph .point:hover .navbtn::after,

#obtn .menuph .point:hover .navbtn::before {  width: 28px;  }

#obtn .menuph .navbtn {  position: absolute;  top: 10px;  right: 0;  display: inline-block;  width: 21px;  height: 2px;  -webkit-transition: all .3s ease-out 0s;  -moz-transition: all .3s ease-out 0s;  -ms-transition: all .3s ease-out 0s;  -o-transition: all .3s ease-out 0s;  transition: all .3s ease-out 0s;  background: #0068b7;  }

#obtn .menuph .navbtn::after,

#obtn .menuph .navbtn::before {  position: absolute;  right: 0;  display: inline-block;  width: 28px;  height: 2px;  content: '';  -webkit-transition: all .3s ease-out 0s;  -moz-transition: all .3s ease-out 0s;  -ms-transition: all .3s ease-out 0s;  -o-transition: all .3s ease-out 0s;  transition: all .3s ease-out 0s;  background: #0068b7;  }

#obtn .menuph .navbtn::after {  top: -11px;  }

#obtn .menuph .navbtn::before {  top: 10px;  }

#obtn .menuph .point.active .navbtn{  background: transparent;  }

#obtn .menuph .point.active .navbtn::after{  -webkit-transform: rotate(45deg);  -moz-transform: rotate(45deg);  -ms-transform: rotate(45deg);  -o-transform: rotate(45deg);  transform: rotate(45deg);  top: 0px;  }

#obtn .menuph .point.active .navbtn::before {  -webkit-transform: rotate(-45deg);  -ms-transform: rotate(-45deg);  -o-transform: rotate(-45deg);  transform: rotate(-45deg);  top: 0px;  }



@media screen and (max-width:991px ){

    #obtn .menuph{ display:block;}

     #obtn .languageBox h5 img{margin-top: 3px;}

}



/*鎵嬫�?瀵艰�?*/

#obtn .xialaph{ position:fixed; left:0; top:0; float:left; width: 100%; height:100%; overflow:scroll; padding:62px 0 100px 0;  display: none;  z-index:60; background:#fff; background:rgba(255,255,255,0.9);}

#obtn .xialaph .ul2,

#obtn .xialaph .ul3{display: none;}

#obtn .xialaph h4{ float:left; width:100%; position:relative;}

#obtn .xialaph h4 a{ float:left; width:66%; color: #333; font-size:16px; line-height:50px; position:relative;text-transform: uppercase; font-family: Arial; }

#obtn .xialaph li h4 a i{ float:left; position:absolute; left:0; top:50%; margin-obtn:-10px; width:20px; height:20px;}

#obtn .xialaph li:last-child h4::before{  content: '';  position: absolute;  bottom: 0;  left: 0;  width: 100%;  height: 1px;  background-color: #fff;  opacity: 0.3; }

#obtn .xialaph h4::after{  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 1px;  background-color: #000; opacity: 0.1;  }

#obtn .xialaph h5 a{ float:left; width:75%;  color: #555;  font-size:14px; line-height:40px; padding:0; font-family: Arial;}

#obtn .xialaph h5{ float:left; width:100%;position: relative;  }

#obtn .xialaph h5::after{  content: '';  position: absolute;  bottom: 0;  left: 0;  right: 0;  height: 1px;  background-color: #000; opacity: 0.1;  }

#obtn .xialaph li:last-child h5::after{  display: none;  }

#obtn .xialaph h4 img{  width: 15px;  height: 8px;  float: right;  margin-top: 21px;  cursor: pointer;  }

#obtn .xialaph h5 img{  width: 11px;  height: 6px;  float: right;  margin-top: 17px;  margin-right: 10px; cursor: pointer; }

#obtn .xialaph h4.active img.img_s,

#obtn .xialaph h5.active img.img_s{  display: none;  }

#obtn .xialaph h4.active img.img_d,

#obtn .xialaph h5.active img.img_d{  display: block;  }

#obtn .xialaph .ul2{ float:left; width:100%; padding:0 10px;}

#obtn .xialaph .ul3{ float:left; width:100%; padding:5px 10px;border-bottom: 1px solid rgba(0,0,0,0.1);}

#obtn .xialaph .ul3 li{float: left; width:100%; font-size: 14px; line-height: 35px;}

#obtn .xialaph .ul3 li a{float: left; width: 100%; font-family: Arial;}

#obtn .xialaph .img_d{  display: none;  }



/*鎵嬫�?搴曢儴�?�艰�?*/

#obtn .pf_down{width:100%; float:left; position:fixed; left:0; bottom:0; height:50px; background:#005ca1; z-index:60; box-shadow:0 -4px 7px rgba(0,0,0,0.15);}

#obtn .pf_down li{ width:33.33%; float:left; text-align:center; padding:7px 0 5px 0; border-right:1px solid rgba(255,255,255, 0.2);}

#obtn .pf_down li:last-child{ border:none;}

#obtn .pf_down li .ico{ width:100%; float:left; height:20px;}

#obtn .pf_down li .ico img{ width:20px; height:20px;}

#obtn .pf_down li .name{ width:100%; float:left; margin-top:4px; font-size:12px; color:#fff; line-height:14px;}

/*鍙充晶婕傛诞*/

#obtn .pf_right{ float:right; width:52px; position:fixed; right:10px; top:50%; margin-top:-75px; z-index:66;

    -webkit-transition: all 0.2s ease-out 0s;

    -moz-transition: all 0.2s ease-out 0s;

    -o-transition: all 0.2s ease-out 0s;

    transition: all 0.2s ease-out 0s;}

#obtn .pf_right ul{ float:left; width:100%;}

#obtn .pf_right li{ float:left; width:100%; position:relative; height:52px; z-index:6; margin-top: 20px;

}

#obtn .pf_right li:last-child{ border-bottom:none;}

#obtn .pf_right li .ico{ float:left; width:52px; line-height:0; text-align:center; position:relative; z-index:6;background: #2d2d2d; background: rgba(45,45,45,0.4);

    border-radius: 30px;

    -moz-border-radius: 30px;

    -webkit-border-radius: 30px;

    -webkit-transition: 0.5s ease; -moz-transition: 0.5s ease;

    -ms-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;}

#obtn .pf_right li:hover .ico{ background:#0068b7;

    border-radius: 30px;

    -moz-border-radius: 30px;

    -webkit-border-radius: 30px;

}

/*banner*/

#obtn .slide_banner{ float:left; width:100%; margin:0; position:relative; overflow:hidden; text-align:center;}

#obtn .slide_banner .slick-slide{ width:100%; padding:0; position:relative; line-height:0;}

#obtn .slide_banner img{ width:100%;}

#obtn .slide_banner .slick-dots{ height:25px; bottom:57px; }

#obtn .slide_banner .slick-dots li{ width:25px; height:25px; margin:0 7px; padding:8px;text-align:center; text-indent:-9999px; overflow:hidden; vertical-align:top; position: relative;

}

#obtn .slide_banner .slick-dots li button{ width: 9px; height: 9px;border:1px solid #fff; padding: 0;

    border-radius: 10px;-moz-border-radius: 10px;-webkit-border-radius: 10px;

}

#obtn .slide_banner .slick-dots li button:after{position: absolute; content: ''; width: 25px; height: 25px; left:0; top:0; border:1px solid #fff;

    opacity: 0; filter:alpha(opacity=0);

    border-radius: 15px;-moz-border-radius: 15px;-webkit-border-radius: 15px;

}

#obtn .slide_banner .slick-dots li.slick-active button{background:#fff;}

#obtn .slide_banner .slick-dots li.slick-active button:after{opacity: 1; filter:alpha(opacity=100);}

#obtn .slide_banner .slick-prev,

#obtn .slide_banner .slick-next{width: 68px; height: 68px; left: 90px; background: #000; background: rgba(0,0,0,0.2); z-index: 3;

    -webkit-transition: all .3s ease-out 0s;

    -moz-transition: all .3s ease-out 0s;

    -ms-transition: all .3s ease-out 0s;

    -o-transition: all .3s ease-out 0s;

    transition: all .3s ease-out 0s;

    border-radius: 50%;

    -moz-border-radius: 50%;

    -webkit-border-radius: 50%;

}

#obtn .slide_banner .slick-next{left: auto; right: 90px;}

#obtn .slide_banner .slick-prev:after,

#obtn .slide_banner .slick-next:after{position: absolute; content: ''; width:68px; height: 68px; background: url("../images//prev.png") no-repeat; background-size: cover; left: 0; top:0; z-index: 3; }

#obtn .slide_banner .slick-next:after{background:url("../images//next.png") no-repeat; background-size: cover;}

#obtn .slide_banner .slick-prev:hover,

#obtn .slide_banner .slick-next:hover{background:#000;background: rgba(0,0,0,0.5);}

@media screen and (max-width:991px){

    #obtn .slide_banner .slick-dots{height: 21px; bottom:20px;}

    #obtn .slide_banner .slick-dots li{margin: 0 5px; width: 21px; height: 21px;padding: 6px;}

    #obtn .slide_banner .slick-dots li button:after{width: 21px; height: 21px;}

}

@media screen and (max-width:767px){

    #obtn .slide_banner .slick-prev,

    #obtn .slide_banner .slick-next{width:45px; height:45px; left: 15px;}

    #obtn .slide_banner .slick-next{left: auto; right:15px;}

    #obtn .slide_banner .slick-prev:after,

    #obtn .slide_banner .slick-next:after{position: absolute; content: ''; width:45px; height:45px; background: url("../images//prev.png") no-repeat; background-size: cover; left: 0; top:0; z-index: 3; }

    #obtn .slide_banner .slick-next:after{background:url("../images//next.png") no-repeat; background-size: cover;}

}



#obtn .homeAboutBox{float: left; width: 100%; padding:123px 2.35% 59px 2.35%; position: relative;}

#obtn .homeAboutBox:after{position: absolute;content: ''; width: 1px; height: 45px; top: -45px; left: 50%; /*background:#fff;opacity: 0.5;filter:alpha(opacity=50);*/}

#obtn .homeAboutBox:before{position: absolute;content: ''; width: 1px; height: 45px; top:0; left: 50%; /*background:#005ca1;*/}

#obtn .homeTit{float: left; width: 100%; line-height: 80px;color:#333333; font-size: 48px; font-weight: bold; font-family: Arial; text-transform: uppercase; text-align: center; padding-bottom: 19px; position: relative;}

#obtn .homeTit:after{position: absolute; content:''; width: 65px;height: 1px; /*background: #1d79be;*/ left: 50%;margin-left: -32.5px; bottom: 0;}

@media screen and (max-width:1569px) {

    #obtn .homeAboutBox{padding:80px 0 40px 0;}

    #obtn .homeAboutBox:after{ height: 35px; top: -35px; }

    #obtn .homeAboutBox:before{ height: 35px;}

}

@media screen and (max-width:1229px) {

    #obtn .homeAboutBox{padding:70px 0 35px 0;}

    #obtn .homeAboutBox:after{ height: 30px; top: -30px; }

    #obtn .homeAboutBox:before{ height: 30px;}

    #obtn .homeTit{font-size:42px; line-height: 60px;padding-bottom: 10px;}

}

@media screen and (max-width:991px) {

    #obtn .homeAboutBox{padding:60px 0 28px 0;}

    #obtn .homeAboutBox:after,

    #obtn .homeAboutBox:before{display: none;}

    #obtn .homeTit{font-size:38px; line-height: 50px;}

}

@media screen and (max-width:767px) {

    #obtn .homeAboutBox{padding:35px 0 20px 0;}

    #obtn .homeTit{font-size:30px; line-height: 40px;}

}



#obtn .homeAboutLeft{float: left; width: 66.666%; background: #f6f6f6; margin-top: 60px;}

#obtn .homeAboutLeft .text{float: left; width: 50%; padding: 50px 60px 60px 60px; height: 400px;}

#obtn .homeAboutLeft .text .p1{float: left; width: 100%; color:#333333; font-size: 18px; font-family: Arial; line-height: 36px;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp:6;

    overflow: hidden;

}

#obtn .homeAboutLeft .text .more{float: left; width: 100%; margin-top: 30px;}

#obtn .homeAboutLeft .text .more a{float: left; width: 140px; height: 40px; border:1px solid #dedede; font-family: Arial; text-transform: uppercase; color:#888888; font-size: 16px; text-align: center; line-height:40px;}

#obtn .homeAboutLeft .text .more a:hover{border:1px solid #005ca1; background: #005ca1; color:#fff;}

#obtn .homeAboutLeft .video{float: left; width: 50%;position: relative}

#obtn .homeAboutLeft .video video{float: left; width: 100%; height: 400px; cursor: pointer;object-fit:fill}

#obtn .homeAboutLeft .hValueButton{position: absolute; width:100%; height:100%; background:#000; background: rgba(0,0,0,0.2);}

#obtn .homeAboutLeft .hValueButton span{position: absolute; width: 86px; height: 86px; left: 50%; margin-left: -43px; top:50%; margin-top: -43px;}

#obtn .homeAboutRight{float: right; width: 31.2%; border:3px solid #e8e8e8; margin-top: 60px; height: 400px; padding: 45px 59px 22px 59px; position: relative}

#obtn .homeAboutRight:after{position: absolute; content: ''; width: 1px; height: 100%; border-left: 1px dotted #d9d9d9; top:0; left:131px;}

#obtn .homeAboutRight dl{float: left; width: 100%; margin-top: 5px;}

#obtn .homeAboutRight dd{float: left; width: 100%; padding-left: 105px; position: relative;}

#obtn .homeAboutRight dd:after{position: absolute; content: ''; width: 11px; height: 11px; background: #d9d9d9; left:67px; top:11px;

    border-radius: 10px;

    -moz-border-radius: 10px;

    -webkit-border-radius: 10px;

}

#obtn .homeAboutRight dd span{position: absolute; left: 0; width: 40px; height: 40px; top:-5px;}

#obtn .homeAboutRight dd em{float: left; width: 100%; color:#333333; font-size: 18px; line-height: 30px; height: 60px; overflow: hidden;}



@media screen and (max-width:1569px) {

    #obtn .homeAboutLeft{margin-top:45px;}

    #obtn .homeAboutLeft .text{padding: 30px 35px 40px 35px; height: 310px;}

    #obtn .homeAboutLeft .text .p1{font-size: 16px; line-height: 30px;}

    #obtn .homeAboutLeft .text .more{margin-top: 20px;}

    #obtn .homeAboutLeft .text .more a{font-size: 14px;}

    #obtn .homeAboutLeft .video video{height: 310px;}

    #obtn .homeAboutLeft .hValueButton span{width: 60px; height: 60px; margin-left: -30px; margin-top: -30px;}

    #obtn .homeAboutRight{margin-top: 45px;padding:20px 25px 20px 25px; height: 310px;}

    #obtn .homeAboutRight:after{left:70px;}

    #obtn .homeAboutRight dd{padding-left: 70px;}

    #obtn .homeAboutRight dd span{width: 30px; height: 30px; top:0;}

    #obtn .homeAboutRight dd:after{left:41px; width: 9px; height: 9px; top:8px;}

    #obtn .homeAboutRight dd em{font-size: 16px; line-height: 26px; height:52px;}

}

@media screen and (max-width:1229px) {

    #obtn .homeAboutLeft{width: 100%; margin-top: 40px;}

    #obtn .homeAboutRight{width: 100%; margin-top: 20px;height: auto;}

    #obtn .homeAboutRight dl{width: 50%;}

    #obtn .homeAboutRight:before{position: absolute;content: '';width: 1px;height: 100%;border-left: 1px dotted #d9d9d9;top: 0;right:432px;}

}

@media screen and (max-width:991px) {

    #obtn .homeAboutRight:before{right:320px;}

}

@media screen and (max-width:767px) {

    #obtn .homeAboutLeft{margin-top:25px;}

    #obtn .homeAboutLeft .text{width: 100%;padding: 20px 20px 25px 20px; height: auto;}

    #obtn .homeAboutLeft .text .p1{font-size: 14px; line-height: 26px;}

    #obtn .homeAboutLeft .video{width: 100%;}

    #obtn .homeAboutLeft .video video{height: auto;}

    #obtn .homeAboutRight:before{display: none;}

    #obtn .homeAboutRight dl{width: 100%;}

    #obtn .homeAboutRight dd em{font-size: 14px;}

}



#obtn .homeProductBox{float: left; width: 100%; padding:59px 2.35% 120px 2.35%;

    background: #f1f3f4;

    background: -moz-linear-gradient(top, #fff 0%, #f1f3f4 100%) ;

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#f1f3f4))  ;

    background: -webkit-linear-gradient(top, #fff 0%,#f1f3f4 100%) ;

    background: -o-linear-gradient(top, #fff 0%,#f1f3f4 100%) ;

    background: -ms-linear-gradient(top, #fff 0%,#f1f3f4 100%) ;

}

#obtn .homeProDisList{float: left; width: 100%; margin-top: 60px;}

#obtn .homeProDisList ul{margin: 0 -1.5625%;}

#obtn .homeProDisList li{float: left; width: 33.3333%; padding: 0 1.5625%;}

#obtn .homeProDisList li a{float: left; width: 100%; line-height: 0; background: #fff;position: relative;

    box-shadow: 0 0 5px rgba(0,0,0,0.03);

    -moz-box-shadow: 0 0 5px rgba(0,0,0,0.03);

    -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.03);

}

#obtn .homeProDisList li a .img{float: left; width: 100%; line-height: 0; overflow: hidden;}

#obtn .homeProDisList li a .img img{

    -webkit-transition: all .3s ease-out 0s;

    -moz-transition: all .3s ease-out 0s;

    -ms-transition: all .3s ease-out 0s;

    -o-transition: all .3s ease-out 0s;

    transition: all .3s ease-out 0s;

}

#obtn .homeProDisList li a .text{float: left; position: absolute; width: 100%; text-align: center; color:#333333; font-size: 20px; line-height: 50px; padding: 0 10px; left: 0; bottom: 30px;

    overflow: hidden;

    text-overflow:ellipsis;

    white-space: nowrap;

    -webkit-transition: all .3s ease-out 0s;

    -moz-transition: all .3s ease-out 0s;

    -ms-transition: all .3s ease-out 0s;

    -o-transition: all .3s ease-out 0s;

    transition: all .3s ease-out 0s;

}

#obtn .homeProDisList li a:hover{

    box-shadow: 0 0 25px rgba(0,0,0,0.06);

    -moz-box-shadow: 0 0 25px rgba(0,0,0,0.06);

    -webkit-box-shadow: 0 0 25px rgba(0,0,0,0.06);

}

#obtn .homeProDisList li a:hover .text{color:#0068b7}

#obtn .homeProDisList li a:hover .img img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

@media screen and (max-width:1569px) {

    #obtn .homeProductBox{padding: 40px 0 90px 0}

    #obtn .homeProDisList{margin-top: 45px;}

    #obtn .homeProDisList li a .text{font-size: 18px; bottom: 20px;}

}

@media screen and (max-width:1229px) {

    #obtn .homeProductBox{padding: 35px 0 70px 0}

    #obtn .homeProDisList{margin-top: 40px;}

    #obtn .homeProDisList li a .text{font-size: 16px; bottom: 15px;}

}

@media screen and (max-width:991px) {

    #obtn .homeProductBox{padding:28px 0 60px 0}

    #obtn .homeProDisList li a .text{bottom: 10px;}

}

@media screen and (max-width:767px) {

    #obtn .homeProductBox{padding:20px 0 40px 0}

    #obtn .homeProDisList{margin-top: 15px;}

    #obtn .homeProDisList li{width: 100%; margin-top: 15px;}



}



#obtn .homeNewsBox{float: left; width: 100%; margin: 100px 0;}

#obtn .homeNewsList{float: left; width: 100%; padding: 0 15px; margin-top:40px;}

#obtn .homeNewsList ul{float: left; width: 100%;}

#obtn .homeNewsList li{float: left; width: 33.333%;}

#obtn .homeNewsList li a{float: left; width: 100%; background: #fff; padding: 30px 30px 0 30px;}

#obtn .homeNewsList li a:hover{ position: relative; z-index: 2;

    box-shadow: 0 0 25px rgba(0,0,0,0.06);

    -moz-box-shadow: 0 0 25px rgba(0,0,0,0.06);

    -webkit-box-shadow: 0 0 25px rgba(0,0,0,0.06);

}

#obtn .homeNewsList li a .tImg{float:left; width:100%; line-height: 0; overflow: hidden;}

#obtn .homeNewsList li a .tImg img{

    -webkit-transition: all .3s ease-out 0s;

    -moz-transition: all .3s ease-out 0s;

    -ms-transition: all .3s ease-out 0s;

    -o-transition: all .3s ease-out 0s;

    transition: all .3s ease-out 0s;

}

#obtn .homeNewsList li a .text{float: left; width: 100%; color:#333333; font-size: 20px; line-height: 28px; height: 84px; font-family: Arial; margin-top: 25px;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 3;

    overflow: hidden;

}

#obtn .homeNewsList li a .dMore{float: left; width: 100%; margin-top: 35px; padding-bottom: 32px; border-bottom: 1px solid #e8e8e8;

    -webkit-transition: all .3s ease-out 0s;

    -moz-transition: all .3s ease-out 0s;

    -ms-transition: all .3s ease-out 0s;

    -o-transition: all .3s ease-out 0s;

    transition: all .3s ease-out 0s;

}

#obtn .homeNewsList li a .dMore .left{float: left; color:#888888; font-size: 16px; line-height: 40px; font-weight: bold;

    -webkit-transition: all .3s ease-out 0s;

    -moz-transition: all .3s ease-out 0s;

    -ms-transition: all .3s ease-out 0s;

    -o-transition: all .3s ease-out 0s;

    transition: all .3s ease-out 0s;

}

#obtn .homeNewsList li a .dMore .time{float: right; color:#888888; font-size: 16px; line-height: 40px; font-weight: bold;}

#obtn .homeNewsList li a .dMore .time span{font-size: 30px;color:#333333;}

#obtn .homeNewsList li a:hover .tImg img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

#obtn .homeNewsList li a:hover .dMore{border-bottom: 0;}

#obtn .homeNewsList li a:hover .dMore .left{color:#005ca1}

@media screen and (max-width:1569px) {

    #obtn .homeNewsBox{ margin: 80px 0;}

    #obtn .homeNewsList{ padding:0; margin-top:40px;}

    #obtn .homeNewsList li a{ padding: 20px 20px 0 20px;}

    #obtn .homeNewsList li a .text{font-size: 18px;}

    #obtn .homeNewsList li a .dMore{margin-top:25px; padding-bottom: 22px;}

}

@media screen and (max-width:1229px) {

    #obtn .homeNewsBox{ margin: 60px 0;}

    #obtn .homeNewsList{ padding:0; margin-top:30px;}

    #obtn .homeNewsList li a{ padding: 15px 15px 0 15px;}

    #obtn .homeNewsList li a .text{margin-top:15px; font-size: 16px;}

    #obtn .homeNewsList li a .dMore{margin-top:20px; padding-bottom:15px;}

    #obtn .homeNewsList li a .dMore .left{font-size: 15px; line-height: 35px;}

    #obtn .homeNewsList li a .dMore .time{font-size: 15px; line-height: 35px;}

    #obtn .homeNewsList li a .dMore .time span{font-size: 24px;}

}

@media screen and (max-width:767px) {

    #obtn .homeNewsBox{margin:40px 0;}

    #obtn .homeNewsList{margin-top: 15px;}

    #obtn .homeNewsList li{margin-top: 15px; width: 100%;}

    #obtn .homeNewsList li a{ padding: 12px 12px 0 12px;

        box-shadow: 0 0 15px rgba(0,0,0,0.06);

        -moz-box-shadow: 0 0 15px rgba(0,0,0,0.06);

        -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.06);

    }

    #obtn .homeNewsList li a .text{margin-top:10px; font-size: 15px;}

    #obtn .homeNewsList li a .dMore{border-bottom: 0;}

}

#obtn .homeNewsList .newsMore{float: left; width: 100%; display: block; text-align: center; margin-top: 60px;}

#obtn .homeNewsList .newsMore a{display: inline-block; width: 56px; height: 56px;

    background: #e1e1e1; border-radius: 50px;-moz-border-radius: 50px;-webkit-border-radius: 50px;position: relative;

}

#obtn .homeNewsList .newsMore a:hover{background: #005ca1;}

#obtn .homeNewsList .newsMore a:after{position: absolute; content:''; width: 24px; height: 2px; background: #fff; left: 50%; margin-left: -12px; top:50%; margin-top: -1px;}

#obtn .homeNewsList .newsMore a:before{position: absolute; content:''; width: 2px; height: 24px; background: #fff;left: 50%; margin-left: -1px; top:50%; margin-top: -12px;}

@media screen and (max-width:1229px) {

    #obtn .homeNewsList .newsMore{margin-top: 40px;}

    #obtn .homeNewsList .newsMore a{width: 50px; height: 50px;}

}

@media screen and (max-width:767px) {

    #obtn .homeNewsList .newsMore{margin-top: 30px;}

}



#obtn .downBox{float:left; width: 100%;

    background: #22272b;

    background:-webkit-linear-gradient(left,#22272b,#1e2328);

    background:-o-linear-gradient(right,#22272b,#1e2328);

    background:-moz-linear-gradient(right,#22272b,#1e2328);

    background:linear-gradient(to right,#22272b,#1e2328);

}

#obtn .downBox .footNav{float: left; width: 100%; margin:70px 0 53px 0;}

#obtn .downBox .footNav .ul1{float: left; width: 20%;}

#obtn .downBox .footNav .footTit{float:left; width:100%; color:#ffffff; font-size:20px; line-height:32px;font-weight: bold; font-family: Arial;}

#obtn .downBox .footNav .box{ float:left; width:100%; margin-top:17px;}

#obtn .downBox .footNav .box li{ float:left; width:100%;}

#obtn .downBox .footNav .box li a{ float:left; width:100%; color:#fff; color:rgba(255,255,255,0.5); font-size:16px; line-height:32px;font-family: Arial;}

#obtn .downBox .footNav .box li a:hover{ color:#fff;}

/*20201203start*/

#obtn .downBox .footContact .title{width: 100%;font-size: 0;margin-bottom: 15px;}

#obtn .downBox .footContact .title .icon{width: 18px;height: 18px;display: inline-block;vertical-align: middle;}

#obtn .downBox .footContact .title .words{font-size: 16px;color: #ffffff;display: inline-block;vertical-align: middle;margin-left: 6px;}

#obtn .downBox .footContact .phone{font-size: 26px;color: #ffffff;font-weight: bold;margin-bottom: 22px;}

#obtn .downBox .footContact .ewmbox{width: 100%;font-size: 0;}

#obtn .downBox .footContact .ewmbox .ewms{width: 117px;height: 117px;padding: 4px;display: inline-block;vertical-align: bottom;background-color: #fff;margin-right: 12px;}

#obtn .downBox .footContact .ewmbox .ewm{width: 100%;height: 100%;}

#obtn .downBox .footContact .ewmbox .words{font-size: 14px;color: #ffffff;display: inline-block;vertical-align: middle;}

/*20201203end*/

@media screen and (max-width:1569px) {

    #obtn .downBox .footNav .ul1{float: left; width: 18%;}

    #obtn .downBox .ul1.footContact{width: 28%;}

    #obtn .downBox .footNav .footTit{font-size: 18px;}

}

@media screen and (max-width:1229px) {

    #obtn .downBox .footNav{margin:50px 0 45px 0;}

    #obtn .downBox .footNav .footTit{font-size: 16px; line-height: 30px;}

    #obtn .downBox .footNav .box{margin-top: 10px;}

    #obtn .downBox .footNav .box li a{font-size: 14px; line-height: 30px;}

    #obtn .downBox .footContact .box p{font-size: 14px; line-height: 30px;}

}

@media screen and (max-width:991px) {

    #obtn .downBox .footNav{margin:35px 0 30px 0}

    #obtn .downBox .footNav .ul1{display: none;}

    #obtn .downBox .ul1.footContact{display: block; width:100%;}

    /*20201203start*/

    #obtn .downBox .footContact .title{text-align: center;margin-bottom: 8px;}

    #obtn .downBox .footContact .title .icon{width: 16px;height: 16px;}

    #obtn .downBox .footContact .title .words{font-size: 14px;margin-left: 4px;}

    #obtn .downBox .footContact .phone{font-size: 20px;margin-bottom: 12px;text-align: center;}

    #obtn .downBox .footContact .ewmbox .ewms{width: 100px;height: 100px;margin-right: 6px;display: block;margin: 0 auto;}

    #obtn .downBox .footContact .ewmbox .words{font-size: 12px;display: block;text-align: center;margin-top: 8px;}

    /*20201203end*/

}



#obtn .copyright{float: left; width: 100%;background: #191d20; line-height: 26px; padding: 12px 0; text-align: center; color:#ffffff; color:rgba(255,255,255,0.5); font-size: 14px; font-family: Arial; text-align: center;}



@media screen and (max-width:767px){

    #obtn .downBox{margin-bottom: 50px;}

    #obtn .copyright{font-size: 12px;}

}



/*1about*/

#obtn .iBanner{float: left; width: 100%; line-height: 0; position: relative}

#obtn .iBanner .currentBox{position: absolute;width: 100%; left: 0; bottom: 110px;}

#obtn .iBanner .currentBox .tit{float: left; width: 100%; color:#fff; font-size: 90px; font-weight: bold; font-family: Arial; line-height: 80px;}

#obtn .iBanner .currentBox .text{float: left; width: 100%; color:#fff; font-size: 36px;line-height: 40px; margin-top: 14px; font-family: Arial; font-weight: bold;}

@media screen and (max-width:1569px) {

    #obtn .iBanner .currentBox{bottom:90px;}

    #obtn .iBanner .currentBox .tit{ font-size: 70px;line-height: 60px;}

    #obtn .iBanner .currentBox .text{font-size: 28px;line-height: 36px;}

}

@media screen and (max-width:991px) {

    #obtn .iBanner .currentBox{bottom:40px;}

    #obtn .iBanner .currentBox .tit{ font-size:50px;line-height: 40px;}

    #obtn .iBanner .currentBox .text{font-size: 20px;line-height: 30px; margin-top: 10px;}

}

@media screen and (max-width:767px) {

    #obtn .iBanner .currentBox{bottom:20px;}

    #obtn .iBanner .currentBox .tit{ font-size:20px;line-height: 24px;}

    #obtn .iBanner .currentBox .text{font-size: 14px;line-height: 20px; margin-top: 10px;}

}



/*浜岀骇�?�艰�?*/

/*宸﹁�?*/

#obtn .slideBox{float: left; width: 100%; background: #f4f4f5}

#obtn .slideBox .pz_SideLayer{ float:left;}

#obtn .slideBox .pz_SideLayer .l1{ float:left; margin-right: 100px; position: relative}

#obtn .slideBox .pz_SideLayer .l1:after{position: absolute; content: ''; width: 1px; height: 22px; background: #dbdbdb; right: -50px; top:50%; margin-top: -11px;}

#obtn .slideBox .pz_SideLayer .l1:last-child:after{width: 0;}

#obtn .slideBox .pz_SideLayer .l1:last-child{margin-right: 0;}

#obtn .slideBox .pz_SideLayer .l1 a{ float:left; height:85px; line-height:85px; color:#333333; font-size:22px; padding:0 2px; position:relative; font-family: Arial;}

#obtn .slideBox .pz_SideLayer .l1 a:after{ float:left; width:0; height:4px; content:''; position:absolute; left:50%; bottom:-1px; background:#0068b7;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

    -webkit-transform:translateX(-50%);

    -ms-transform:translateX(-50%);

    transform:translateX(-50%);

    -moz-transform:translateX(-50%);

    -o-transform:translateX(-50%);}

#obtn .slideBox .pz_SideLayer .l1.on a,

#obtn .slideBox .pz_SideLayer .l1:hover a{ color:#0068b7;}

#obtn .slideBox .pz_SideLayer .l1.on a:after,

#obtn .slideBox .pz_SideLayer .l1:hover a:after{ width:100%;}

@media  screen and (max-width:1700px){

    #obtn .slideBox .pz_SideLayer .l1 a{font-size: 18px;}

}

@media  screen and (max-width:1569px){

    #obtn .slideBox .pz_SideLayer .l1{margin-right: 60px;}

    #obtn .slideBox .pz_SideLayer .l1:last-child{margin-right: 0;}

    #obtn .slideBox .pz_SideLayer .l1:after{right: -30px;}

    #obtn .slideBox .pz_SideLayer .l1 a{font-size: 16px;height:70px;line-height:70px;}

    #obtn .slideBox .pz_SideLayer .l1 a:after{height: 3px;}

}

@media  screen and (max-width:1230px){

    #obtn .slideBox .pz_SideLayer .l1 a{font-size:14px;height:60px;line-height:60px;}



}

@media  screen and (max-width:991px){

    #obtn .slideBox .pz_SideLayer .l1{margin-right: 40px;}

    #obtn .slideBox .pz_SideLayer .l1:after{right: -20px;}

    #obtn .slideBox .pz_SideLayer .l1 a{ height:50px; line-height:50px; }



}

@media  screen and (max-width:767px){

    #obtn .slideBox{white-space:nowrap; height:46px;}

    #obtn .slideBox .maxWidth{ overflow-x:scroll; white-space:nowrap;}

    #obtn .slideBox .pz_SideLayer{ overflow-x:scroll; white-space:nowrap;}

    #obtn .slideBox .pz_SideLayer .l1{ float:none; display:inline-block; white-space:nowrap;}

    #obtn .slideBox .pz_SideLayer .l1:last-child{margin-right: 15px;}

}



#obtn .pageAboutInfo{float: left; width: 100%; margin: 80px 0 140px 0;}

#obtn .pageAboutInfo .leftText{float: left; width: 49%; color:#333333; font-size: 20px; line-height: 40px; font-family: Arial;}

#obtn .pageAboutInfo .leftText .aboutTit{float: left; color:#333333; font-size:36px; line-height: 40px; font-family: Arial; font-weight: bold; margin-top: 28px;}

#obtn .pageAboutInfo .leftText .p1{float: left; width: 100%; margin-top: 49px;}

#obtn .pageAboutInfo .rightVideo{float: right; width: 40%; position: relative}

#obtn .pageAboutInfo .rightVideo video{float: left; width: 100%; height: 410px;object-fit:fill}

#obtn .pageAboutInfo .rightVideo .hValueButton{position: absolute; width: 100%; height: 100%; left: 0; top:0; background: #000; background:rgba(0,0,0,0.2);}

#obtn .pageAboutInfo .rightVideo .hValueButton span{position: absolute; width: 86px; height: 86px;left: 50%; margin-left: -43px; top:50%; margin-top: -43px;}

@media screen and (max-width:1569px) {

    #obtn .pageAboutInfo{ margin: 120px 0 110px 0;}

    #obtn .pageAboutInfo .leftText{ font-size:17px; line-height:32px;}

    #obtn .pageAboutInfo .leftText .aboutTit{font-size:30px; line-height: 40px; margin-top: 10px;}

    #obtn .pageAboutInfo .leftText .p1{ margin-top: 40px;}

    #obtn .pageAboutInfo .rightVideo .hValueButton span{width: 60px; height: 60px; margin-left: -30px; margin-top: -30px;}

}

@media screen and (max-width:1229px) {

    #obtn .pageAboutInfo{ margin: 90px 0 80px 0;}

    #obtn .pageAboutInfo .leftText{width: 52%; font-size: 16px; line-height: 28px;}

    #obtn .pageAboutInfo .leftText .p1{margin-top: 30px;}

}

@media screen and (max-width:991px) {

    #obtn .pageAboutInfo{ margin: 50px 0 60px 0;}

    #obtn .pageAboutInfo .leftText{width: 100%;}

    #obtn .pageAboutInfo .rightVideo{width: 100%; margin-top: 20px;}

    #obtn .pageAboutInfo .leftText .aboutTit{font-size: 24px; line-height: 30px; margin-top: 0;}

    #obtn .pageAboutInfo .leftText .p1{font-size: 15px; line-height: 24px; margin-top: 20px;}

    #obtn .pageAboutInfo .rightVideo video{float: left; width:100%; height: auto;}

}

@media screen and (max-width:767px) {

    #obtn .pageAboutInfo{ margin:40px 0;}

}



#obtn .pageGreyBg{float: left; width: 100%; background: #f4f4f5;}

#obtn .pageAboutMap{float: left; width: 100%; margin: 80px 0 120px 0;}

#obtn .pageAboutMap .topText{float: left; width: 100%; color:#333333; font-size: 20px; line-height: 40px; font-family: Arial;}

#obtn .pageAboutMap .downImg{float: left; width: 100%; margin-top: 45px; line-height: 0;}

@media screen and (max-width:1569px) {

    #obtn .pageAboutMap{ margin: 110px 0 100px 0;}

    #obtn .pageAboutMap .topText{font-size: 17px; line-height:32px;}

}

@media screen and (max-width:1229px) {

    #obtn .pageAboutMap{ margin: 80px 0 70px 0;}

    #obtn .pageAboutMap .topText{font-size: 16px; line-height:28px;}

}

@media screen and (max-width:991px) {

    #obtn .pageAboutMap{ margin: 60px 0;}

    #obtn .pageAboutMap .topText{font-size: 15px; line-height:24px;}

    #obtn .pageAboutMap .downImg{margin-top: 35px;}

}

@media screen and (max-width:767px) {

    #obtn .pageAboutMap{ margin:40px 0;}

    #obtn .pageAboutMap .downImg{margin-top: 25px;}

}

#obtn .pageAboutWords{float: left; width: 100%; margin: 140px 0;}

#obtn .pageAboutWords .pageNumBox{float: left; width:49%; background: #0068b7; height: 402px; position: relative}

#obtn .pageAboutWords .pageNumBox:after{position: absolute; content: ''; width: 100%; height: 100%; background: #0068b7; left: -50%;}

#obtn .pageAboutWords .pageNumBox ul{float: left; width: 100%; margin-top: 120px; position: relative; z-index: 3;}

#obtn .pageAboutWords .pageNumBox li{float: left; margin-right: 70px; padding-bottom: 20px; border-bottom: 1px solid #fff; border-bottom: 1px solid rgba(255,255,255,0.3);}

#obtn .pageAboutWords .pageNumBox li:last-child{margin-right: 0;}

#obtn .pageAboutWords .pageNumBox li span{display: block; font-size: 68px; color:#ffffff; font-family: Arial; line-height: 60px;}

#obtn .pageAboutWords .pageNumBox li span i{ display:inline-block;font-size: 24px; line-height: 30px;}

#obtn .pageAboutWords .pageNumBox li em{display: block; font-size: 18px;line-height: 32px; margin-top: 11px; font-family: Arial; color:#fff; height: 64px;}

#obtn .pageAboutWords .pageTextInfo{float:right; width: 45.5%; display:table; height:402px;}

#obtn .pageAboutWords .pageTextInfo .table{display: table-cell;vertical-align: middle; color:#333333; font-size: 20px; line-height: 40px;}





@media screen and (max-width:1569px) {

    #obtn .pageAboutWords{margin: 110px 0;}

    #obtn .pageAboutWords .pageNumBox li{margin-right: 50px; padding-bottom:15px;}

    #obtn .pageAboutWords .pageNumBox li span{font-size: 58px; line-height: 50px;}

    #obtn .pageAboutWords .pageNumBox li em{font-size: 16px; line-height: 28px; height: 56px;}

    #obtn .pageAboutWords .pageTextInfo .table{font-size:17px; line-height:32px;}

}

@media screen and (max-width:1229px) {

    #obtn .pageAboutWords{margin: 80px 0;}

    #obtn .pageAboutWords .pageNumBox{ height:350px; }

    #obtn .pageAboutWords .pageNumBox ul{margin-top: 90px;}

    #obtn .pageAboutWords .pageNumBox li{margin-right: 30px;}

    #obtn .pageAboutWords .pageTextInfo{height: 350px;}

    #obtn .pageAboutWords .pageTextInfo .table{font-size: 16px; line-height: 28px;}

}

@media screen and (max-width:991px) {

    #obtn .pageAboutWords{margin: 60px 0;}

    #obtn .pageAboutWords .pageNumBox{ height:240px; width: 100%;}

    #obtn .pageAboutWords .pageNumBox ul{margin-top: 50px;}

    #obtn .pageAboutWords .pageNumBox li{margin-right:13%;}

    #obtn .pageAboutWords .pageTextInfo{height: auto; width: 100%; margin-top: 30px;}

    #obtn .pageAboutWords .pageTextInfo .table{font-size: 15px; line-height: 24px;}

}

@media screen and (max-width:767px) {

    #obtn .pageAboutWords{margin:40px 0;}

    #obtn .pageAboutWords .pageNumBox{height: 200px;}

    #obtn .pageAboutWords .pageNumBox ul{margin-top: 40px;}

    #obtn .pageAboutWords .pageNumBox li{margin-right: 3%;}

    #obtn .pageAboutWords .pageNumBox li span{font-size: 42px; line-height: 35px;}

    #obtn .pageAboutWords .pageNumBox li span i{font-size: 18px; line-height: 20px;}

    #obtn .pageAboutWords .pageNumBox li em{font-size: 14px; line-height: 24px;}

    #obtn .pageAboutWords .pageTextInfo{margin-top: 20px;}

}

@media screen and (max-width:415px) {

    #obtn .pageAboutWords .pageNumBox li{width: 30%;}

    #obtn .pageAboutWords .pageNumBox li em{word-break:break-all;

        word-wrap:break-word;}

}

/*2Honors & Certificates*/

#obtn .HonorsBox{float: left; width: 100%; background: #f4f4f5; position: relative}

#obtn .HonorsBg{position: absolute;left: 0; top:0; width: 100%; height:100%;}

#obtn .threeLevelNav{float: left; width: 100%; position: relative; z-index: 2; margin-top: 80px; background: #fff;}

#obtn .threeLevelNav ul{display: block; width: 100%; text-align: center}

#obtn .threeLevelNav li{display: inline-block; margin: 0 45px; line-height: 60px;}

#obtn .threeLevelNav li a{float: left; color:#333333; font-size: 22px;}

#obtn .threeLevelNav li a.on,

#obtn .threeLevelNav li a:hover{color:#0068b7}

@media screen and (max-width:1569px) {

    #obtn .threeLevelNav ul{height:50px;}

    #obtn .threeLevelNav li{ margin: 0 35px; line-height: 50px;}

    #obtn .threeLevelNav li a{font-size: 18px;}

}

@media screen and (max-width:1229px) {

    #obtn .threeLevelNav{margin-top:45px;}

    #obtn .threeLevelNav ul{height: 48px;}

    #obtn .threeLevelNav li{ margin: 0 25px; line-height:48px;}

    #obtn .threeLevelNav li a{font-size: 16px;}

}

@media screen and (max-width:991px) {

    #obtn .threeLevelNav{margin-top: 35px;}

    #obtn .threeLevelNav li a{font-size: 16px;}

}

@media screen and (max-width:767px) {

    #obtn .threeLevelNav{margin-top:30px;}

    #obtn .threeLevelNav ul{height: 45px;}

    #obtn .threeLevelNav li{ margin: 0 15px; line-height:45px;}

    #obtn .threeLevelNav li a{font-size: 14px;}

}



#obtn .aboutHonorsList{float: left; width: 100%; margin-top: -25px; position: relative; z-index: 2;}

#obtn .aboutHonorsList ul{margin: 0 -2.1%;display: -webkit-flex;flex-wrap: wrap;align-items: flex-start;}

#obtn .aboutHonorsList li{float: left; width: 33.333%; padding: 0 2.1%; margin-top: 65px;}

#obtn .aboutHonorsList li a{float: left; width: 100%; background:#fff; padding: 34px 40px 39px 40px;}

#obtn .aboutHonorsList li a .tText{float: left; width: 100%; color:#333333; font-size: 18px; line-height: 28px;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 3;

    overflow: hidden;

}

/*20201229start*/

#obtn .aboutHonorsList li a .dImg{padding-bottom: 63.75%; position: relative; overflow: hidden;}

#obtn .aboutHonorsList li a .dImg img{width: 100%;padding: 50px; position: absolute; left: 50%; top: 50%; min-height: 100%;

-webkit-transform: translate(-50%, -50%); 

-moz-transform: translate(-50%, -50%); 

-ms-transform: translate(-50%, -50%);

-o-transform: translate(-50%, -50%);

transform: translate(-50%, -50%);}

/*20201229end*/

@media screen and (max-width:1569px) {

    #obtn .aboutHonorsList{ margin-top: -10px;}

    #obtn .aboutHonorsList ul{margin: 0 -20px;}

    #obtn .aboutHonorsList li{padding: 0 20px; margin-top:40px;}

    #obtn .aboutHonorsList li a{padding: 25px 25px 30px 25px}

    #obtn .aboutHonorsList li a .tText{font-size: 16px; line-height: 26px;}

    #obtn .aboutHonorsList li a .dImg{margin-top: 20px;}

}

@media screen and (max-width:1229px) {

    #obtn .aboutHonorsList{ margin-top: 0;}

    #obtn .aboutHonorsList ul{margin: 0 -15px;}

    #obtn .aboutHonorsList li{padding: 0 15px; margin-top:30px;}

    #obtn .aboutHonorsList li a{padding: 20px 20px 25px 20px}

    #obtn .aboutHonorsList li a .tText{font-size: 14px;}

}

@media screen and (max-width:991px) {

    #obtn .aboutHonorsList ul{margin: 0 -10px;}

    #obtn .aboutHonorsList li{padding: 0 10px; margin-top:20px;}

    #obtn .aboutHonorsList li a{padding: 15px 15px 20px 15px}

    #obtn .aboutHonorsList li a .dImg{margin-top: 15px;}

}

@media screen and (max-width:767px) {

    #obtn .aboutHonorsList li{width: 100%;}

}



/* 鍒嗛�? */

#obtn .wack1{ float:left; width:100%; padding:80px 0; text-align:center; position: relative; z-index: 2;}

#obtn .wack1 .pz_fy{ display:inline-block; *display:inline; *zoom:1;}

#obtn .wack1 .pz_fy a { float:left; width:64px; height:33px; line-height:33px;  border: #cccccc 1px solid; color:#b3b3b3; font-size:18px; font-family:Arial; margin:0 15px;

    border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;

}

#obtn .wack1 .pz_fy a:hover,

#obtn .wack1 .pz_fy a.on{color:#fff; border:#0068b7 1px solid; background:#0068b7;}

#obtn .wack1 .pz_fy .l_fy,

#obtn .wack1 .pz_fy .r_fy{ width:106px;}

@media screen and (max-width:1569px) {

    #obtn .wack1{ padding:60px 0;}

    #obtn .wack1 .pz_fy a { width:60px;font-size:16px; margin:0 10px;}

}

@media screen and (max-width:1229px) {

    #obtn .wack1 .pz_fy a { width:50px;font-size:16px; margin:0 5px;}

}

@media  screen and (max-width:991px){

    #obtn .wack1{padding:30px 0 40px 0;}

    #obtn .wack1 .fy_pc{ text-align:center; font-size:14px; color:#272727; padding:5px 0;}

    #obtn .wack1 .fy_pc a{ padding:5px 25px; color:#fff; font-family: Arial; border:solid 1px #0068b7; background:#0068b7; border-radius:16px; overflow:hidden;}

    #obtn .wack1 .fy_pc span{ padding:5px 20px; color:#272727;}

}



/*3sinee culture*/

#obtn .aboutCultureBox{float: left; width: 100%; position:relative}

#obtn .aboutCultureImg{float: left; width: 100%; line-height: 0; text-align: right; position: relative}

#obtn .aboutCultureImg:after{position: absolute; content:''; width: 60%; left: 0; top:0; height: 100%;

    background: #fff;

    background:-webkit-linear-gradient(left,#fff,#fff,rgba(255,255,255,0));

    background:-o-linear-gradient(right,#fff,#fff,rgba(255,255,255,0));

    background:-moz-linear-gradient(right,#fff,#fff,rgba(255,255,255,0));

    background:linear-gradient(to right,#fff,#fff,rgba(255,255,255,0));

}

#obtn .aboutCultureBox .aboutCultureInfo{position: absolute; width: 100%;left: 0; top:50%; margin-top: -50px;}

#obtn .aboutCultureBox .aboutCultureInfo .titBox{float: left; width: 100%; color:#0068b7; font-size: 42px; line-height:40px; font-weight: 100;}

#obtn .aboutCultureBox .aboutCultureInfo .p1{float: left; width: 100%; color:#333333; font-size: 28px; font-weight: bold; line-height: 35px; margin-top: 25px;}

@media screen and (max-width:1569px) {

    #obtn .aboutCultureBox .aboutCultureInfo{margin-top: -40px;}

    #obtn .aboutCultureBox .aboutCultureInfo .titBox{font-size: 35px; line-height: 30px;}

    #obtn .aboutCultureBox .aboutCultureInfo .p1{font-size: 24px; margin-top: 15px;}

}

@media screen and (max-width:1229px) {

    #obtn .aboutCultureBox .aboutCultureInfo .titBox{font-size: 30px;}

    #obtn .aboutCultureBox .aboutCultureInfo .p1{font-size: 20px}

}

@media screen and (max-width:991px) {

    #obtn .aboutCultureBox .aboutCultureInfo{margin-top: -34px;}

    #obtn .aboutCultureBox .aboutCultureInfo .titBox{font-size: 26px; line-height: 28px;}

    #obtn .aboutCultureBox .aboutCultureInfo .p1{font-size:16px; margin-top: 10px; line-height: 30px;}

}

@media screen and (max-width:767px) {

    #obtn .aboutCultureBox .aboutCultureInfo .p1{font-size: 14px; line-height: 20px;}

}

#obtn .aboutCultureBox.rightBox .aboutCultureImg{text-align: left;}

#obtn .aboutCultureBox.rightBox .aboutCultureImg:after{position: absolute; content:''; width: 60%; left: auto; right: 0; top:0; height: 100%;

    background: #fff;

    background:-webkit-linear-gradient(right,#0068b7,#0068b7,rgba(0,104,183,0));

    background:-o-linear-gradient(left,#0068b7,#0068b7,rgba(0,104,183,0));

    background:-moz-linear-gradient(left,#0068b7,#0068b7,rgba(0,104,183,0));

    background:linear-gradient(to left,#0068b7,#0068b7,rgba(0,104,183,0));

}

#obtn .aboutCultureBox.rightBox .aboutCultureInfo .titBox{text-align: right; color:#fff;}

#obtn .aboutCultureBox.rightBox .aboutCultureInfo .p1{text-align: right;color:#fff;}



/*4sinee history2*/

#obtn .deveHistoryBox{float: left; width: 100%; position: relative; padding: 100px 0 93px 0;

}



#obtn .deveHistoryBox:after{position: absolute; content: ''; width: 2px; height: 100%; background: #f4f4f5; left: 50%; margin-left: -1px; top:0;}

#obtn .deveHistoryBox ul{float: left; width: 100%;max-height:1200px; padding-top: 10px;

    overflow:hidden;

    overflow-y:auto;

    scrollbar-width:thin;}

#obtn .deveHistoryBox ul::-webkit-scrollbar {width:3px}

#obtn .deveHistoryBox ul::-webkit-scrollbar-track {background-color:#e5e5e5;border-radius:3px}

#obtn .deveHistoryBox ul::-webkit-scrollbar-thumb {

    width:3px;

    height:60px;

    background-color:#0068b7;

    border-radius:3px

}

#obtn .deveHistoryBox li{float: left; width: 100%; margin-top: -35px;min-height:157px;}

#obtn .deveHistoryBox li:first-child{margin-top: 0;}

#obtn .deveHistoryBox li .dl{float: left; width: 50%; padding:0 80px 0 267px; position: relative;

}

#obtn .deveHistoryBox li .dl em{position: absolute; z-index: 2; width: 90px; height: 90px; right: -44px; top:-10px; background: #f4f4f5; line-height: 90px; color:#0068b7; font-size: 24px; font-weight: bold; font-family: Arial; text-align: center;

    border-radius: 50%;

    -moz-border-radius: 50%;

    -webkit-border-radius: 50%;

}

#obtn .deveHistoryBox li .dl em:after{position: absolute; content: ''; left: -10px; top:50%; margin-top: -11px;

    width: 0;

    height: 0;

    border-top: 11px solid transparent;

    border-right: 11px solid #f4f4f5;

    border-bottom:11px solid transparent;

}

#obtn .deveHistoryBox li .dl .img{position: absolute; left: 0; top:0; width: 236px; height: 157px; line-height: 0;}

#obtn .deveHistoryBox li .dl dd{float: left; width: 100%; color:#333333; font-size: 20px; line-height:36px;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 4;

    overflow: hidden;

}

#obtn .deveHistoryBox li .dl .moreHis{float: left; width: 100%; margin-top: 20px; padding-left: 14px;}

#obtn .deveHistoryBox li .dl .moreHis a{float: left; line-height: 28px;font-size: 16px; color:#888888; font-weight: bold; border-top:1px solid #0068b7; border-top:1px solid rgba(0,104,183,0.3);}

#obtn .deveHistoryBox li .dl .moreHis a:hover{color:#0068b7; border-top:1px solid #0068b7;}

#obtn .deveHistoryBox li:nth-child(2n) .dl{float: right;padding: 0 267px 0 80px;}

#obtn .deveHistoryBox li:nth-child(2n) .dl .img{left: auto; right: 0;}

#obtn .deveHistoryBox li:nth-child(2n) .dl em{left: auto; right:0; left: -44px;}

#obtn .deveHistoryBox li:nth-child(2n) .dl em:after{left:auto;right: -10px;

    border-top:11px solid transparent;

    border-left:11px solid #f4f4f5;

    border-right:0;

    border-bottom:11px solid transparent;

}

@media screen and (max-width:1569px) {

    #obtn .deveHistoryBox{padding:80px 0 75px 0}

    #obtn .deveHistoryBox li .dl{padding: 0 60px 0 240px}

    #obtn .deveHistoryBox li:nth-child(2n) .dl{padding: 0 240px 0 60px}

    #obtn .deveHistoryBox li .dl .img{width: 210px; height: 139px;}

    #obtn .deveHistoryBox li .dl dd{font-size: 16px; line-height: 30px;}

    #obtn .deveHistoryBox li .dl em{width: 74px; height: 74px; line-height: 74px; font-size: 20px; right: -37px;}

    #obtn .deveHistoryBox li:nth-child(2n) .dl em{right: auto; left: -37px;}

}

@media screen and (max-width:1229px) {

    #obtn .deveHistoryBox{padding:70px 0 65px 0}

}

@media screen and (max-width:991px) {

    #obtn .deveHistoryBox{padding:60px 0 65px 0}

    #obtn .deveHistoryBox:after {left: auto; right: 37px;}

    #obtn .deveHistoryBox li{margin-top: 20px;}

    #obtn .deveHistoryBox li .dl{width: 100%; padding: 0 80px 0 240px}

    #obtn .deveHistoryBox li:nth-child(2n) .dl{padding: 0 80px 0 240px}

    #obtn .deveHistoryBox li .dl em{right: 0;}

    #obtn .deveHistoryBox li:nth-child(2n) .dl .img{left:0; right: auto;}

    #obtn .deveHistoryBox li:nth-child(2n) .dl em{right: 0; left: auto;}

    #obtn .deveHistoryBox li:nth-child(2n) .dl em:after{left:-10px;right:auto;

        border-top: 11px solid transparent;

        border-left: 0;

        border-right:11px solid #f4f4f5;

        border-bottom: 11px solid transparent;

    }

}

@media screen and (max-width:767px) {

    #obtn .deveHistoryBox{padding:40px 0}

    #obtn .deveHistoryBox:after{right:30px;}

    #obtn .deveHistoryBox li .dl,

    #obtn .deveHistoryBox li:nth-child(2n) .dl{padding: 0 80px 0 0;}

    #obtn .deveHistoryBox li .dl .img{position: static; width: 100%; height: auto;}

    #obtn .deveHistoryBox li .dl em{width: 60px; height: 60px; line-height: 60px; font-size: 18px;}

    #obtn .deveHistoryBox li .dl em:after{

        margin-top: -6px; left: -5px;

        border-top: 6px solid transparent;

        border-right: 6px solid #f4f4f5;

        border-bottom: 6px solid transparent;

    }

    #obtn .deveHistoryBox li:nth-child(2n) .dl em:after{left:-5px;

        border-top: 6px solid transparent;

        border-right: 6px solid #f4f4f5;

        border-bottom: 6px solid transparent;

    }

    #obtn .deveHistoryBox li .dl dd{font-size: 14px; line-height: 26px; margin-top: 15px;}

    #obtn .deveHistoryBox li .dl .moreHis{margin-top: 10px; padding-left: 0;}

    #obtn .deveHistoryBox li .dl .moreHis a{font-size: 15px;}

}

/*5SINEE NEWS*/

#obtn .pageNewsBox{float: left; width: 100%; margin: 80px 0 0 0;}

#obtn .pageNewsBox .title{float: left; width: 100%; }

#obtn .pageNewsBox .title h2{float: left;color:#333333; font-size: 48px; line-height: 60px; font-weight: bold;}

#obtn .pageNewsBox .btnNum{float: right; color:#ababab; font-size: 24px; line-height: 60px;}

#obtn .pageNewsBox .btnNum .num{font-size: 24px; color:#0068b7; font-weight: bold;}

#obtn .RecNewsBox{float: left; width: 100%; margin-top: 30px;}

#obtn .RecNewsBox .slick-prev{ width:55px; height:55px; background:#cccccc;}

#obtn .RecNewsBox .slick-next{ width:55px; height:55px; background:#cccccc;}



#obtn .RecNewsBox .liBox{float: left; width: 100%;  transition: all 0.3s ease-out;

  -webkit-transition: all 0.3s ease-out;

  -moz-transition: all 0.3s ease-out;

  -o-transition: all 0.3s ease-out;

  -ms-transition: all 0.3s ease-out;}

#obtn .RecNewsBox .liBox a{float: left; width: 100%; background: #fff;

    box-shadow: 0 0 27px rgba(0,0,0,0.06);

    -moz-box-shadow: 0 0 27px rgba(0,0,0,0.06);

    -webkit-box-shadow: 0 0 27px rgba(0,0,0,0.06);

}

#obtn .RecNewsBox .liBox a .lImg{float: left; width: 60%;line-height: 0; overflow: hidden;}

#obtn .RecNewsBox .liBox a .lImg img{

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .RecNewsBox .liBox a:hover .lImg img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

#obtn .RecNewsBox .liBox a .rightText{float: right; width: 34%; margin-right: 3.2%; margin-left:2.8%; position: relative;}

#obtn .RecNewsBox .liBox a .rightText .time{float: left; width: 100%; margin-top: 45px; color:#ababab; position: relative}

#obtn .RecNewsBox .liBox a .rightText .time:after{position: absolute; content: ''; left: 0; bottom: -5px; width: 92px; height: 5px; background: #0068b7;}

#obtn .RecNewsBox .liBox a .rightText .time span{float: left; font-size: 90px; line-height:105px; font-family: Arial; font-weight: bold;}

#obtn .RecNewsBox .liBox a .rightText .time em{float: left; font-size: 24px; line-height: 24px; font-weight: bold;font-family: Arial; margin: 35px 0 0 20px;}

#obtn .RecNewsBox .liBox a .rightText .tH1Box{float: left; width: 100%; margin-top: 75px; color:#333333; font-size: 30px; line-height: 40px;  font-family: Arial; overflow:hidden;white-space: nowrap; text-overflow:ellipsis; 

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .RecNewsBox .liBox a .rightText .p1{float: left; width: 100%; color:#555555; font-size: 18px; line-height: 30px; height:120px; font-family: Arial; margin: 20px 0 35px 0;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 4;

    overflow: hidden;

}

#obtn .RecNewsBox .liBox a .rightText .more{float: left; width: 100%; text-align: right; color:#005ca1; font-size: 16px; font-weight:bold; line-height: 30px; margin-top: 30px;}

#obtn .RecNewsBox .liBox a:hover .rightText .tH1Box{color:#0068b7;}





@media screen and (max-width:1569px) {

    #obtn .RecNewsBox .liBox a .rightText .time{margin-top: 25px;}

    #obtn .RecNewsBox .liBox a .rightText .tH1Box{font-size: 26px; line-height: 35px; margin-top: 40px;}

    #obtn .RecNewsBox .liBox a .rightText .p1{font-size: 16px; line-height: 28px; height: 112px;}

}

@media screen and (max-width:1229px) {

    #obtn .RecNewsBox .liBox a .lImg{width: 55%;}

    #obtn .RecNewsBox .liBox a .rightText{width:39%;}

    #obtn .RecNewsBox .liBox a .rightText .time{margin-top: 15px;}

    #obtn .RecNewsBox .liBox a .rightText .time span{font-size: 70px; line-height: 90px;}

    #obtn .RecNewsBox .liBox a .rightText .time em{margin: 25px 0 0 20px; font-size: 20px;}

    #obtn .RecNewsBox .liBox a .rightText .time:after{width: 70px; height: 3px; bottom: -3px;}

    #obtn .RecNewsBox .liBox a .rightText .tH1Box{font-size: 24px; margin-top: 30px;}

    #obtn .RecNewsBox .liBox a .rightText .p1{font-size: 15px; line-height: 26px; height: 78px; margin: 20px 0 25px 0;

        display: -webkit-box;

        -webkit-box-orient: vertical;

        -webkit-line-clamp: 3;

        overflow: hidden;

    }

    #obtn .RecNewsBox .liBox a .rightText .more{margin-top: 0;}

}

@media screen and (max-width:991px) {

	#obtn .pageNewsBox{ margin:30px 0 0 0;}

	#obtn .RecNewsBox{ margin-top:15px;}

	#obtn .pageNewsBox .title h2{ font-size:20px; line-height:40px;}

	#obtn .pageNewsBox .btnNum{ line-height:40px; font-size:18px;}

    #obtn .RecNewsBox .liBox a .lImg{width: 100%;}

    #obtn .RecNewsBox .liBox a .rightText{width: 100%;margin-right:0; margin-left:0; padding: 0 20px 20px 20px;}

    #obtn .RecNewsBox .liBox a .rightText .tH1Box{ line-height: 30px; margin-top: 16px;}

    #obtn .RecNewsBox .liBox a .rightText .p1{margin:6px 0 6px 0; line-height:24px; height:72px;}

	#obtn .RecNewsBox .liBox a .rightText .time{margin-top: 10px;}

	#obtn .RecNewsBox .liBox a .rightText .time span{ font-size:40px; line-height:60px;}

	#obtn .RecNewsBox .liBox a .rightText .time em{ font-size:16px; line-height:18px; margin:15px 0 0 10px;}

}

@media screen and (max-width:767px) {

    #obtn .RecNewsBox .liBox a .rightText .time span{font-size: 60px; line-height:70px;}

    #obtn .RecNewsBox .liBox a .rightText .time em{font-size: 18px; line-height: 20px; margin: 17px 0 0 15px}

    #obtn .RecNewsBox .liBox a .rightText .time:after{width: 60px;}

    #obtn .RecNewsBox .liBox a .rightText .tH1Box{font-size: 20px;}

}





#obtn .pageNewsList{float: left; width: 100%;}

#obtn .pageNewsList li{float: left; width: 100%;}

#obtn .pageNewsList li a{float: left; width: 100%; padding: 50px 0; border-bottom: 1px solid #e3e3e3; position: relative}

#obtn .pageNewsList li a:after{position: absolute; content: ''; width:0; height: 1px; background: #0068b7; left: 0; bottom:-1px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .pageNewsList li a .leftText{float: left; width:67.5%;}

#obtn .pageNewsList li a:hover:after{width: 100%;}

#obtn .pageNewsList li a .leftText .tTime{float: left; width: 100%; color:#888888; font-size: 16px; font-weight: bold; line-height: 40px; margin-top: 12px;}

#obtn .pageNewsList li a .leftText .tTime span{font-size:30px; color:#333333;}

#obtn .pageNewsList li a .leftText .tH1{float: left; width: 100%; margin-top: 28px; color:#333333; font-size: 26px; line-height: 30px; font-family: Arial; max-height: 60px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp:2;

    overflow: hidden;

}

#obtn .pageNewsList li a:hover .leftText .tH1{color:#0068b7;}

#obtn .pageNewsList li a .leftText .p2{float: left; width: 100%; color:#555555; font-size: 18px; line-height: 30px; margin-top: 17px;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp:2;

    overflow: hidden;

}

#obtn .pageNewsList li a .leftText .more{float: left; width: 100%; margin-top: 45px; color:#888888; font-size: 16px; line-height: 32px; font-weight: bold; font-family: Arial;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .pageNewsList li a:hover .leftText .more{color:#0068b7;}

#obtn .pageNewsList li a .rightImg{float: right; width: 28.66%; line-height: 0; overflow: hidden;}

#obtn .pageNewsList li a .rightImg img{

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .pageNewsList li a:hover .rightImg img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}



@media screen and (max-width:1569px) {

    #obtn .pageNewsList li a{padding: 35px 0;}

    #obtn .pageNewsList li a .leftText .tTime{margin-top: 0;font-size: 15px; line-height: 35px;}

    #obtn .pageNewsList li a .leftText .tTime span{font-size: 24px;}

    #obtn .pageNewsList li a .leftText .tH1{margin-top:20px; font-size: 22px;}

    #obtn .pageNewsList li a .leftText .p2{font-size: 16px; line-height: 28px; margin-top: 15px;}

    #obtn .pageNewsList li a .leftText .more{margin-top: 35px;}



}

@media screen and (max-width:1229px) {

    #obtn .pageNewsList li a .leftText{width: 61%;}

    #obtn .pageNewsList li a .rightImg{width: 36%;}

}

@media screen and (max-width:991px) {

    #obtn .pageNewsList li a{padding:25px 0;}

    #obtn .pageNewsList li a .leftText .tH1{font-size: 18px; margin-top: 15px;}

    #obtn .pageNewsList li a .leftText .p2{font-size: 14px; line-height: 26px;}

    #obtn .pageNewsList li a .leftText .more{font-size: 15px; margin-top: 20px;}

}

@media screen and (max-width:767px) {

    #obtn .pageNewsList li a{padding: 20px 0;}

    #obtn .pageNewsList li a .leftText{width: 100%;}

    #obtn .pageNewsList li a .rightImg{width: 100%; margin-top: 15px;}

    #obtn .pageNewsList li a .leftText .tH1{margin-top: 10px;}

    #obtn .pageNewsList li a .leftText .more{margin-top: 10px;}

}



/*6SINEE NEWS-details*/

#obtn .topNewsBg{float: left; width: 100%; background: #f4f4f5;}

#obtn .topNewsBg .newsTitBox{float: left; width: 100%; margin: 54px 0 51px 0; padding: 0 160px; position: relative;}

#obtn .topNewsBg .newsTitBox .returnBox{position: absolute; width: 75px; left: 0; bottom: 10px;}

#obtn .topNewsBg .newsTitBox .returnBox i{display: block; text-align: center; line-height: 0;}

#obtn .topNewsBg .newsTitBox .returnBox i img{background: #fff;

    border-radius:30px;-moz-border-radius:30px;-webkit-border-radius:30px;}

#obtn .topNewsBg .newsTitBox .returnBox span{display: block; color:#888888; font-size: 14px; line-height: 24px; margin-top: 7px; text-align: center;}

#obtn .topNewsBg .newsTitBox .returnBox a:hover span{color:#0068b7}



#obtn .topNewsBg .newsTitBox h1{float: left; width: 100%; color:#333333; font-size: 36px; line-height: 40px; font-family: Arial;}

#obtn .topNewsBg .newsTitBox .time{float: left; width: 100%; margin-top: 20px;}

#obtn .topNewsBg .newsTitBox .time span{float: left; color:#888888; font-size: 16px; line-height: 40px;font-weight: bold;}

#obtn .topNewsBg .newsTitBox .time span b{color:#333333; font-size: 30px;}

#obtn .topNewsBg .newsTitBox .time .rightFy{float: right; color:#666666; font-weight: bold; line-height: 30px; margin-top: 10px;font-size: 18px;}

#obtn .topNewsBg .newsTitBox .time .rightFy a{color:#666666;}

#obtn .topNewsBg .newsTitBox .time .rightFy a:hover{color:#0068b7}

@media screen and (max-width:1569px) {

    #obtn .topNewsBg .newsTitBox{margin: 45px 0;padding: 0 120px;}

    #obtn .topNewsBg .newsTitBox h1{font-size:28px; line-height: 36px;}

    #obtn .topNewsBg .newsTitBox .time span b{font-size: 24px;}

    #obtn .topNewsBg .newsTitBox .time .rightFy{font-size: 16px;}

}

@media screen and (max-width:1229px) {

    #obtn .topNewsBg .newsTitBox{margin:30px 0;padding: 0 0 0 120px;}

    #obtn .topNewsBg .newsTitBox h1{font-size: 24px; line-height: 32px;}

    #obtn .topNewsBg .newsTitBox .time{margin-top: 15px;}

    #obtn .topNewsBg .newsTitBox .returnBox i img{width:45px; height: 45px;}

}

@media screen and (max-width:991px) {

    #obtn .topNewsBg .newsTitBox{margin:20px 0;padding: 0 0 0 100px;}

    #obtn .topNewsBg .newsTitBox h1{font-size: 20px; line-height: 28px;}

    #obtn .topNewsBg .newsTitBox .time span{font-size: 14px; line-height: 35px;}

    #obtn .topNewsBg .newsTitBox .time .rightFy{font-size: 14px; margin-top:5px;}

}

@media screen and (max-width:767px) {

    #obtn .topNewsBg .newsTitBox{padding: 0 0 0 80px;}

    #obtn .topNewsBg .newsTitBox .returnBox{width: 70px;}

    #obtn .topNewsBg .newsTitBox .returnBox span{font-size: 12px;}

    #obtn .topNewsBg .newsTitBox h1{font-size: 18px; line-height:26px;}

}



#obtn .newsInfoBox{float: left; width: 100%; margin: 95px 0 65px 0; padding: 0 160px; color:#555555; font-size: 18px; line-height: 36px;}

#obtn .theEnd{float: left; width: 100%;display: block; text-align: center; position: relative; margin-bottom: 70px;}

#obtn .theEnd span{display: inline-block; color:#333333; font-size: 18px; font-weight: bold; line-height: 30px; padding: 0 20px; background: #fff;position: relative; z-index: 2;}

#obtn .theEnd:after{position: absolute; content:''; width: 100%; height: 1px; top:50%; left: 0; background: #e7e7e7;}

@media screen and (max-width:1569px) {

    #obtn .newsInfoBox{margin: 70px 0 50px 0; padding: 0 120px;font-size: 16px; line-height: 30px;}

}

@media screen and (max-width:1229px) {

    #obtn .newsInfoBox{margin: 50px 0 40px 0; padding: 0;font-size: 16px; line-height: 30px;}

    #obtn .theEnd{margin-bottom:60px;}

}

@media screen and (max-width:767px) {

    #obtn .newsInfoBox{margin:35px 0 30px 0;font-size: 14px; line-height:26px;}

    #obtn .theEnd{margin-bottom: 40px;}

}



/*7products*/

#obtn .pageProGrey{float:left; width: 100%; background: #f4f4f5; position: relative}

#obtn .pageProGrey:after{position: absolute; content: ''; width: 16%; height: 100%; 
    /* background: #fff;  */
    left: 0;}

#obtn .proListBox{float: left; width: 100%; padding-left: 290px; position: relative}

#obtn .proLeftSlide{position: absolute; z-index: 3; left: 0; width: 290px; height: 100%; background: #fff;}

#obtn .proLeftSlide ul{float: left; width: 100%; text-align: center; margin-top: 60px;}

#obtn .proLeftSlide li{float: left; width: 100%; margin-top: 55px;}

#obtn .proLeftSlide li a{float: left; width: 100%; position: relative}

#obtn .proLeftSlide li a:after{position: absolute;content: ''; right: -19px; top:35px;width: 0;height: 0;opacity:0;filter:alpha(opacity=0);

    border-top: 17px solid transparent;

    border-left: 19px solid #fff;

    border-bottom: 17px solid transparent;

}

#obtn .proLeftSlide li a .tImg{float: left; width: 100%;text-align: center; line-height: 0; position: relative}

#obtn .proLeftSlide li a .tImg i{float: left; width: 100%; line-height: 0;-webkit-filter: grayscale(100%);filter: grayscale(100%);}

#obtn .proLeftSlide li a .tImg i:last-child{position: absolute; width: 100%; left: 0; top:0; opacity: 0;filter:alpha(opacity=0);

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

    -webkit-filter: grayscale(100%);

    filter: grayscale(100%);

}

#obtn .proLeftSlide li a .dText{float: left; width: 100%; margin-top: 17px; color:#333333; font-size:22px; line-height: 30px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proLeftSlide li a:hover:after,

#obtn .proLeftSlide li a.on:after{opacity:1;filter:alpha(opacity=100);}

#obtn .proLeftSlide li a.on .tImg i:last-child,

#obtn .proLeftSlide li a:hover .tImg i:last-child{opacity:1;filter:alpha(opacity=100);-webkit-filter:unset;filter:unset;}

#obtn .proLeftSlide li a.on .dText,

#obtn .proLeftSlide li a:hover .dText{color:#0068b7}

#obtn .proRightList{float: left; width: 100%; padding-left: 120px; margin-top: 20px;}

#obtn .proRightList ul{margin: 0 -30px}

#obtn .proRightList li{float: left; width: 50%; padding: 0 30px; margin-top: 60px;}

#obtn .proRightList li a{float: left; width: 100%; background: #f6f6f6; position: relative;}

#obtn .proRightList li a:hover{

    box-shadow: 0 0 29px rgba(0,0,0,0.05);

    -moz-box-shadow: 0 0 29px rgba(0,0,0,0.05);

    -webkit-box-shadow: 0 0 29px rgba(0,0,0,0.05);

}

#obtn .proRightList li a .tImg{float: left; width: 100%; line-height: 0; overflow: hidden;}

#obtn .proRightList li a .tImg img{

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proRightList li a span{/*position: absolute;*/ width: 100%; /*left: 0;*/ float:left; padding: 10px 10px; background:#fff; bottom:20px; line-height: 40px; color:#333333; font-size: 20px; text-align: center;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

    overflow: hidden;

    text-overflow:ellipsis;

    white-space: nowrap;

}

#obtn .proRightList li a:hover .tImg img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

#obtn .proRightList li a:hover span{color:#0068b7;}

@media screen and (max-width:1569px) {

    #obtn .proLeftSlide li{margin-top: 40px;}

    #obtn .proLeftSlide li a .tImg i img{width: 80px;}

    #obtn .proLeftSlide li a .dText{font-size: 18px; margin-top: 15px;}

    #obtn .proRightList{padding-left: 90px;margin-top: 20px;}

    #obtn .proRightList li a span{font-size: 18px;}

}

@media screen and (max-width:1229px) {

    #obtn .proListBox{padding-left: 250px;}

    #obtn .proLeftSlide{width: 250px;}

    #obtn .proLeftSlide li{margin-top: 30px;}

    #obtn .proLeftSlide li a .tImg i img{width: 70px;}

    #obtn .proLeftSlide li a .dText{font-size: 16px; margin-top: 10px;}

    #obtn .proRightList ul{margin:0 -20px;}

    #obtn .proRightList li{padding: 0 20px;margin-top: 40px;}

    #obtn .proRightList li a span{bottom: 15px; font-size: 16px;}

}

@media screen and (max-width:991px) {

    #obtn .proListBox{padding-left: 200px;}

    #obtn .proLeftSlide{width: 200px;}

    #obtn .proLeftSlide ul{margin-top:30px;}

    #obtn .proLeftSlide li a .tImg i img{width: 50px; height: 50px;}

    #obtn .proLeftSlide li a .dText{font-size: 14px;}

    #obtn .proLeftSlide li a:after{ right: -12px; top:20px;

        border-top: 10px solid transparent;

        border-left: 12px solid #fff;

        border-bottom: 10px solid transparent;

    }

    #obtn .proRightList{padding-left:60px;}

    #obtn .proRightList ul{margin: 0 -15px;}

    #obtn .proRightList li{padding: 0 15px; margin-top: 30px;}

    #obtn .proRightList li a span{font-size: 14px; bottom:5px;}

}

@media screen and (max-width:767px) {

    #obtn .pageProGrey:after{display: none;}

    #obtn .proListBox{padding-left: 0;}

    #obtn .proLeftSlide{width: 100%; position: static; float: left;}

    #obtn .proLeftSlide ul{margin-top: 0;}

    #obtn .proLeftSlide li{width: 33.333%; margin: 15px 0;}

    #obtn .proLeftSlide li a .tImg i img{width: 40px; height: 40px;}

    #obtn .proLeftSlide li a .dText{font-size: 14px; line-height: 24px;}

    #obtn .proRightList{padding-left: 0; margin-top:10px;}

    #obtn .proRightList ul{margin: 0 -7px;}

    #obtn .proRightList li{padding: 0 7px; margin-top: 15px;}

    #obtn .proRightList li a span{font-size: 14px; bottom: 0;}

}

/*8products-details*/

#obtn .pageProGrey1{float: left; width: 100%; background: #f6f6f6;}

#obtn .ShareBox{float: left; width: 100%; margin-top:45px; position: relative}

#obtn .ShareBox .returnBox{position: absolute; width: 75px; left: -85px; top:0; z-index: 2;}

#obtn .ShareBox .returnBox i{display: block; text-align: center; line-height: 0;}

#obtn .ShareBox .returnBox i img{background: #fff;

    border-radius:30px;-moz-border-radius:30px;-webkit-border-radius:30px;}

#obtn .ShareBox .returnBox em{display: block; color:#888888; font-size: 14px; line-height: 24px; margin-top: 7px; text-align: center;}

#obtn .ShareBox .returnBox a:hover em{color:#0068b7}



#obtn .ShareBox span{float:right; color:#555555; font-size: 16px; line-height: 30px; cursor: pointer}

#obtn .ShareBox span img{vertical-align: middle; margin-top: -2px;}

#obtn .ShareBox span:hover{color:#0068b7}



#obtn .leftImgBox{float: left; width:43%; margin-bottom: 110px;}

#obtn .leftImgBox .tImg{float: left; width: 100%; line-height: 0;}

#obtn .leftImgBox .slick-dots{height: 10px; bottom: -30px;}

#obtn .leftImgBox .slick-dots li{width: 10px; height: 10px; margin: 0 11px; background: #707070;border-radius: 10px;-moz-border-radius: 10px;-webkit-border-radius: 10px;

}

#obtn .leftImgBox .slick-dots li.slick-active{background: #0068b7;}

#obtn .leftImgBox .slick-prev,

#obtn .leftImgBox .slick-next{width: 30px; height: 30px; border:1px solid #757575; background: url("../images//pro8.png") no-repeat; background-size: cover; bottom:-60px;left: 50%; margin-left: -120px;

    top: auto; margin-top: 0;

    border-radius: 15px;

    -moz-border-radius: 15px;

    -webkit-border-radius: 15px;

}

#obtn .leftImgBox .slick-next{background: url("../images//pro9.png") no-repeat; background-size: cover; left: auto; right: 50%; margin-left: auto; margin-right: -120px;}

#obtn .rightTextBox{float: right; width: 49%; margin-bottom: 130px;}

#obtn .rightTextBox .tit{float: left; width: 100%; margin-top: 69px; color:#333333; font-size: 30px; font-weight: bold; line-height: 40px;}

#obtn .rightTextBox .p1{float: left; width: 100%; margin-top: 45px; color:#333333; font-size: 16px; line-height: 32px;}

#obtn .rightTextBox .more{float: left; width: 100%; margin-top: 90px; }

#obtn .rightTextBox .more a{float: left; width: 166px; height: 54px; margin-top:22px; background:#0068b7;color:#fff; font-size:20px; line-height:54px; text-align: center;

    border-radius: 3px;

    -moz-border-radius: 3px;

    -webkit-border-radius: 3px;

}

#obtn .rightTextBox .more img{width:120px; float:left;padding-left:20px;}

#obtn .rightTextBox .more a:hover{

    box-shadow: 0 0 15px rgba(0,0,0,0.2);

    -moz-box-shadow: 0 0 15px rgba(0,0,0,0.2);

    -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.2);

}

@media screen and (max-width:1569px) {

    #obtn .rightTextBox{margin-bottom: 80px;}

    #obtn .rightTextBox .tit{margin-top:15px;font-size: 24px; line-height: 30px;}

    #obtn .rightTextBox .p1{margin-top:35px; line-height: 28px;}

    #obtn .rightTextBox .more{margin-top:50px;}

}

@media screen and (max-width:1229px) {

    #obtn .leftImgBox{margin-bottom:80px;}

    #obtn .rightTextBox{margin-bottom: 50px;}

    #obtn .rightTextBox .p1{margin-top: 20px; font-size: 14px; line-height: 26px;}

    #obtn .rightTextBox .more{margin-top: 30px;}

    #obtn .rightTextBox .more a{height: 45px; line-height: 45px; font-size: 18px;}

}

@media screen and (max-width:991px) {

    #obtn .ShareBox{margin-top: 30px;}

    #obtn .leftImgBox{width: 100%; margin-bottom: 50px;}

    #obtn .rightTextBox{width: 100%;}

    #obtn .ShareBox .returnBox i img{width: 45px; height: 45px;}

}

@media screen and (max-width:767px) {

    #obtn .ShareBox .returnBox{left: 0; top:-10px; width: 150px;}

    #obtn .ShareBox .returnBox i{float: left;}

    #obtn .ShareBox .returnBox i img{width: 40px; height: 40px;}

    #obtn .ShareBox .returnBox em{float: left; margin-top: 0; line-height: 40px; margin-left: 10px;}

    #obtn .rightTextBox{margin-bottom: 40px;}

    #obtn .rightTextBox .more{margin-top: 25px;}

    #obtn .rightTextBox .more a{font-size: 16px; line-height: 40px; height: 40px;}

    #obtn .leftImgBox{margin-top: 10px;}

    #obtn .rightTextBox .more img{display:none;}

}

#obtn .proTecData{float: left; width: 100%; margin: 88px 0 100px 0;}

#obtn .proTecData .tH1{float: left; width: 100%; text-align: center; color:#333333; font-size: 48px; line-height: 60px; font-weight: bold;}

#obtn .proTecData .proTecDataList{float: left; width: 100%; margin-top: 48px;}

#obtn .proTecData .proTecDataHd{float: left; width: 100%;}

#obtn .proTecData .proTecDataHd ul{margin: 0 -2px;display: flex;justify-content: center;}

#obtn .proTecData .proTecDataHd li{float: left; width: 25%; padding:0 2px; text-align: center;

}

#obtn .proTecData .proTecDataHd li a{float: left; width: 100%;

    height: 68px;line-height: 68px; font-size: 20px;color:#fff; background: #ababab;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proTecData .proTecDataHd li:hover a,

#obtn .proTecData .proTecDataHd li.on a{background: #0068b7;}

#obtn .proTecData .proTecDataBd{float: left; width: 100%;}

#obtn .proTecData .proTecDataBd .u1{float: left; width: 100%;}

#obtn .proTecData .proTecDataBd .u1 li{float: left; width: 50%; padding-right: 15px; margin-top: 30px;}

#obtn .proTecData .proTecDataBd .u1 li:nth-child(2n){padding: 0 0 0 15px;}

#obtn .proTecData .proTecDataBd .u1 li a{float: left; width: 100%; background: #f6f6f6; padding: 30px 20px 30px 130px; position: relative}

#obtn .proTecData .proTecDataBd .u1 li a:hover{background: #0068b7;}

#obtn .proTecData .proTecDataBd .u1 li a span{position: absolute; width: 70px; height: 70px; left: 29px; top:50%; margin-top: -35px; line-height: 0;}

#obtn .proTecData .proTecDataBd .u1 li a span img{background: #fff;

    border-radius: 35px;

    -moz-border-radius: 35px;

    -webkit-border-radius: 35px;

}

#obtn .proTecData .proTecDataBd .u1 li a .textBox{float: left; width: 100%; height: 70px;display: table;}

#obtn .proTecData .proTecDataBd .u1 li a .textBox .table{display: table-cell; vertical-align: middle;}

#obtn .proTecData .proTecDataBd .u1 li a .textBox .table em{display: block; color:#0068b7; font-size: 14px;line-height: 20px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proTecData .proTecDataBd .u1 li a:hover .textBox .table em{color:#fff;}

#obtn .proTecData .proTecDataBd .u1 li a .textBox .table .p1{display: block; color:#333333; font-size: 20px; line-height: 26px; margin-top: 3px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proTecData .proTecDataBd .u1 li a:hover .textBox .table .p1{color:#fff;}

@media screen and (max-width:1569px) {

    #obtn .proTecData{margin:70px 0 80px 0}

    #obtn .proTecData .tH1{font-size: 38px; line-height: 45px;}

    #obtn .proTecData .proTecDataList{margin-top: 40px;}

    #obtn .proTecData .proTecDataHd li a{height: 55px; line-height: 55px; font-size: 18px;}

    #obtn .proTecData .proTecDataBd .u1 li a{padding: 20px 20px 20px 130px}

}

@media screen and (max-width:1229px) {

    #obtn .proTecData{margin:60px 0 70px 0}

    #obtn .proTecData .tH1{font-size: 32px; line-height: 40px;}

    #obtn .proTecData .proTecDataHd li a{font-size: 16px; line-height: 50px; height: 50px;}

    #obtn .proTecData .proTecDataBd .u1 li{padding-right: 10px; margin-top: 20px;}

    #obtn .proTecData .proTecDataBd .u1 li:nth-child(2n){padding: 0 0 0 10px;}

    #obtn .proTecData .proTecDataBd .u1 li a{padding: 20px 20px 20px 100px}

    #obtn .proTecData .proTecDataBd .u1 li a .textBox .table .p1{font-size: 18px;}

    #obtn .proTecData .proTecDataBd .u1 li a span{left: 15px;}

}

@media screen and (max-width:991px) {

    #obtn .proTecData .proTecDataBd .u1 li a .textBox .table .p1{font-size: 16px;}

}

@media screen and (max-width:767px) {

    #obtn .proTecData{margin: 40px 0;}

    #obtn .proTecData .tH1{font-size: 26px; line-height: 35px;}

    #obtn .proTecData .proTecDataList{margin-top: 25px;}

    #obtn .proTecData .proTecDataHd li a{font-size: 14px;}

    #obtn .proTecData .proTecDataBd .u1 li{width: 100%; padding: 0;}

    #obtn .proTecData .proTecDataBd .u1 li:nth-child(2n){padding: 0;}

    #obtn .proTecData .proTecDataBd .u1 li a{padding: 15px 15px 15px 90px}

    #obtn .proTecData .proTecDataBd .u1 li a span{width: 60px; height: 60px; margin-top: -30px;}

}

/*9solutions*/

#obtn .pageOurSuccess{float: left; width: 100%; margin: 80px 0 100px 0;}

#obtn .sucTit{float: left; width: 100%; color:#0068b7; font-size: 48px; line-height: 60px; text-align: center;}

#obtn .pageOurSuccess .p1{float: left; width: 100%; text-align: center; color:#333333; font-size: 18px; line-height: 32px; margin-top: 25px; font-family:Arial;}

#obtn .pageOurSuccess .p1 span{display: block;}

#obtn .pageOurSuccess .pageOurSucList{float: left; width: 100%; margin-top: 45px;}

#obtn .pageOurSuccess .pageOurSucList ul{float: left; width: 100%;}

#obtn .pageOurSuccess .pageOurSucList li{float: left; width:20%; background: #eeeef0; cursor: pointer;

    transition: all 0.2s linear;

    -webkit-transition: all 0.2s linear;

    -o-transition: all 0.2s linear;

}

#obtn .pageOurSuccess .pageOurSucList li:hover{background: #0068b7}

#obtn .pageOurSuccess .pageOurSucList li:nth-child(2n){background: #f8f8f9;}

#obtn .pageOurSuccess .pageOurSucList li:nth-child(2n):hover{background: #0068b7}

#obtn .pageOurSuccess .pageOurSucList li .tImg{float: left; width: 100%; text-align: center;position:relative; margin-top: 67px;}

#obtn .pageOurSuccess .pageOurSucList li .tImg img{

    transition: all 0.2s linear;

    -webkit-transition: all 0.2s linear;

    -o-transition: all 0.2s linear;

}

/*#obtn .pageOurSuccess .pageOurSucList li:hover .tImg img{*/

/*    transform:rotateY(360deg);*/

/*    -ms-transform:rotateY(360deg);*/

/*    -moz-transform:rotateY(360deg);*/

/*    -webkit-transform:rotateY(360deg);*/

/*    -o-transform:rotateY(360deg);*/

/*}*/

#obtn .pageOurSuccess .pageOurSucList li .tImg i{float: left; line-height: 0; width: 100%; text-align: center;

    transition: all 0.2s linear;

    -webkit-transition: all 0.2s linear;

    -o-transition: all 0.2s linear;

}

#obtn .pageOurSuccess .pageOurSucList li .tImg i:last-child{position: absolute; width: 100%; left: 0; top:0; opacity: 0;filter:alpha(opacity=0);}

#obtn .pageOurSuccess .pageOurSucList li:hover .tImg i{opacity:0;filter:alpha(opacity=0);}

#obtn .pageOurSuccess .pageOurSucList li:hover .tImg i:last-child{opacity: 1;filter:alpha(opacity=100);}

#obtn .pageOurSuccess .pageOurSucList li .dTex{float: left; width: 100%; text-align: center; margin-top: 30px; color:#333333; font-size: 20px; line-height: 30px; height: 90px; margin-bottom: 17px; padding: 0 10px; font-family: Arial;

    transition: all 0.2s linear;

    -webkit-transition: all 0.2s linear;

    -o-transition: all 0.2s linear;

}

#obtn .pageOurSuccess .pageOurSucList li:hover .dTex{color:#fff;}

@media screen and (max-width:1569px) {

    #obtn .pageOurSuccess{margin: 80px 0;}

    #obtn .sucTit{font-size: 38px; line-height: 45px;}

    #obtn .pageOurSuccess .p1{font-size: 16px; line-height: 28px; margin-top: 20px;}

    #obtn .pageOurSuccess .p1 span{display:inline;}

    #obtn .pageOurSuccess .pageOurSucList{margin-top: 40px;}

    #obtn .pageOurSuccess .pageOurSucList li .tImg{margin-top: 50px;}

    #obtn .pageOurSuccess .pageOurSucList li .tImg img{width: 90px; height: 90px;}

    #obtn .pageOurSuccess .pageOurSucList li .dTex{font-size: 18px; line-height: 28px; height: 84px;}

}

@media screen and (max-width:1229px) {

    #obtn .pageOurSuccess{margin: 65px 0;}

    #obtn .sucTit{font-size: 32px; line-height: 40px;}

    #obtn .pageOurSuccess .p1{font-size: 14px; line-height: 26px;}

    #obtn .pageOurSuccess .pageOurSucList li .tImg{margin-top: 35px;}

    #obtn .pageOurSuccess .pageOurSucList li .tImg i img{width:70px; height: 70px;}

    #obtn .pageOurSuccess .pageOurSucList li .dTex{font-size: 16px; line-height: 26px; height: 78px;margin-top: 20px;}

}

@media screen and (max-width:991px) {

    #obtn .pageOurSuccess .pageOurSucList li .tImg i img{width: 60px; height: 60px;}

    #obtn .pageOurSuccess .pageOurSucList li .dTex{font-size: 15px;}

}

@media screen and (max-width:767px) {

    #obtn .pageOurSuccess{margin:40px 0;}

    #obtn .sucTit{font-size: 26px; line-height: 35px;}

    #obtn .pageOurSuccess .p1{margin-top: 15px;}

    #obtn .pageOurSuccess .pageOurSucList{margin-top: 25px;}

    #obtn .pageOurSuccess .pageOurSucList li{width: 33.3333%;}

    #obtn .pageOurSuccess .pageOurSucList li .tImg{margin-top: 25px;}

    #obtn .pageOurSuccess .pageOurSucList li .tImg i img{width: 50px; height: 50px;}

}



#obtn .SucRecCases{float: left; width: 100%; margin-top: 88px;}

#obtn .SucRecList{float: left; width: 100%; margin-top: 35px;}

#obtn .SucRecList ul{margin: 0 -15px;}

#obtn .SucRecList li{float: left; width:25%; padding: 0 15px;}

#obtn .SucRecList li a{float: left; width: 100%;}

#obtn .SucRecList li a .tImg{float: left; width: 100%; line-height: 0; overflow: hidden;}

#obtn .SucRecList li a .tImg img{

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .SucRecList li a:hover .tImg img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

#obtn .SucRecList li a .dText{float: left; width: 100%; color:#333333; font-size:20px; line-height: 24px; margin-top: 27px; padding-bottom: 24px; border-bottom: 1px solid #e5e5e5;

}

#obtn .SucRecList li a .dText em{float: left; width: 100%; font-family: Arial;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp:2;

    overflow: hidden;

}

@media screen and (max-width:1569px) {

    #obtn .SucRecCases{margin-top: 70px;}

    #obtn .SucRecList ul{margin: 0 -10px;}

    #obtn .SucRecList li{padding: 0 10px;}

    #obtn .SucRecList li a .dText{font-size: 18px;margin-top: 20px;padding-bottom: 20px;}

}

@media screen and (max-width:1229px) {

    #obtn .SucRecCases{margin-top: 55px;}

    #obtn .SucRecList{margin-top: 30px;}

    #obtn .SucRecList li a .dText{font-size: 16px;}

}

@media screen and (max-width:767px) {

    #obtn .SucRecCases{margin-top:40px;}

    #obtn .SucRecList{margin-top:10px;}

    #obtn .SucRecList ul{margin: 0 -7px;}

    #obtn .SucRecList li{width: 50%; margin-top: 15px; padding: 0 7px;}

    #obtn .SucRecList li a .dText{font-size: 15px; margin-top: 10px; padding-bottom: 10px;}

}



/*10solutions-list*/

#obtn .goBack{float: left; width: 100%; margin-top: 40px;}

#obtn .goBack a{float: right;}

#obtn .goBack a span{float: left; color:#888888; font-size: 14px; line-height: 56px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .goBack a em{float: left; margin-left: 16px; line-height: 0;}

#obtn .goBack a em img{background: #fff;

    border-radius: 35px;-moz-border-radius: 35px;-webkit-border-radius: 35px;

}

#obtn .goBack a:hover span{color:#0068b7}



#obtn .proScreenBox{float: left; width: 100%; margin-top: 4px;}

#obtn .proScreenBox .ulIBox{float: left; width: 100%; background: #fff; padding: 18px 40px 19px 180px; margin-top: 10px; position: relative;}

#obtn .proScreenBox .ulIBox .leftTit{position: absolute; left: 30px; line-height: 42px; font-size: 20px; color:#0068b7; top:18px; font-family: Arial;}

#obtn .proScreenBox .ulIBox:after{position: absolute; content: ''; width: 1px; height: 18px;left: 141px; top:30px; background: #cccccc;}

#obtn .proScreenBox .ulIBox .listLi{float: left; width: 100%; height: 42px; overflow: hidden;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proScreenBox .ulIBox .listLi li{float: left; margin-right: 55px;}

#obtn .proScreenBox .ulIBox .listLi li a{float: left; line-height: 42px;color:#555555; font-family: Arial; font-size: 20px;}

#obtn .proScreenBox .ulIBox .listLi li a.on,

#obtn .proScreenBox .ulIBox .listLi li a:hover{color:#0068b7;}

#obtn .proScreenBox .rightIco{position:absolute; width: 15px; height: 15px; line-height: 0; right: 25px; top:30px; cursor: pointer;}

#obtn .proScreenBox .rightIco i{float: left; width: 15px; height: 15px; text-align: center; line-height: 15px;}

#obtn .proScreenBox .rightIco i img{vertical-align: middle; margin-top: -2px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proScreenBox .ulIBox.on .rightIco i img{

    transform:rotateX(180deg);

    -ms-transform:rotateX(180deg); 	/* IE 9 */

    -moz-transform:rotateX(180deg); 	/* Firefox */

    -webkit-transform:rotateX(180deg); /* Safari 鍜� Chrome */

    -o-transform:rotateX(180deg);

}

#obtn .proScreenBox .ulIBox.on .listLi{height: auto;}

@media screen and (max-width:1569px) {

    #obtn .proScreenBox .ulIBox{padding: 18px 40px 19px 160px}

    #obtn .proScreenBox .ulIBox .leftTit{font-size: 18px;}

    #obtn .proScreenBox .ulIBox:after{left: 130px;}

    #obtn .proScreenBox .ulIBox .listLi li{margin-right: 25px;}

    #obtn .proScreenBox .ulIBox .listLi li a{font-size: 18px;}

}

@media screen and (max-width:1229px) {

    #obtn .goBack{margin-top: 30px;}

    #obtn .goBack a em img{width:45px; height: 45px;}

    #obtn .goBack a span{line-height: 45px;}

    #obtn .proScreenBox .ulIBox{padding:15px 30px 15px 130px;}

    #obtn .proScreenBox .ulIBox .leftTit{top:15px; left: 20px; font-size: 16px;}

    #obtn .proScreenBox .ulIBox:after{left: 110px; top:28px;}

    #obtn .proScreenBox .ulIBox .listLi li a{font-size: 16px;}

}

@media screen and (max-width:767px) {

    #obtn .goBack{margin-top: 20px;}

    #obtn .proScreenBox .ulIBox{padding: 10px 20px 10px 100px}

    #obtn .proScreenBox .ulIBox .leftTit{font-size: 14px;top:10px;}

    #obtn .proScreenBox .ulIBox:after{left: 85px; top:24px;}

    #obtn .proScreenBox .ulIBox .listLi li a{font-size: 14px;}

    #obtn .proScreenBox .rightIco{right: 15px; top:24px;}

}



#obtn .proScreenList{float: left; width: 100%; margin-top: 12px;}

#obtn .proScreenList ul{margin: 0 -15px;}

#obtn .proScreenList li{float: left; width: 33.333%; padding: 0 15px; margin-top:30px;}

#obtn .proScreenList li a{float: left; width: 100%;}

#obtn .proScreenList li a:hover{

    box-shadow: 0 0 18px rgba(0,104,183,0.09);

    -moz-box-shadow: 0 0 18px rgba(0,104,183,0.09);

    -webkit-box-shadow: 0 0 18px rgba(0,104,183,0.09);

}

#obtn .proScreenList li a .tImg{float: left; width: 100%; line-height: 0; overflow: hidden;}

#obtn .proScreenList li a .tImg img{

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proScreenList li a:hover .tImg img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

#obtn .proScreenList li a .dText{float: left; width: 100%; background: #fff; padding: 0 30px;}

#obtn .proScreenList li a .dText h2{float: left; width: 100%; margin: 18px 0 21px 0; color:#333333; font-size: 20px; line-height: 40px; font-family: Arial;

    overflow: hidden;

    text-overflow:ellipsis;

    white-space: nowrap;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .proScreenList li a:hover .dText h2{color:#0068b7;}

#obtn .proScreenList li a .time{float: left; width: 100%; border-top:1px solid #e9e9e9; padding: 16px 0; color:#888888; font-size: 16px; line-height: 40px; font-family: Arial;}

#obtn .proScreenList li a .time img{vertical-align: middle; margin-top: -4px;}

@media screen and (max-width:1569px) {

    #obtn .proScreenList li a .dText{padding: 0 25px;}

    #obtn .proScreenList li a .dText h2{margin: 15px 0; font-size: 18px;}

    #obtn .proScreenList li a .time{padding: 12px 0;}

}

@media screen and (max-width:1229px) {

    #obtn .proScreenList ul{margin: 0 -10px;}

    #obtn .proScreenList li{padding: 0 10px; margin-top: 20px;}

    #obtn .proScreenList li a .dText h2{font-size: 16px; line-height: 35px;}

    #obtn .proScreenList li a .time{font-size: 14px; line-height: 35px;}

}

@media screen and (max-width:991px) {

    #obtn .proScreenList li{width: 50%;}

}

@media screen and (max-width:767px) {

    #obtn .proScreenList{margin-top: 5px;}

    #obtn .proScreenList li{width:100%;}

    #obtn .proScreenList li a .dText{padding: 0 15px;}

}



/*11services*/

#obtn .servicesOneBox{float: left; width: 100%; margin: 80px 0;}

#obtn .servicesOneBox ul{margin: 0 -15px;}

#obtn .servicesOneBox li{float: left; width: 50%; padding: 0 15px;}

#obtn .servicesOneBox li .imgBox{float: left; width: 100%; line-height: 0; background: #ffffff; position: relative; cursor: pointer; overflow: hidden;}

/*20200928*/

#obtn .servicesOneBox li .imgBox .img{

    /*opacity: 0.15;filter:alpha(opacity=15);*/

    opacity: 0.36;filter:alpha(opacity=36);

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .servicesOneBox li .imgBox:hover .img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

 /*20201203start 修改*/

#obtn .servicesOneBox li .imgBox .serInfo{position: absolute; left: 0; top:0; width: 100%;height: 100%; padding: 56px 40px;}

#obtn .servicesOneBox li .imgBox .tIco{float: left; width: 100%; text-align: center; line-height: 0; display: block;}

#obtn .servicesOneBox li .imgBox .tIco span{display: inline-block; width: 120px; height: 120px; line-height: 0;}

#obtn .servicesOneBox li .imgBox .tIco span img{background: #0068b7;

    border-radius: 60px;

    -moz-border-radius: 60px;

    -webkit-border-radius: 60px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .servicesOneBox li .imgBox:hover .tIco span img{

    transform:rotateY(360deg);

    -ms-transform:rotateY(360deg);

    -moz-transform:rotateY(360deg);

    -webkit-transform:rotateY(360deg);

    -o-transform:rotateY(360deg);

}

#obtn .servicesOneBox li .imgBox h3{ color:#333333; font-size: 24px; line-height: 40px;}

#obtn .servicesOneBox li .imgBox .p1{margin-top: 10px; color:#555555; font-size: 18px; line-height: 30px;font-family: Arial;}

#obtn .servicesOneBox li .imgBox .p1 span{display: block;}

#obtn .servicesOneBox li:hover .imgBox .serInfo{background-color: rgba(0,104,183,0.8);}

#obtn .servicesOneBox li:hover h3{color: #fff;}

#obtn .servicesOneBox li:hover .p1{color: #fff;}

@media screen and (max-width:1569px) {

    #obtn .servicesOneBox{margin: 80px 0;}

    #obtn .servicesOneBox li .imgBox .tIco span{width: 100px; height: 100px;}

}

@media screen and (max-width:1229px) {

    #obtn .servicesOneBox{margin: 65px 0;}

    #obtn .servicesOneBox li .imgBox .serInfo{}

    #obtn .servicesOneBox li .imgBox .tIco span{width: 80px; height: 80px;}

    #obtn .servicesOneBox li .imgBox h3{font-size: 18px; }

    #obtn .servicesOneBox li .imgBox .p1{font-size: 16px; line-height: 26px;margin-top: 0;}

    #obtn .servicesOneBox li .imgBox .p1 span{display: inline;}

}

@media screen and (max-width:991px) {

    #obtn .servicesOneBox{margin:40px 0 60px 0;}

    #obtn .servicesOneBox li{margin-top: 20px;}

   

}

@media screen and (max-width:767px) {

    #obtn .servicesOneBox{margin:25px 0 40px 0;}

    #obtn .servicesOneBox li{margin-top: 15px;width: 100%;}

    #obtn .servicesOneBox li .imgBox .tIco span{width: 60px; height: 60px;}

    #obtn .servicesOneBox li .imgBox h3{font-size: 18px; line-height: 30px;}

    #obtn .servicesOneBox li .imgBox .p1{line-height: 24px; margin-top: 5px;}

     /*20201203end*/

}



#obtn .serComBg{float: left; width: 100%; background: url("../images//ser5.jpg") no-repeat center; background-size: cover; padding: 90px 0 88px 0;}

#obtn .serComBg .serTit{float: left; width: 100%; text-align: center; color:#fff; font-size:30px; line-height: 40px;}

#obtn .serComBg .serListBox{float: left; width: 100%; margin-top: 41px;}

#obtn .serComBg .serListBox ul{float: left; width: 100%;}

#obtn .serComBg .serListBox li{float: left; width: 14.285%; background: #f6f6f6; height: 290px; cursor: pointer;}

#obtn .serComBg .serListBox li:nth-child(2n){background: #e8ebef;}

#obtn .serComBg .serListBox li .tIco{float: left; width: 100%; text-align: center; line-height: 0; margin-top: 53px;}

/*20201203start修改*/

#obtn .serComBg .serListBox li .tIco .wy_picbox{width: 80px;height: 80px;margin: 0 auto;padding: 10px; border-radius: 100%;overflow: hidden;border:1px solid #0068b7;}

#obtn .serComBg .serListBox li .tIco .wy_picbox .wy_pic{width: 100%;height: 100%;}

#obtn .serComBg .serListBox li .tIco .wy_picbox2{background-color: #0068b7;display: none;}

#obtn .serComBg .serListBox li:hover .tIco .wy_picbox1{display: none;}

#obtn .serComBg .serListBox li:hover .tIco .wy_picbox2{display: block;}

#obtn .serComBg .serListBox li h3{float: left; width: 100%; text-align: center; font-size: 18px; line-height: 22px; font-weight: bold; margin-top: 23px;}

#obtn .serComBg .serListBox li .text{float: left; width: 100%; margin-top: 14px; text-align: center; color:#0068b7; font-size: 18px; line-height: 18px; padding: 0 5px;}

#obtn .serComBg .serTelBox{float: left; width: 100%; text-align: center; color:#fff; font-weight: 100; font-size: 48px;line-height: 60px; margin-top: 40px;font-weight: lighter;}

#obtn .serComBg .serTelBox span{font-size: 20px;color: #ffff;font-weight: lighter;}

/*20201203end*/

@media screen and (max-width:1569px) {

    #obtn .serComBg{padding: 80px 0;}

    #obtn .serComBg .serListBox li h3{font-size: 16px;}

    #obtn .serComBg .serListBox li .text{font-size: 16px;}

}

@media screen and (max-width:1229px) {

    #obtn .serComBg{padding:65px 0;}

    #obtn .serComBg .serListBox{margin-top: 30px;}

    #obtn .serComBg .serTelBox{font-size: 38px; line-height: 50px; margin-top: 30px;}

    #obtn .serComBg .serListBox li .tIco{margin-top: 45px;}

    #obtn .serComBg .serListBox li .tIco img{width: 50px; height: 50px;}

}

@media screen and (max-width:991px) {

    #obtn .serComBg{padding:60px 0;}

    #obtn .serComBg .serTit{font-size: 26px; line-height: 35px;}

    #obtn .serComBg .serListBox li{width: 25%; height: 260px;}

    #obtn .serComBg .serListBox li:nth-child(5),

    #obtn .serComBg .serListBox li:nth-child(7){background:#e8ebef;}

    #obtn .serComBg .serListBox li:nth-child(6){background:#f6f6f6;}

    #obtn .serComBg .serListBox li .tIco{margin-top: 35px;}

    #obtn .serComBg .serListBox li h3{margin-top: 20px;}

    #obtn .serComBg .serTelBox {margin-top: 25px;}

    /*20201203start修改*/

    #obtn .serComBg .serListBox li .tIco .wy_picbox{width: 60px;height: 60px;padding: 5px;}

    #obtn .serComBg .serTelBox span{font-size: 16px;}

    /*20201203ned修改*/

}

@media screen and (max-width:767px) {

    #obtn .serComBg{padding:40px 0;}

    #obtn .serComBg .serTit{font-size: 24px;}

    #obtn .serComBg .serListBox{margin-top: 20px;}

    #obtn .serComBg .serListBox li{width: 50%;}

    #obtn .serComBg .serListBox li:nth-child(3),

    #obtn .serComBg .serListBox li:nth-child(6){background:#e8ebef;}

    #obtn .serComBg .serListBox li:nth-child(4),

    #obtn .serComBg .serListBox li:nth-child(5){background:#f6f6f6;}

    #obtn .serComBg .serListBox li h3{padding: 0 5px;}

    #obtn .serComBg .serTelBox{margin-top: 20px; font-size: 32px;}

    /*20201203start修改*/

    #obtn .serComBg .serTelBox span{font-size: 14px;}

    /*20201203end*/

}

#obtn .ServiceImgList{float: left; width: 100%; margin: 96px 0 100px 0;}

#obtn .ServiceImgList ul{float: left; width: 100%;}

#obtn .ServiceImgList li{float: left; width: 50%;}

#obtn .ServiceImgList li a{float: left; width: 100%; line-height: 0; background: #0068b7; position: relative; overflow:hidden;}

#obtn .ServiceImgList li a .botImg{

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .ServiceImgList li a:hover .botImg{opacity: 0.2;filter:alpha(opacity=20);

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

#obtn .ServiceImgList li a .textBox{position: absolute; left: 0; top:0; width: 100%; height: 100%; padding: 55px 59px;}

#obtn .ServiceImgList li a .textBox h3{float: left; width: 100%; color:#333333; font-size: 24px; line-height: 32px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .ServiceImgList li a .textBox .p2{float: left; width: 100%; color:#555555; font-size: 18px; line-height:28px; margin-top: 4px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .ServiceImgList li a:hover .textBox h3{color:#fff;}

#obtn .ServiceImgList li a:hover .textBox .p2{color:#fff;}

@media screen and (max-width:1569px) {

    #obtn .ServiceImgList{ margin: 80px 0 85px 0;}

    #obtn .ServiceImgList li a .textBox{padding: 50px;}

    #obtn .ServiceImgList li a .textBox h3{font-size: 22px;}

    #obtn .ServiceImgList li a .textBox .p2{font-size: 16px;}

}

@media screen and (max-width:1229px) {

    #obtn .ServiceImgList{ margin: 65px 0;}

    #obtn .ServiceImgList li a .textBox{padding:35px;}

    #obtn .ServiceImgList li a .textBox h3{font-size:18px;}

    #obtn .ServiceImgList li a .textBox .p2{font-size: 15px;}

}

@media screen and (max-width:767px) {

    #obtn .ServiceImgList{ margin:40px 0;}

    #obtn .ServiceImgList li{width: 100%;}

    #obtn .ServiceImgList li a .textBox{padding:20px 25px;}

    #obtn .ServiceImgList li a .textBox h3{font-size: 20px;}

    #obtn .ServiceImgList li a .textBox .p2{font-size: 14px; line-height: 26px;}

}



/*12download*/

#obtn .dataDownSecond{float: left; width: 100%; margin-top: 60px;}

#obtn .dataDownSecond .leftLevelBox{float: left; margin-top: 16px;}

#obtn .dataDownSecond .leftLevelBox li{float: left; margin-right: 21px;}

#obtn .dataDownSecond .leftLevelBox li a{float: left; line-height: 33px; font-size:18px; color:#333333; padding: 0 10px;}

#obtn .dataDownSecond .leftLevelBox li a.on,

#obtn .dataDownSecond .leftLevelBox li a:hover{background: #0068b7; color:#fff;

    border-radius: 4px;

    -moz-border-radius: 4px;

    -webkit-border-radius: 4px;

}

#obtn .dataDownSecond .rightSearch{float: right; width:31%; position:relative; height: 65px; padding-right: 150px;}

#obtn .dataDownSecond .rightSearch input{float: left; width: 100%; height: 65px; border:1px solid #e4e4e4; text-indent:20px; color:#0068b7; font-size: 18px;}

#obtn .dataDownSecond .rightSearch button{position: absolute; right: 0; top:0; background: #0068b7; border:0; width: 150px;  height: 65px; line-height: 65px; font-size: 22px; color:#fff;}

#obtn .dataDownSecond .rightSearch button:hover{

    box-shadow: 0 0 15px rgba(0,0,0,0.1);

    -moz-box-shadow: 0 0 15px rgba(0,0,0,0.1);

    -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.1);

}

@media screen and (max-width:1569px) {

    #obtn .dataDownSecond{margin-top: 50px;}

    #obtn .dataDownSecond .leftLevelBox li{margin-right: 12px;}

    #obtn .dataDownSecond .leftLevelBox li a{font-size: 16px;}

    #obtn .dataDownSecond .rightSearch input{font-size: 16px;}

    #obtn .dataDownSecond .rightSearch button{font-size: 18px;}

}

@media screen and (max-width:1229px) {

    #obtn .dataDownSecond .leftLevelBox{margin-top: 0;}

    #obtn .dataDownSecond .rightSearch{width: 100%; margin-top: 20px; height: 50px;}

    #obtn .dataDownSecond .rightSearch input{height: 50px;}

    #obtn .dataDownSecond .rightSearch button{height: 50px; line-height: 50px;}

}

@media screen and (max-width:991px) {

    #obtn .dataDownSecond{margin-top: 40px;}

    #obtn .dataDownSecond .leftLevelBox li{margin: 5px 10px 0 0;}

    #obtn .dataDownSecond .leftLevelBox li a{font-size: 15px; line-height: 30px;}

}

@media screen and (max-width:767px) {

    #obtn .dataDownSecond{margin-top:30px;}

    #obtn .dataDownSecond .rightSearch input{font-size: 15px;}

    #obtn .dataDownSecond .rightSearch button{font-size: 18px;}

}



#obtn .DownloadList{float: left; width: 100%;}

#obtn .DownloadList li{float: left; width: 100%; margin-top: 30px;}

#obtn .DownloadList li a{float: left; width: 100%; background: #f6f6f6; padding: 30px 60px 30px 130px; position: relative}

#obtn .DownloadList li a:after{position: absolute; content: ''; width:0; height: 2px; background: #0068b7; bottom: 0; left: 0;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .DownloadList li a:hover:after{width: 100%;}

#obtn .DownloadList li a span{position: absolute; width: 70px; height: 70px; top:50%; margin-top: -35px; left: 30px;line-height: 0; background: #fff;

    border-radius: 35px;

    -moz-border-radius: 35px;

    -webkit-border-radius: 35px;

}

#obtn .DownloadList li a .downText{float: left; width: 60%; height: 70px; display: table;}

#obtn .DownloadList li a .downText .table{display: table-cell; vertical-align: middle;}

#obtn .DownloadList li a .downText em{display: block; color:#0068b7; font-size: 14px; line-height: 20px;}

#obtn .DownloadList li a .downText .p1{display: block; color:#333333; font-size: 20px;line-height: 26px;}

#obtn .DownloadList li a .rightTime{float: right; width: 35%; height: 70px; border-left: 1px solid #c5c5c5}

#obtn .DownloadList li a .rightTime .timing{float: left; color:#888888; font-size: 15px; line-height: 70px; margin-left:100px;}

#obtn .DownloadList li a .downButton{float: right; color:#888888; font-size:15px; line-height: 70px;}

#obtn .DownloadList li a .downButton img{vertical-align: middle; margin-top: -2px;}

@media screen and (max-width:1569px) {

    #obtn .DownloadList li a .rightTime .timing{margin-left: 18%;}

    #obtn .DownloadList li a .downText .p1{font-size: 18px;}

}

@media screen and (max-width:1229px) {

    #obtn .DownloadList li a{padding: 20px 40px 20px 100px}

    #obtn .DownloadList li a span{left: 15px;}

}

@media screen and (max-width:991px) {

    #obtn .DownloadList li{margin-top: 25px;}

    #obtn .DownloadList li a{padding: 20px 20px 20px 90px}

    #obtn .DownloadList li a span{width: 60px; height: 60px; margin-top:-30px;}

    #obtn .DownloadList li a .downText{height: 60px; width: 55%;}

    #obtn .DownloadList li a .downText .p1{font-size: 16px;}

    #obtn .DownloadList li a .rightTime{height: 60px; width: 40%;}

    #obtn .DownloadList li a .rightTime .timing{line-height: 60px; margin-left: 10%; font-size: 14px;}

    #obtn .DownloadList li a .downButton{line-height: 60px;font-size: 14px;}

}

@media screen and (max-width:767px) {

    #obtn .DownloadList li{margin-top: 15px;}

    #obtn .DownloadList li a{padding: 15px 15px 15px 90px}

    #obtn .DownloadList li a span{top:15px; margin-top: 0;}

    #obtn .DownloadList li a .downText{width:100%; height: auto;padding: 8px 0;}

    #obtn .DownloadList li a .rightTime{width: 100%; border-left:0; border-top:1px solid #c5c5c5; height: 40px;}

    #obtn .DownloadList li a .rightTime .timing{margin-left: 0; line-height:40px;}

    #obtn .DownloadList li a .downButton{line-height: 40px;}

    #obtn .DownloadList li a .downButton img{width: 18px;}

}



/*13Servo selection*/

#obtn .ServoSelBox{float: left; width: 100%; margin: 31px 0 100px 0;}

#obtn .ServoSelScreen{float: left; width: 100%;}

#obtn .ServoSelScreen dl{float: left; width: 100%; margin-top: 43px;}

#obtn .ServoSelScreen dl dt{float: left;width: 100%; color:#0068b7; font-size: 22px; line-height: 30px; font-weight: bold; padding-bottom: 12px; position: relative}

#obtn .ServoSelScreen dl dt span{float: left; padding-right: 20px; background: #fff; position: relative; z-index: 2;}

#obtn .ServoSelScreen dl dt:after{position: absolute; content: ''; width: 100%; height: 1px; left: 0; top:15px; background: #e4e4e4}

#obtn .ServoSelScreen dl .ddBox{float: left; width: 100%; background: #f6f6f6; margin-top: 2px; padding: 12px 10px 12px 250px; position: relative;}

#obtn .ServoSelScreen dl .ddBox:after{position: absolute; content: ''; width: 1px; height:24px;background: #dbdbdb; left: 233px; top:17px;}

#obtn .ServoSelScreen dl .ddBox em{position: absolute; left: 30px; color:#333333; font-size: 16px; line-height: 34px; font-family: Arial;}

#obtn .ServoSelScreen dl .ddBox a{float: left; margin-left: 30px; color:#333333; font-size: 16px; line-height: 34px;}

#obtn .ServoSelScreen dl .ddBox a.on,

#obtn .ServoSelScreen dl .ddBox a:hover{color:#0068b7}



#obtn .ServoSelList{float: left; width: 100%; margin-top: 70px;}

#obtn .ServoSelList .tH1{float: left; width: 100%; color:#333333; font-size: 20px; line-height: 40px;}

#obtn .ServoSelList ul{margin: -10px -15px 0 -15px;}

#obtn .ServoSelList li{float: left; width: 50%; margin-top: 30px; padding: 0 15px;}

#obtn .ServoSelList li a{float: left; width: 100%; padding: 30px; background: #f6f6f6;}

#obtn .ServoSelList li a:hover{

    box-shadow: 0 0 15px rgba(0,0,0,0.1);

}

#obtn .ServoSelList li a .lImg{float: left; width: 34%; overflow: hidden}

#obtn .ServoSelList li a .lImg img{

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .ServoSelList li a:hover .lImg img{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

#obtn .ServoSelList li a .rText{float: left; width:66%; padding-left: 30px;}

#obtn .ServoSelList li a .rText h3{float: left; width: 100%; color:#0068b7; font-size: 24px; line-height: 40px; padding-bottom: 17px; border-bottom: 1px solid #dfdfdf}

#obtn .ServoSelList li a .rText .p2{float: left; width: 100%; color:#333333; font-size: 16px; line-height: 45px; margin-top: 10px;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp:4;

    overflow: hidden;

}

@media screen and (max-width:1569px) {

    #obtn .ServoSelList{margin-top: 60px}

    #obtn .ServoSelList li a{padding: 20px;}

    #obtn .ServoSelList li a .lImg{width: 38%;}

    #obtn .ServoSelList li a .rText{width: 62%; padding-left: 20px;}

    #obtn .ServoSelList li a .rText h3{font-size: 20px; padding-bottom: 10px;}

    #obtn .ServoSelList li a .rText .p2{font-size: 15px; line-height: 35px;}

}

@media screen and (max-width:1229px) {

    #obtn .ServoSelBox{margin: 20px 0 70px 0;}

    #obtn .ServoSelScreen dl{margin-top: 35px;}

    #obtn .ServoSelScreen dl dt{font-size: 20px;}

    #obtn .ServoSelScreen dl .ddBox{padding: 12px 10px 12px 220px}

    #obtn .ServoSelScreen dl .ddBox em{font-size: 15px; left: 20px;}

    #obtn .ServoSelScreen dl .ddBox a{font-size: 15px; margin-left: 20px;}

    #obtn .ServoSelScreen dl .ddBox:after{left: 205px;}

    #obtn .ServoSelList{margin-top: 45px;}

    #obtn .ServoSelList .tH1{font-size: 18px;}

    #obtn .ServoSelList ul{margin: -10px -10px 0 -10px}

    #obtn .ServoSelList li{padding: 0 10px; margin-top: 20px;}

    #obtn .ServoSelList li a{padding: 15px;}

}

@media screen and (max-width:991px) {

    #obtn .ServoSelBox{margin: 20px 0 60px 0;}

    #obtn .ServoSelScreen dl{margin-top: 30px;}

    #obtn .ServoSelList li{width: 100%;}

    #obtn .ServoSelList li a .rText h3{font-size: 18px; line-height: 30px;}

}

@media screen and (max-width:767px) {

    #obtn .ServoSelBox{margin: 10px 0 40px 0;}

    #obtn .ServoSelScreen dl dt{font-size: 18px;}

    #obtn .ServoSelScreen dl{margin-top: 20px;}

    #obtn .ServoSelScreen dl .ddBox{padding: 10px;}

    #obtn .ServoSelScreen dl .ddBox em{float: left; width: 100%; position: static; padding-left:15px;}

    #obtn .ServoSelScreen dl .ddBox:after{width: 40px; height: 1px; left: 25px; top:44px;}

    #obtn .ServoSelScreen dl .ddBox a{margin: 5px 0 0 15px;}

    #obtn .ServoSelList{margin-top: 30px;}

    #obtn .ServoSelList .tH1{font-size: 16px; line-height: 30px;}

    #obtn .ServoSelList li{margin-top: 15px;}

    #obtn .ServoSelList li a .rText{padding-left: 15px;}



    #obtn .ServoSelList li a .rText .p2{font-size: 14px; line-height:28px;}

}



/*14online message*/

#obtn .OnlineMessageBox{float: left; width: 100%; margin: 80px 0; background: url("../images//ser19.png") no-repeat center; background-size:100% 100%; padding: 77px 110px 96px 110px;}

#obtn .OnlineMessageBox .messTit{float: left; width:100%; color:#0068b7; font-size: 48px; line-height: 55px;}

#obtn .OnlineMessageBox .messText{float: left; width: 100%; margin-top: 15px; font-size:18px; color:#333333; line-height: 35px;}

#obtn .OnlineMessageBox .messText span{color:#0068b7}

#obtn .formBox{float: left; width: 100%; margin-top: 14px;}

/*20201229start*/

#obtn .formBox dl{float: left; width: 100%; margin-top: 20px;position: relative;z-index: 9;}

#obtn .formBox dl:nth-child(1){z-index: 10;}

/*20201229end*/

#obtn .formBox dl dt{float: left; width: 20%; line-height: 64px; color:#0068b7; font-size: 20px; font-weight: bold; font-family: Arial;}

#obtn .formBox dl .lab{float: left; width: 25%; margin-left: 1.6666%;position:relative;}

#obtn .formBox dl .lab .img{ float:left; position:absolute; right:20px; top:50%; margin-top: -3px; width:11px; height:7px;}

#obtn .formBox dl .lab .fv0{ float:left; width:100%; height:64px; font-size:18px; line-height:36px; background:#fff; position:relative; cursor:pointer; border:2px solid #e7eff5; font-family: Arial; color:#666666; text-indent: 25px;

}

#obtn .formBox dl .lab .ul0{ display:none; float:left; width:100%; position:absolute; left:0; top:60px; z-index:999; background:#fff;  padding:5px 0;border:1px solid #e7eff5;}

#obtn .formBox dl .lab .ul0 li{ float:left; width:100%; color:#333; font-size:16px; line-height:35px; cursor:pointer; padding: 0 20px; font-family: Arial;}

#obtn .formBox dl .lab .ul0 li:hover{background: #0068b7; color:#fff;}

#obtn .formBox dl .indexBox{float: left; width: 25%; margin-left: 1.6666%;}

#obtn .formBox dl .indexBox input{float: left; width: 100%; border:2px solid #e7eff5; height:64px; font-size: 18px; font-family: Arial; text-indent: 25px; color:#333;}

#obtn .formBox dl .textareaBox{float: left; width:78.3334%;margin-left: 1.6666%;}

#obtn .formBox dl .textareaBox textarea{float: left; width: 100%; border:2px solid #e7eff5; font-family: Arial; font-size: 18px; padding: 15px 25px; height: 97px;}

#obtn .formBox .buttonBox{float: right; width: 80%;}

#obtn .formBox .buttonBox .indexBox{float:left; width: 39.8%; margin-left: 2%; position: relative}

#obtn .formBox .buttonBox .indexBox span{position: absolute; right: 2px; top:2px;line-height: 0; width: 129px; height: 60px;}

#obtn .formBox .buttonBox .subBox{float: right; width: 56.48%; }

#obtn .formBox .buttonBox .subBox button{float: left; width: 100%;background: #0068b7; border:0;line-height: 64px; color:#fff; font-size:20px; font-family: Arial;}

#obtn .formBox .buttonBox .subBox button:hover{

    box-shadow: 0 0 15px rgba(0,0,0,0.15);

    -moz-box-shadow: 0 0 15px rgba(0,0,0,0.15);

    -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.15);

}

@media screen and (max-width:1569px) {

    #obtn .OnlineMessageBox{padding:60px 80px 80px 80px}

    #obtn .OnlineMessageBox .messTit{font-size: 42px;}

    #obtn .OnlineMessageBox .messText{line-height: 30px;}

    #obtn .formBox dl dt{font-size: 18px; line-height: 60px;}

    #obtn .formBox dl .lab .fv0{height: 60px; text-indent: 15px; font-size: 16px;}

    #obtn .formBox dl .indexBox input{height: 60px;font-size: 16px; text-indent: 15px;}

    #obtn .formBox dl .textareaBox textarea{font-size: 16px; padding: 15px;}

    #obtn .formBox .buttonBox .indexBox span{width: 120px;}

    #obtn .formBox .buttonBox .indexBox span img{height: 56px;}

    #obtn .formBox .buttonBox .subBox button{height: 60px; font-size: 18px;}

}

@media screen and (max-width:1229px) {

    #obtn .OnlineMessageBox{margin: 65px 0;padding: 50px 60px 60px 60px}

    #obtn .OnlineMessageBox .messTit{font-size: 36px;}

    #obtn .OnlineMessageBox .messText{font-size: 16px; line-height: 28px;}

    #obtn .formBox dl dt{font-size: 16px;}

}

@media screen and (max-width:991px) {

    #obtn .OnlineMessageBox{margin:55px 0;padding: 40px 40px 55px 40px;}

    #obtn .formBox dl{margin-top: 15px;}

    #obtn .formBox dl dt{width: 100%; line-height: 50px;}

    #obtn .formBox dl .lab{width: 32%; margin: 0 2% 0 0;}

    #obtn .formBox dl .indexBox{width: 32%; margin: 0 2% 0 0;}

    #obtn .formBox dl .indexBox:last-child{margin: 0;}

    #obtn .formBox dl .lab .ul0{top:50px;}

    #obtn .formBox dl .lab .fv0{height: 50px;}

    #obtn .formBox dl .indexBox input{height: 50px;}

    #obtn .formBox dl .textareaBox{width: 100%; margin-left: 0;}

    #obtn .formBox .buttonBox{width:100%;}

    #obtn .formBox .buttonBox .indexBox{margin: 0;width: 41.5%;}

    #obtn .formBox .buttonBox .indexBox span{width: 99px;height: 46px;}

    #obtn .formBox .buttonBox .indexBox span img{height: 46px;}

    #obtn .formBox .buttonBox .subBox button{height: 50px;line-height: 50px;}

}

@media screen and (max-width:767px) {

    #obtn .OnlineMessageBox{margin:35px 0 40px 0; padding:0; background: none;}

    #obtn .OnlineMessageBox .messTit{font-size: 30px; line-height: 45px;}

    #obtn .OnlineMessageBox .messText{font-size: 15px; line-height: 26px;}

    #obtn .formBox dl{margin-top:20px;}

    #obtn .formBox dl:first-child{margin-top: 10px;}

    #obtn .formBox dl dt{font-size:15px; line-height: 30px;}

    #obtn .formBox dl .lab{width: 100%; margin: 10px 0 0 0;}

    #obtn .formBox dl .lab .fv0{font-size: 15px;}

    #obtn .formBox dl .lab .ul0 li{font-size: 15px;}

    #obtn .formBox dl .indexBox{width: 100%; margin-top: 10px;}

    #obtn .formBox dl .indexBox:last-child{margin-top: 10px;}

    #obtn .formBox dl .indexBox input{font-size: 15px;}

    #obtn .formBox dl .textareaBox{margin-top: 10px;}

    #obtn .formBox .buttonBox .indexBox{width: 100%; margin-top: -10px;}

    #obtn .formBox .buttonBox .subBox{width: 100%; margin-top: 10px;}

}



/*15video*/

#obtn .videoListBox{float: left; width: 100%; margin-top: 70px;}

#obtn .videoListBox ul{margin: 0 -15px;}

#obtn .videoListBox li{float: left; width: 50%; padding: 0 15px; margin-top:30px;}

#obtn .videoListBox li a{float: left; width: 100%;}

#obtn .videoListBox li a .tImg{float: left; width: 100%; line-height: 0; position:relative; background: #000; overflow: hidden;}

#obtn .videoListBox li a .tImg .videoImg{opacity: 0.8;filter:alpha(opacity=80);

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .videoListBox li a:hover .tImg .videoImg{

    transform:scale(1.1);

    -ms-transform:scale(1.1);

    -moz-transform:scale(1.1);

    -webkit-transform:scale(1.1);

    -o-transform:scale(1.1);

}

#obtn .videoListBox li a .tImg span{position: absolute; z-index: 3; width: 86px;height: 86px; left: 50%; margin-left: -43px; top:50%; margin-top: -43px;}

#obtn .videoListBox li a .dText{float: left; width: 100%; background: #f4f4f5; padding:0 10px;color:#333333; font-size: 20px; font-family: Arial; height: 79px; line-height: 79px; text-align: center;

    overflow: hidden;

    text-overflow:ellipsis;

    white-space: nowrap;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .videoListBox li a:hover .dText{

    background: #0068b7; color:#fff;

}

@media screen and (max-width:1569px) {

    #obtn .videoListBox{margin-top: 50px;}

    #obtn .videoListBox li a .dText{font-size: 18px; height: 75px; line-height: 75px;}

}

@media screen and (max-width:1229px) {

    #obtn .videoListBox{margin-top: 40px;}

    #obtn .videoListBox li a .dText{font-size: 16px; height: 70px; line-height: 70px;}

    #obtn .videoListBox li a .tImg span{width: 70px; height: 70px; margin-left: -35px; margin-top: -35px;}

}

@media screen and (max-width:991px) {

    #obtn .videoListBox{margin-top:30px;}

    #obtn .videoListBox ul{margin: 0 -10px;}

    #obtn .videoListBox li{padding: 0 10px; margin-top: 20px;}

    #obtn .videoListBox li a .tImg span{width: 60px; height: 60px; margin-left: -30px; margin-top: -30px;}

}

@media screen and (max-width:767px) {

    #obtn .videoListBox{margin-top:15px;}

    #obtn .videoListBox li{width: 100%;}

    #obtn .videoListBox li a .dText{height: 60px; line-height: 60px; font-size: 14px;}

}



/*16contact*/

#obtn .contactPageBox{float: left; width: 100%; margin: 60px 0 100px 0;}

#obtn .contactPageBox .conTit{float: left; width: 100%; color:#333333; font-size: 24px; line-height: 60px; padding-bottom: 21px; border-bottom: 1px solid #e5e5e5; font-family: Arial; font-weight: bold;}

#obtn .contactPageBox .conListAdd{float: left; width: 100%; margin-top: 94px;}

#obtn .contactPageBox .conListAdd ul{margin: 0 -15px;}

#obtn .contactPageBox .conListAdd li{float: left; width: 25%; padding: 0 15px;}

#obtn .contactPageBox .conListAdd li .addBox{float: left; width: 100%; position: relative; background: #f6f6f6; height: 258px; cursor: pointer;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .contactPageBox .conListAdd li .addBox:hover{

    box-shadow: 0 0 15px rgba(0,0,0,0.15);

    -moz-box-shadow: 0 0 15px rgba(0,0,0,0.15);

    -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.15);

}

#obtn .contactPageBox .conListAdd li .addBox .tIco{position: absolute; left: 0; width: 100%; text-align: center; top:-52px; line-height: 0;}

#obtn .contactPageBox .conListAdd li .addBox .tIco img{/*background: #0068b7;*/background: rgba(45,45,45,0.4);

    border-radius:50%;

    -moz-border-radius:50%;

    -webkit-border-radius:50%;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

    #obtn .contactPageBox .conListAdd li .addBox:hover .tIco img {

        background: #0068b7;

        /*  transform:rotateY(360deg);

    -ms-transform:rotateY(360deg);

    -moz-transform:rotateY(360deg);

    -webkit-transform:rotateY(360deg);

    -o-transform:rotateY(360deg);*/

    }

#obtn .contactPageBox .conListAdd li .addBox h3{float: left; width: 100%; text-align: center; font-family: Arial; color:#333333; font-size: 20px; line-height: 32px; margin-top: 90px;}

#obtn .contactPageBox .conListAdd li .addBox .p3{float: left; width: 100%; padding: 0 20px; color:#555555; font-size: 16px; line-height: 20px; margin-top: 15px; text-align: center;}



/*20201230start*/

#obtn .conCityForm{float: left; width: 100%; margin-top: 80px;position: relative;z-index: 9;}

/*20201230end*/

#obtn .conCityForm .lab{float: left; width:38.47%; margin-right: 1.2738%;position:relative;}

#obtn .conCityForm .lab .img{ float:left; position:absolute; right:20px; top:50%; margin-top: -3px; width:11px; height:7px;}

#obtn .conCityForm .lab .fv0{ float:left; width:100%; height:65px; font-size:18px; line-height:36px; background:#fff; position:relative; cursor:pointer; border:1px solid #e3e3e3; font-family: Arial; color:#333333; text-indent: 25px;

    border-radius: 4px;

    -moz-border-radius: 4px;

    -webkit-border-radius: 4px;

}

#obtn .conCityForm .lab .ul0{ display:none; float:left; width:100%; position:absolute; left:0; top:64px; z-index:16; background:#fff;  padding:5px 0;border:1px solid #e7eff5;}

#obtn .conCityForm .lab .ul0 li{ float:left; width:100%; color:#333; font-size:16px; line-height:35px; cursor:pointer; padding: 0 20px; font-family: Arial;}

#obtn .conCityForm .lab .ul0 li:hover{background: #0068b7; color:#fff;}

#obtn .conCityForm .SearchBox{float: right; width:20.5124%;}

#obtn .conCityForm .SearchBox button{float: left; width: 100%; height: 65px; border:0; color:#fff; font-size: 18px; font-family: Arial; text-transform: uppercase; background: #0068b7;

    border-radius: 4px;

    -moz-border-radius: 4px;

    -webkit-border-radius: 4px;

}

#obtn .conCityForm .SearchBox button:hover{

    box-shadow: 0 0 15px rgba(0,0,0,0.15);

    -moz-box-shadow: 0 0 15px rgba(0,0,0,0.15);

    -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.15);

}

/*20201230start*/

#obtn .conCityList{float: left; width: 100%;position: relative;z-index: 8}

/*20201230end*/

#obtn .conCityList ul{margin: 0 -15px;}

#obtn .conCityList li{float: left; width:50%; padding: 0 15px; margin-top: 30px;}

#obtn .conCityList li .conInfo{float: left; width: 100%; background: #f6f6f6; padding: 32px 7.8% 19px 7.8%; height: 278px; cursor: pointer;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .conCityList li .conInfo .tit{float: left; width: 100%; color:#333333; font-size: 24px; line-height: 40px; padding-bottom: 21px; border-bottom: 1px solid #dbdbdb;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .conCityList li .conInfo .p3{float: left; width: 100%; color:#333333; font-size: 16px; line-height:20px; margin-top: 25px;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

#obtn .conCityList li .conInfo:hover{background: #0068b7;}

#obtn .conCityList li .conInfo:hover .tit{color:#fff;border-bottom: 1px solid #ffffff; border-color:rgba(255,255,255,0.1);}

#obtn .conCityList li .conInfo:hover .p3{color:#fff;}

@media screen and (max-width:1569px) {

    #obtn .contactPageBox{ margin: 50px 0 80px 0;}

    #obtn .contactPageBox .conListAdd li .addBox .tIco{top:-45px;}

    #obtn .contactPageBox .conListAdd li .addBox .tIco img{width: 90px; height: 90px;}

    #obtn .contactPageBox .conListAdd li .addBox h3{font-size: 18px;}

    #obtn .conCityList li .conInfo .tit{font-size: 22px;}

}

@media screen and (max-width:1229px) {

    #obtn .contactPageBox{ margin: 40px 0 70px 0;}

    #obtn .contactPageBox .conTit{font-size:22px; line-height: 50px;padding-bottom:15px;}

    #obtn .contactPageBox .conListAdd{margin-top: 80px;}

    #obtn .contactPageBox .conListAdd ul{margin: 0 -10px;}

    #obtn .contactPageBox .conListAdd li{padding: 0 10px;}

    #obtn .contactPageBox .conListAdd li .addBox .tIco{top:-37px;}

    #obtn .contactPageBox .conListAdd li .addBox .tIco img{width: 74px; height: 74px;}

    #obtn .contactPageBox .conListAdd li .addBox h3{font-size: 18px; margin-top: 75px;}

    #obtn .contactPageBox .conListAdd li .addBox .p3{font-size: 14px; margin-top: 10px;}

    #obtn .conCityForm{margin-top: 60px;}

    #obtn .conCityList{margin-top: 10px;}

    #obtn .conCityList ul{margin: 0 -10px;}

    #obtn .conCityList li{padding: 0 10px; margin-top: 20px;}

    #obtn .conCityList li .conInfo{padding:25px 6% 20px 6%}

    #obtn .conCityList li .conInfo .tit{font-size: 20px; padding-bottom: 10px;}

    #obtn .conCityList li .conInfo .p3{font-size: 15px; margin-top: 20px;}

}

@media screen and (max-width:991px) {

    #obtn .contactPageBox .conListAdd{margin-top: 20px;}

    #obtn .contactPageBox .conListAdd li{width: 50%; margin-top: 55px;}

    #obtn .conCityForm{margin-top: 40px;}

    #obtn .conCityForm .lab .fv0{height: 55px; line-height: 55px; font-size: 16px;}

    #obtn .conCityForm .lab .ul0{top:55px;}

    #obtn .conCityForm .SearchBox button{height: 55px; font-size: 16px;}

    #obtn .conCityList li{width: 100%;}

    #obtn .conCityList li .conInfo{height: auto;}

    #obtn .conCityList li .conInfo .tit{font-size: 18px;}

    #obtn .conCityList li .conInfo .p3{font-size: 14px;}

}

@media screen and (max-width:767px) {

    #obtn .contactPageBox{margin: 25px 0 40px 0;}

    #obtn .contactPageBox .conTit{font-size: 18px; padding-bottom: 10px;}

    #obtn .contactPageBox .conListAdd{margin-top: 0;}

    #obtn .contactPageBox .conListAdd li{width: 100%;}

    #obtn .conCityForm{margin-top: 20px;}

    #obtn .conCityForm .lab{width: 100%; margin-right: 0; margin-top: 10px;}

    #obtn .conCityForm .SearchBox{width: 100%; margin-top: 10px;}

    #obtn .conCityList{margin-top: 0;}

    #obtn .conCityList li .conInfo{padding: 15px 6% 25px 6%}

}



/*17solutions-details*/

#obtn .timeBox{float: left; width: 100%; margin-top: 15px;}

#obtn .timeBox span{display: inline-block; margin-right: 35px; color:#888888; font-size: 18px; line-height:45px; font-family: Arial;}

#obtn .timeBox span img{vertical-align: middle;margin-top: -3px;}

@media screen and (max-width:1569px) {

    #obtn .timeBox span{font-size: 16px;}

}

@media screen and (max-width:1229px) {

    #obtn .timeBox span{font-size: 15px; line-height: 40px; margin-right: 25px;}

}

@media screen and (max-width:991px) {

    #obtn .timeBox span{font-size: 14px; line-height: 30px; margin-right: 20px;}

}



/*寮曞椤�?*/

#obtn .GuidePageBox{position: fixed; width: 100%; height:100%; left: 0; top:0; background: #005ca1; z-index: 9999;}

#obtn .WhiteGarden{position: fixed; left: 50%; top:50%; z-index: 999; background: #fff;

    transition: all 0.5s linear;

    -webkit-transition: all 0.5s linear;

    -o-transition: all 0.5s linear;

}

@keyframes widthBox

{

    from {width: 28px; height: 28px; left: 50%;top:50%;margin-left:-14px; margin-top:-14px;

        border-radius: 15px;

        -moz-border-radius: 15px;

        -webkit-border-radius: 15px;

    }

    to {width:200%; height:200%;left:-50%;top:-50%;margin-left:0; margin-top:0;

        border-radius: 100%;

        -moz-border-radius: 100%;

        -webkit-border-radius: 100%;

    }

}



@-moz-keyframes widthBox /* Firefox */

{

    from {width: 28px; height: 28px; left: 50%;top:50%;margin-left:-14px; margin-top:-14px;

        border-radius: 15px;

        -moz-border-radius: 15px;

        -webkit-border-radius: 15px;

    }

    to {width:200%; height:200%;left:-50%;top:-50%;margin-left:0; margin-top:0;

        border-radius: 100%;

        -moz-border-radius: 100%;

        -webkit-border-radius: 100%;

    }

}



@-webkit-keyframes widthBox /* Safari 鍜� Chrome */

{

    from {width: 28px; height: 28px; left: 50%;top:50%;margin-left:-14px; margin-top:-14px;

        border-radius: 15px;

        -moz-border-radius: 15px;

        -webkit-border-radius: 15px;

    }

    to {width:200%; height:200%;left:-50%;top:-50%;margin-left:0; margin-top:0;

        border-radius: 100%;

        -moz-border-radius: 100%;

        -webkit-border-radius: 100%;

    }

}



@-o-keyframes widthBox /* Opera */

{

    from {width: 28px; height: 28px; left: 50%;top:50%;margin-left:-14px; margin-top:-14px;

        border-radius: 15px;

        -moz-border-radius: 15px;

        -webkit-border-radius: 15px;

    }

    to {width:200%; height:200%;left:-50%;top:-50%;margin-left:0; margin-top:0;

        border-radius: 100%;

        -moz-border-radius: 100%;

        -webkit-border-radius: 100%;

    }

}

#obtn .WhiteGarden { left: 0; top:0;

    animation: widthBox 1.5s;

    -moz-animation: widthBox 1.5s;	/* Firefox */

    -webkit-animation: widthBox 1.5s;	/* Safari 鍜� Chrome */

    -o-animation: widthBox 1.5s;

    animation-fill-mode:forwards;

    background: #fff;

}

#obtn .guideLogo{position: fixed; z-index:9999; width:180px; height: 45px; top:50%; margin-top: -22.5px;opacity: 0;}

@keyframes leftLogo

{

    from {left: 0; margin-left: -90px; opacity: 0;filter:alpha(opacity=0);}

    to {left: 50%; margin-left: -90px;opacity: 1;filter:alpha(opacity=100);}

}



@-moz-keyframes leftLogo /* Firefox */

{

    from {left: 0; margin-left: -90px; opacity: 0;filter:alpha(opacity=0);}

    to {left: 50%; margin-left: -90px;opacity: 1;filter:alpha(opacity=100);}

}



@-webkit-keyframes leftLogo /* Safari 鍜� Chrome */

{

    from {left: 0; margin-left: -90px; opacity: 0;filter:alpha(opacity=0);}

    to {left: 50%; margin-left: -90px;opacity: 1;filter:alpha(opacity=100);}

}



@-o-keyframes leftLogo /* Opera */

{

    from {left: 0; margin-left: -90px; opacity: 0;filter:alpha(opacity=0);}

    to {left: 50%; margin-left: -90px;opacity: 1;filter:alpha(opacity=100);}

}

#obtn .guideLogo {

    animation: leftLogo 2s;

    -moz-animation: leftLogo 2s;	/* Firefox */

    -webkit-animation: leftLogo 2s;	/* Safari 鍜� Chrome */

    -o-animation: leftLogo 2s;

    animation-fill-mode:forwards;

    opacity: 1;filter:alpha(opacity=100);

}

#obtn .bgBox{position: fixed; z-index:9999;left: 0;

    right: 0;

    top: 0;

    bottom: 0;

    box-sizing: border-box;

    border-style: solid;

    border-color: rgba(0, 0, 0, .6);

    border-left-width: 500px;

    border-bottom-width:500px;

    border-top-width: 500px;

    border-right-width: 500px;

}







@-moz-keyframes leftLogo /* Firefox */

{

    from {border-left-width: 500px;

        border-bottom-width:500px;

        border-top-width: 500px;

        border-right-width: 500px;}

    to {border-left-width: 0;

        border-bottom-width:0;

        border-top-width: 0;

        border-right-width:0;}

}



@-webkit-keyframes leftLogo /* Safari 鍜� Chrome */

{

    from {border-left-width: 500px;

        border-bottom-width:500px;

        border-top-width: 500px;

        border-right-width: 500px;}

    to {border-left-width: 0;

        border-bottom-width:0;

        border-top-width: 0;

        border-right-width:0;}

}



@-o-keyframes leftLogo /* Opera */

{

    from {border-left-width: 500px;

        border-bottom-width:500px;

        border-top-width: 500px;

        border-right-width: 500px;}

    to {border-left-width: 0;

        border-bottom-width:0;

        border-top-width: 0;

        border-right-width:0;}

}







#new #top {

  background-size: cover;

}

#new #top .title {

  z-index: 10;

  display: flex;

  justify-content: space-between;

  align-items: flex-end;

  font-size: 28px;

  margin-bottom: 0.3rem;

}

#new #top .rowMain {

  position: relative;

  z-index: 10;

  height: 100%;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

}

#new #top .rowMain .wrap {

  max-width: 100%;

  position: relative;

  width: 100%;

  padding-bottom: 40%;

  min-height: 480px;

}

#new #top .rowMain .wrap > .bg {

  width: 50%;

  visibility: hidden;

  opacity: 0;

  pointer-events: none;

}

#new #top .rowMain .wrap .itemwrap {

  position: absolute;

  width: 100%;

  top: 0;

  left: 0;

  height: 100%;

}

#new #top .rowMain .wrap .itemwrap .box {

  display: flex;

  height: 100%;

  align-items: stretch;

  top: 0;

  left: 0;

  position: absolute;

  width: 100%;

  opacity: 0;

  pointer-events: none;

  z-index: 999;

}

#new #top .rowMain .wrap .itemwrap .box > a {

  display: flex;

  height: 100%;

  align-items: stretch;

  top: 0;

  left: 0;

  position: absolute;

  width: 100%;

  pointer-events: none;

  z-index: 999;

}

#new #top .rowMain .wrap .itemwrap .box .col {

  width: 55%;

  background-color: #fff;

  position: relative;

}

#new #top .rowMain .wrap .itemwrap .box .col .pic {

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

}

#new #top .rowMain .wrap .itemwrap .box .col:nth-of-type(2) {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: flex-start;

  width: 45%;

  padding: 0.4rem 0.6rem;

  background: url("http://www.enjoyauto.com/templates/dist/css/../img/bg1.png") bottom right no-repeat #ffffff;

  background-size: 50%;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg {

  max-width: 100%;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .topic {

  display: flex;

  justify-content: flex-start;

  flex-wrap: wrap;

  align-items: flex-end;

  margin-bottom: 0.3rem;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .topic > span:nth-of-type(1) {

  font-size: 80px;

  margin-right: 14px;

  line-height: 80px;

  border-bottom: 3px solid #d70c18;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .topic > span:nth-of-type(2) {

  margin-bottom: 7px;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .topic > span:nth-of-type(2) > em {

  font-size: 16px;

  line-height: 1;

  font-style: normal;

  display: block;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .topic > span:nth-of-type(2) > small {

  font-size: 16px;

  line-height: 1;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .mid h2,

#new #top .rowMain .wrap .itemwrap .box .col .msg .mid span,

#new #top .rowMain .wrap .itemwrap .box .col .msg .mid p {

  max-width: 100%;

  transition: all 0.3s ease-out;

  -webkit-transition: all 0.3s ease-out;

  -moz-transition: all 0.3s ease-out;

  -o-transition: all 0.3s ease-out;

  -ms-transition: all 0.3s ease-out;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .other {

  text-align: right;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .other .go-more {

  color: #000;

  position: relative;

  display: inline-block;

  padding-left: 30px;

  height: 40px;

  line-height: 40px;

  transition: all 0.3s ease-out;

  -webkit-transition: all 0.3s ease-out;

  -moz-transition: all 0.3s ease-out;

  -o-transition: all 0.3s ease-out;

  -ms-transition: all 0.3s ease-out;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .other .go-more .arrow {

  font-size: 12px;

  vertical-align: top;

  margin-left: 10px;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .other .go-more:hover {

  color: #d70c18;

}

#new #top .rowMain .wrap .itemwrap .box .col .msg .other .go-more:hover .arrow {

  border-color: transparent transparent transparent #d70c18;

}

#new #top .rowMain .wrap .itemwrap .box.on {

  opacity: 1;

  box-shadow: 0 30px 60px -2px rgba(77, 81, 84, 0.1);

  pointer-events: auto;

  z-index: 900;

}

#new #top .rowMain .wrap .itemwrap .box:hover h2 {

  color: #d70c18;

}

#new #top .rowMain .wrap .itemwrap .box:hover .col .other .go-more {

  color: #d70c18;

}

#new #top .rowMain .wrap .itemwrap .box:hover .col .other .go-more .arrow {

  border-color: transparent transparent transparent #d70c18;

}

#new #top .rowMain .wrap .pager { float:right; position:absolute;

 margin-top:45px;

  top: 100%; right:0;

  width:auto;

  display: flex;

  justify-content: flex-end;

  align-items: center;

}

#new #top .rowMain .wrap .pager .p-prev {

  width: 55px; float:left;

  height: 55px;

  background:url(../images//m20-1.png) center no-repeat #cccccc; background-size:20px auto;

  transition: all 0.3s ease-out;

  -webkit-transition: all 0.3s ease-out;

  -moz-transition: all 0.3s ease-out;

  -o-transition: all 0.3s ease-out;

  -ms-transition: all 0.3s ease-out;

  cursor: pointer;

}

#new #top .rowMain .wrap .pager .p-prev:hover {

  background-color: #005ca1;

}

#new #top .rowMain .wrap .pager .p-next {

  width: 55px; float:left;

  height: 55px;

  background:url(../images//m20-2.png) center no-repeat #cccccc; background-size:20px auto;

  margin-left: 10px;

  transition: all 0.3s ease-out;

  -webkit-transition: all 0.3s ease-out;

  -moz-transition: all 0.3s ease-out;

  -o-transition: all 0.3s ease-out;

  -ms-transition: all 0.3s ease-out;

  cursor: pointer;

}

#new #top .rowMain .wrap .pager .p-next:hover {

  background-color: #005ca1;

}





.bloc { float:left; width:100%;position: relative;min-height: 100%; padding-bottom:120px;}

.bloc .wrapper { float:left; width:100%; height:100%;}

.bloc .wrapper .row {

    height: 100vh;

    background-color: #fff;

    position: absolute;

    width: 100vw;

    top: 0;

    left: 0;

    z-index: 3;

    opacity: 0;

    overflow: hidden;

}

.bloc .wrapper .row.on {

    z-index: 4;

    opacity: 1;

}

.bloc .wrapper .row.navInPrev {

    pointer-events: none;

    opacity: 1;

    -webkit-animation: slideInHalfFromTop 0.7s forwards ease-in-out;

    animation: slideInHalfFromTop 0.7s forwards ease-in-out;

}

.bloc .wrapper .row.navOutPrev {

    pointer-events: none;

    opacity: 1;

    -webkit-animation: slideOutBottom 0.7s forwards ease-in-out;

    animation: slideOutBottom 0.7s forwards ease-in-out;

}

.bloc .wrapper .row.navInNext {

    pointer-events: none;

    opacity: 1;

    z-index: 100;

    -webkit-animation: slideInFromBottom 0.7s forwards ease-in-out;

    animation: slideInFromBottom 0.7s forwards ease-in-out;

}

.bloc .wrapper .row.navOutNext {

    pointer-events: none;

    opacity: 1;

    -webkit-animation: slideOutHalfTop 0.7s forwards ease-in-out;

    animation: slideOutHalfTop 0.7s forwards ease-in-out;

}

.bloc .wrapper .claNext {

    z-index: 4;

    opacity: 1;

    transform: translateY(85%);

    animation: mhover .5s ease 1;

}



@media screen and (max-width:1229px) {

#new #top .rowMain .wrap{ min-height:352px; padding-bottom:36.5%;}	

}

@media screen and (max-width:991px) {

.bloc{ padding-bottom:75px;}	

#new #top .rowMain .wrap{ min-height:239px; padding-bottom:32.5%;}	

#new #top .rowMain .wrap .pager{ margin-top:20px;}

#new #top .rowMain .wrap .pager .p-prev{ width:36px; height:36px; background-size:12px auto;}

#new #top .rowMain .wrap .pager .p-next{ width:36px; height:36px; background-size:12px auto;}

}

@media screen and (max-width:767px) {

    #new #top .rowMain{display: block; height: auto;}

    #new #top .rowMain .wrap{min-height:500px; padding-bottom:35%;}

    #new #top .rowMain .wrap .itemwrap .box > a{display: block;}

}

@media screen and (max-width:374px) {

    #new #top .rowMain .wrap{min-height:450px; padding-bottom:35%;}

}



/*加入我们*/

#obtn .jiaru1{ float:left; width:100%; background:#f8f8f8; padding:100px 0 100px 0;}

#obtn .share{ float:left; width:100%; margin-bottom:30px; position:relative; z-index:88; }

#obtn .share .so1{ float:left; width:38.47%; margin-right:1.27%;  position:relative; z-index:6;}

#obtn .share .so1:after{ float:left; width:0; height:0; position:absolute; right:30px; top:50%; content:''; border-left: 6px solid transparent; border-right:6px solid transparent;border-top:7px solid #d3d3d3; margin-top:-3px; }

#obtn .share .so2{ float:left; width:38.61%;  margin-right:1.27%;  position:relative; z-index:5;}

#obtn .share .so2:after{ float:left; width:0; height:0; position:absolute; right:30px; top:50%; content:''; border-left: 6px solid transparent; border-right:6px solid transparent;border-top:7px solid #d3d3d3; margin-top:-3px; }

#obtn .share .so3{ float:right; width:20.38%; }

#obtn .share .fv1{ float:left; width:100%; border:1px solid #e3e3e3; border-radius:3px; background:#fff; color:#333333; font-size:18px; line-height:63px; height:65px; padding:0 30px; outline:none; cursor:pointer;}

#obtn .share .fv2{ float:left; width:100%; border:none; border-radius:3px; background:#0068b7; color:#fff; font-size:18px; line-height:65px; cursor:pointer;}

#obtn .share ul{ display:none; float:left; width:100%; position:absolute; left:0; z-index:10; top:100%; background:rgba(0,0,0,0.8); border-radius:3px; padding:14px 0; }

#obtn .share ul li{ float:left; width:100%; color:#ffffff; font-size:16px; line-height:35px; padding:0 47px; margin:6px 0; cursor:pointer; }

#obtn .share ul li:hover{ background:rgba(146,201,229,0.8);}



#obtn .jiaru1 ul{ float:left; width:100%; }

#obtn .jiaru1 ul{ float:left; width:100%; }

#obtn .jiaru1 ul li{ float:left; width:100%; margin-top:1px; position:relative; z-index:6; }

#obtn .jiaru1 ul li .info1{ float:left; width:100%; padding:36px 60px; background:#fff; position:relative;}

#obtn .jiaru1 ul li .info1 .l1{ float:left; width:100%; color:#333333; font-size:18px; line-height:28px; padding-right:100px; padding-left:24px; position:relative; z-index:8;}

#obtn .jiaru1 ul li .info1 .l1:after{ float:left; width:5px; height:22px; position:absolute; left:0; top:3px; content:''; background:#0068b7;}

#obtn .jiaru1 ul li .info1 .l2{ float:left; width:100%; color:#333333; font-size:16px; line-height:26px; margin-top:30px; padding-right:100px; position:relative; z-index:8; }

#obtn .jiaru1 ul li .info1 .l2 .p1{ float:left; width:22.5%; padding-left:24px;}

#obtn .jiaru1 ul li .info1 .l2 .sp{ color:#888888;}

#obtn .jiaru1 ul li .info1 .l3{ float:left; position:absolute; z-index:8; right:84px; top:50%; margin-top:-13px; color:#fff; font-size:16px; line-height:26px;-webkit-transition: 0.5s ease;

   -moz-transition: 0.5s ease;

	-ms-transition: 0.5s ease;

	 -o-transition: 0.5s ease;

		transition: 0.5s ease;}

#obtn .jiaru1 ul li .info1 .l3:after{ float:left; width:0; height:0; position:absolute; left:100%; margin-left:14px; top:50%; margin-top:-8px; content:''; border-top: 8px solid transparent; border-bottom:8px solid transparent;border-left: 11px solid #454545;

webkit-transition: 0.5s ease;

   -moz-transition: 0.5s ease;

	-ms-transition: 0.5s ease;

	 -o-transition: 0.5s ease;

		transition: 0.5s ease; }

#obtn .jiaru1 ul li .info2{ display:none; float:left; width:100%; background:#fff; padding:0 84px; letter-spacing:1px; color:#666666; font-size:16px; line-height:30px; position:relative; z-index:8; }

#obtn .jiaru1 ul li .info2 .line1{ float:left; width:100%; padding:36px 0; border-top:1px solid #e1e1e1; }

#obtn .jiaru1 ul li .info2 .p1{ float:left; width:100%; font-weight:bold; color:#333333; font-size:18px; line-height:32px;}

#obtn .jiaru1 ul li .info2 .p2{ float:left; width:100%; margin:26px 0 58px 0; }

#obtn .jiaru1 ul li:nth-child(2n) .info1{ background:#f8f8f8;}

#obtn .jiaru1 ul li:nth-child(2n) .info1 .l3{ color:#f8f8f8;}





#obtn .jiaru1 ul li.active .info1{ background:#fff;}

#obtn .jiaru1 ul li.active .info1 .l3{ color:#666666;}

#obtn .jiaru1 ul li.active .info1 .l3:after{ transform:rotate(90deg);}

#obtn .jiaru1 ul li.active{ box-shadow:0 0 38px rgba(0,0,0,0.1); z-index:8;}

#obtn .jiaru1 ul li.active .info1{ background:#fff;}





@media screen and (max-width:1600px ) {



}

@media screen and (max-width:1229px ){

#obtn .jiaru1 ul li .info1{ padding:30px 40px;}

#obtn .jiaru1 ul li .info1 .l1{ font-size:16px; line-height:26px; padding-left:15px;}

#obtn .jiaru1 ul li .info1 .l2{ font-size:14px; line-height:24px; margin-top:15px;}

#obtn .jiaru1 ul li .info1 .l2 .p1{ padding-left:15px;}

#obtn .jiaru1 ul li .info1 .l3{ right:40px;}

#obtn .jiaru1 ul li .info2{ padding:0 55px;}

}

@media screen and (max-width:1023px ){

#obtn .jiaru1{ padding:40px 0 40px 0;}	

#obtn .share .fv1{ font-size:14px; line-height:38px; height:40px; padding:0 12px;}

#obtn .share .fv2{ font-size:14px; line-height:40px;}

#obtn .share ul{ padding:7px 0; }

#obtn .share ul li{ font-size:14px; line-height:32px; padding:0 10px; margin:1px 0;}



#obtn .jiaru1 ul li .info1{ padding:15px 15px;}

#obtn .jiaru1 ul li .info1 .l1{ padding-right:85px;}

#obtn .jiaru1 ul li .info1 .l1:after{ width:3px; height:20px;}

#obtn .jiaru1 ul li .info1 .l2{ padding-right:85px; margin-top:8px;}

#obtn .jiaru1 ul li .info1 .l2 .p1{ width:50%;}

#obtn .jiaru1 ul li .info1 .l3{ font-size:14px;}

#obtn .jiaru1 ul li .info1 .l3:after{ margin-left:10px; margin-top:-6px; content:''; border-top: 6px solid transparent; border-bottom:6px solid transparent;border-left:8px solid #454545; }

#obtn .jiaru1 ul li .info2{ padding:0 25px;  font-size:14px; line-height:26px;}

#obtn .jiaru1 ul li .info2 .line1{ padding:18px 0;}

#obtn .jiaru1 ul li .info2 .p1{ font-size:16px; line-height:28px;}

#obtn .jiaru1 ul li .info2 .p2{ margin:10px 0 20px 0; }



}

@media screen and (max-width:767px ) {

#obtn .jiaru1 ul li .info1 .l2 .p1{ width:100%;}

}



/*

#005ca1

@media screen and (max-width:1569px) {}

@media screen and (max-width:1229px) {}

@media screen and (max-width:991px) {}

@media screen and (max-width:767px) {}



*/



/*20201203start修改*/

#obtn .wy_content{width: 100%;padding-top: 80px;}

#obtn .wy_content .wy_top{width: 100%;overflow: hidden;}

#obtn .wy_content .wy_top .input{width: 38.38%;float: left;height: 64px;border:1px solid #e3e3e3;border-radius: 6px;padding: 0 24px;margin-left: 0.8833333333333333%;}

#obtn .wy_content .wy_top .input input{width: 100%;height: 100%;}

#obtn .wy_content .wy_top .type{width: 38.38%;float: left;height: 64px;border:1px solid #e3e3e3;border-radius: 6px;margin-left: 0.8833333333333333%;position: relative;}

#obtn .wy_content .wy_top .type .jt{width: 11px;height: 7px;position: absolute;right: 30px;top: 50%;

-webkit-transform: translate(0,-50%); 

-ms-transform: translate(0,-50%);}

#obtn .wy_content .wy_top .type select{width: 100%;height: 100%;border:none;padding-left: 24px;padding-right: 20px;padding-right: 50px;

outline: none;

appearance:none;

-moz-appearance:none;

-webkit-appearance:none;

-ms-appearance:none;}

#obtn .wy_content .wy_top .type select::-ms-expand { display: none;}

#obtn .wy_content .wy_top .button{width: 20.59%;float: left;height: 64px;border-radius: 6px;overflow: hidden;margin-left: 0.8833333333333333%;}

#obtn .wy_content .wy_top .button button{width: 100%;height: 100%; background-color: #0068b7;font-size: 18px;color: #ffffff;}

#obtn .wy_content .wy_bottom{width: 100%;margin-top: 30px;border:1px solid #e4e4e4;}

#obtn .wy_content .wy_bottom .typebox{width: 100%;overflow: hidden;}

#obtn .wy_content .wy_bottom .typebox li{cursor: pointer; width: 25%;float: left;height: 52px;background-color: #d9e7f1;text-align: center;line-height: 52px;font-size: 18px;color: #0068b7;border-right: 1px solid #fff;}

#obtn .wy_content .wy_bottom .typebox li a{width:100%;float: left;text-align: center; line-height: 52px;font-size: 18px;color: #0068b7;}

#obtn .wy_content .wy_bottom .typebox li:hover,#obtn .wy_content .wy_bottom .typebox li.on{background-color: #0068b7;color: #fff;}

#obtn .wy_content .wy_bottom .typebox li:hover a{color: #fff;}

#obtn .wy_content .wy_bottom .typebox li.on a{color: #fff;}

#obtn .wy_content .wy_bottom .wy_cots{width: 100%;}

#obtn .wy_content .wy_bottom .wy_cots ul{width: 100%;padding: 16px 32px;}

#obtn .wy_content .wy_bottom .wy_cots ul li{border-bottom: 1px solid #e4e4e4;padding: 20px 0;font-size: 0;cursor: pointer;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1{width: 8.027%;display: inline-block;vertical-align: middle;font-size: 14px; position: relative;padding: 0 2px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1 .shu{font-size: 16px;position: absolute;right: 0;top:45%;color: #bdbdbd;

-webkit-transform: translate(0,-50%); 

-ms-transform: translate(0,-50%);}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1 .icon{width: 13px;height: 15px;display: inline-block;vertical-align: middle;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1 .icon2{display: none;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1 .words{font-size: 14px;color: #888888;display: inline-block;vertical-align: middle;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v2{width: 44.52%;display: inline-block;vertical-align: middle;font-size: 14px;color: #333333;padding: 0 2px;padding-left: 21px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v3{width: 15.67%;display: inline-block;vertical-align: middle;font-size: 14px;color: #333333;padding: 0 2px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v4{width: 16.08%;display: inline-block;vertical-align: middle;font-size: 14px; color: #333333;padding: 0 2px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5{width: 5%;display: inline-block;vertical-align: middle;position: relative;text-align: center;padding: 0 2px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .box{width: 14px;height: 14px;margin: 0 auto;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .box2{display: none;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .posi{width: 153px;height: 193px;background: url(images/img15.png)no-repeat center center;background-size: cover;padding: 23px 15px 0 15px;position: absolute;left: 50%;z-index: 99;display: none;

-webkit-transform: translate(-50%,0); 

-ms-transform: translate(-50%,0);

top: -moz-calc(100% + 9px);

top: -o-calc(100% + 9px);

top: -webkit-calc(100% + 9px);

top: calc(100% + 9px);}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .posi .ewms{width: 120px;height: 120px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .posi .words{font-size: 16px;color: #333333;margin-top: 13px; text-align: center;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5:hover .posi{display: block;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v6{width: 11.41%;display: inline-block;vertical-align: middle;font-size: 14px; text-align: right;padding: 0 2px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v6 .icon{width: 12px;height: 14px;display: inline-block;vertical-align: middle;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v6 .icon2{display: none;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v6 .words{font-size: 14px;color: #888888;display: inline-block;vertical-align: middle;margin-left: 4px;}

#obtn .wy_content .wy_bottom .wy_cots ul li:last-child{border-bottom: none;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover{background-color: #0068b7;border-bottom: none;padding-left: 20px;padding-right: 20px;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v1 .icon1{display: none;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v1 .icon2{display: inline-block;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v1 .words{color: #fff;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v1 .shu{color: #91bce4;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v2,#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v3,#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v4{color: #fff;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v5 .box1{display: none;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v5 .box2{display: inline-block;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v6 .icon1{display: none;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v6 .icon2{display: inline-block;}

#obtn .wy_content .wy_bottom .wy_cots ul li:hover .v6 .words{color: #fff;}

@media  screen and (max-width: 1400px){



@media  screen and (max-width: 1199px){

}

@media  screen and (max-width: 991px){

#obtn .wy_content{padding-top: 20px;}

#obtn .wy_content .wy_top .input{height: 35px;padding: 0 12px;}

#obtn .wy_content .wy_top .type{height: 35px;}

#obtn .wy_content .wy_top .type .jt{right: 20px;}

#obtn .wy_content .wy_top .type select{padding-left: 12px;padding-right: 40px;}

#obtn .wy_content .wy_top .button{height: 35px;}

#obtn .wy_content .wy_top .button button{font-size: 16px;}

#obtn .wy_content .wy_bottom{margin-top: 18px;}

#obtn .wy_content .wy_bottom .typebox li{height: 32px;line-height: 32px;font-size: 16px;}

#obtn .wy_content .wy_bottom .wy_cots ul{padding: 10px 14px;}

#obtn .wy_content .wy_bottom .wy_cots ul li{padding: 12px 0;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1{width: 10%;padding-right: 10px;text-align: center;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1 .icon{width: 12px;height: 14px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1 .words{font-size: 12px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v2{width: 40%;font-size: 12px;padding-left: 10px;padding-right: 10px;text-align: center;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v3{font-size: 12px;padding: 0 5px;text-align: center;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v4{font-size: 12px;text-align: center; padding: 0 5px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .box{width: 12px;height: 12px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .posi{width: 130px;height: 170px;padding: 23px 15px 0 15px;

top: -moz-calc(100% + 5px);

top: -o-calc(100% + 5px);

top: -webkit-calc(100% + 5px);

top: calc(100% + 5px);}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .posi .ewms{width: 100px;height: 100px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5 .posi .words{font-size: 14px;margin-top: 10px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v6 .icon{width: 10px;height: 12px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v6 .words{font-size: 12px;}

}           

@media  screen and (max-width: 767px){

#obtn .wy_content{padding-top: 18px;}

#obtn .wy_content .wy_top .input{height: 30px;padding: 0 10px;}

#obtn .wy_content .wy_top .input input{font-size: 12px;}

#obtn .wy_content .wy_top .type{height: 30px;}

#obtn .wy_content .wy_top .type .jt{right: 20px;}

#obtn .wy_content .wy_top .type select{padding-left: 10px;font-size: 12px;padding-right: 35px;}

#obtn .wy_content .wy_top .button{height: 30px;}

#obtn .wy_content .wy_top .button button{font-size: 14px;}

#obtn .wy_content .wy_bottom{margin-top: 14px;}

#obtn .wy_content .wy_bottom .typebox li{height: 50px;line-height: 50px;font-size: 14px;}

#obtn .wy_content .wy_bottom .wy_cots ul{padding: 8px;}

#obtn .wy_content .wy_bottom .wy_cots ul li{padding: 10px 0;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v1{width: 25%;padding-right: 10px;text-align: center;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v2{width: 50%;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v3{width: 25%;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v4{width: 33.33333%;margin-top: 15px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v5{width: 33.33333%;margin-top: 15px;}

#obtn .wy_content .wy_bottom .wy_cots ul li .v6{width: 33.3333%;margin-top: 15px;}

}

/*20201203end*/





.animated {

    -webkit-animation-duration: 1.2s;

    animation-duration: 1.2s;

    -webkit-animation-fill-mode: both;

    animation-fill-mode: both;

}

.animated.infinite {

    -webkit-animation-iteration-count: infinite;

    animation-iteration-count: infinite

}

.animated.hinge {

    -webkit-animation-duration: 2s;

    animation-duration: 2s

}



@-webkit-keyframes bounceInDown {

    0%, 100%, 60%, 75%, 90% {

        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);

        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(0, -3000px, 0);

        transform: translate3d(0, -3000px, 0)

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(0, 25px, 0);

        transform: translate3d(0, 25px, 0)

    }

    75% {

        -webkit-transform: translate3d(0, -10px, 0);

        transform: translate3d(0, -10px, 0)

    }

    90% {

        -webkit-transform: translate3d(0, 5px, 0);

        transform: translate3d(0, 5px, 0)

    }

    100% {

        -webkit-transform: none;

        transform: none

    }

}



@keyframes bounceInDown {

    0%, 100%, 60%, 75%, 90% {

        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);

        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(0, -3000px, 0);

        -ms-transform: translate3d(0, -3000px, 0);

        transform: translate3d(0, -3000px, 0)

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(0, 25px, 0);

        -ms-transform: translate3d(0, 25px, 0);

        transform: translate3d(0, 25px, 0)

    }

    75% {

        -webkit-transform: translate3d(0, -10px, 0);

        -ms-transform: translate3d(0, -10px, 0);

        transform: translate3d(0, -10px, 0)

    }

    90% {

        -webkit-transform: translate3d(0, 5px, 0);

        -ms-transform: translate3d(0, 5px, 0);

        transform: translate3d(0, 5px, 0)

    }

    100% {

        -webkit-transform: none;

        -ms-transform: none;

        transform: none

    }

}



.bounceInDown {

    -webkit-animation-name: bounceInDown;

    animation-name: bounceInDown

}



@-webkit-keyframes bounceInLeft {

    0%, 100%, 60%, 75%, 90% {

        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);

        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(-3000px, 0, 0);

        transform: translate3d(-3000px, 0, 0)

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(25px, 0, 0);

        transform: translate3d(25px, 0, 0)

    }

    75% {

        -webkit-transform: translate3d(-10px, 0, 0);

        transform: translate3d(-10px, 0, 0)

    }

    90% {

        -webkit-transform: translate3d(5px, 0, 0);

        transform: translate3d(5px, 0, 0)

    }

    100% {

        -webkit-transform: none;

        transform: none

    }

}



@keyframes bounceInLeft {

    0%, 100%, 60%, 75%, 90% {

        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);

        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(-3000px, 0, 0);

        -ms-transform: translate3d(-3000px, 0, 0);

        transform: translate3d(-3000px, 0, 0)

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(25px, 0, 0);

        -ms-transform: translate3d(25px, 0, 0);

        transform: translate3d(25px, 0, 0)

    }

    75% {

        -webkit-transform: translate3d(-10px, 0, 0);

        -ms-transform: translate3d(-10px, 0, 0);

        transform: translate3d(-10px, 0, 0)

    }

    90% {

        -webkit-transform: translate3d(5px, 0, 0);

        -ms-transform: translate3d(5px, 0, 0);

        transform: translate3d(5px, 0, 0)

    }

    100% {

        -webkit-transform: none;

        -ms-transform: none;

        transform: none

    }

}



.bounceInLeft {

    -webkit-animation-name: bounceInLeft;

    animation-name: bounceInLeft

}



@-webkit-keyframes bounceInRight {

    0%, 100%, 60%, 75%, 90% {

        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);

        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(3000px, 0, 0);

        transform: translate3d(3000px, 0, 0)

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(-25px, 0, 0);

        transform: translate3d(-25px, 0, 0)

    }

    75% {

        -webkit-transform: translate3d(10px, 0, 0);

        transform: translate3d(10px, 0, 0)

    }

    90% {

        -webkit-transform: translate3d(-5px, 0, 0);

        transform: translate3d(-5px, 0, 0)

    }

    100% {

        -webkit-transform: none;

        transform: none

    }

}



@keyframes bounceInRight {

    0%, 100%, 60%, 75%, 90% {

        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);

        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(3000px, 0, 0);

        -ms-transform: translate3d(3000px, 0, 0);

        transform: translate3d(3000px, 0, 0)

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(-25px, 0, 0);

        -ms-transform: translate3d(-25px, 0, 0);

        transform: translate3d(-25px, 0, 0)

    }

    75% {

        -webkit-transform: translate3d(10px, 0, 0);

        -ms-transform: translate3d(10px, 0, 0);

        transform: translate3d(10px, 0, 0)

    }

    90% {

        -webkit-transform: translate3d(-5px, 0, 0);

        -ms-transform: translate3d(-5px, 0, 0);

        transform: translate3d(-5px, 0, 0)

    }

    100% {

        -webkit-transform: none;

        -ms-transform: none;

        transform: none

    }

}



.bounceInRight {

    -webkit-animation-name: bounceInRight;

    animation-name: bounceInRight

}



@-webkit-keyframes bounceInUp {

    0%, 100%, 60%, 75%, 90% {

        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);

        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(0, 3000px, 0);

        transform: translate3d(0, 3000px, 0)

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(0, -20px, 0);

        transform: translate3d(0, -20px, 0)

    }

    75% {

        -webkit-transform: translate3d(0, 10px, 0);

        transform: translate3d(0, 10px, 0)

    }

    90% {

        -webkit-transform: translate3d(0, -5px, 0);

        transform: translate3d(0, -5px, 0)

    }

    100% {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0)

    }

}











.fxPushReveal .navOutNext {

	opacity: 1;

	-webkit-animation: slideOutBottom 0.7s forwards ease-in-out;

	animation: slideOutBottom 0.7s forwards ease-in-out;

}



.fxPushReveal .navInNext {

	opacity: 1;

	-webkit-animation: slideInHalfFromTop 0.7s forwards ease-in-out;

	animation: slideInHalfFromTop 0.7s forwards ease-in-out;

}



.fxPushReveal .navOutPrev {

	opacity: 1;

	-webkit-animation: slideOutHalfTop 0.7s forwards ease-in-out;

	animation: slideOutHalfTop 0.7s forwards ease-in-out;

}



.fxPushReveal .navInPrev {

	opacity: 1;

	z-index: 1001;

	-webkit-animation: slideInFromBottom 0.7s forwards ease-in-out;

	animation: slideInFromBottom 0.7s forwards ease-in-out;

}



@-webkit-keyframes slideOutBottom {

	to {

		-webkit-transform: translateY(100%);

	}

}



@keyframes slideOutBottom {

	to {

		transform: translateY(100%);

	}

}



@-webkit-keyframes slideInHalfFromTop {

	from {

		-webkit-transform: translateY(-50%);

	}

	to {

		-webkit-transform: translateY(0);

	}

}



@keyframes slideInHalfFromTop {

	from {

		transform: translateY(-50%);

	}

	to {

		transform: translateY(0);

	}

}



@-webkit-keyframes slideOutHalfTop {

	to {

		-webkit-transform: translateY(-50%);

	}

}



@keyframes slideOutHalfTop {

	to {

		transform: translateY(-50%);

		filter:blur(2px);

		-webkit-filter:blur(2px);

		-moz-filter:blur(2px);

		-ms-filter:blur(2px);

		-o-filter:blur(2px);

	}

}



@-webkit-keyframes slideInFromBottom {

	from {

		-webkit-transform: translateY(100%);

	}

	to {

		-webkit-transform: translateY(0);

	}

}



@keyframes slideInFromBottom {

	from {

		transform: translateY(100%);

	}

	to {

		transform: translateY(0);

	}

}

.fxSoftPulse .navOutPrev,

.fxSoftPulse .navOutNext {

	-webkit-animation: scaleUpFadeOut 0.8s forwards ease-in;

	animation: scaleUpFadeOut 0.8s forwards ease-in;

}

.fxSoftPulse .navInPrev,

.fxSoftPulse .navInNext {

	-webkit-animation: scaleDownFadeIn 0.8s forwards ease-out;

	animation: scaleDownFadeIn 0.8s forwards ease-out;

}

@-webkit-keyframes scaleUpFadeOut {

	50% {

		-webkit-transform: scale(1.2);

		opacity: 1;

	}

	75% {

		-webkit-transform: scale(1.1);

		opacity: 0;

	}

	100% {

		-webkit-transform: scale(1);

		opacity: 0;

	}

}

@keyframes scaleUpFadeOut {

	50% {

		transform: scale(1.2);

		opacity: 1;

	}

	75% {

		transform: scale(1.1);

		opacity: 0;

	}

	100% {

		transform: scale(1);

		opacity: 0;

	}

}

@-webkit-keyframes scaleDownFadeIn {

	50% {

		opacity: 1;

		-webkit-transform: scale(1.2);

	}

	100% {

		opacity: 1;

		-webkit-transform: scale(1);

	}

}

@keyframes scaleDownFadeIn {

	50% {

		opacity: 1;

		transform: scale(1.2);

	}

	100% {

		opacity: 1;

		transform: scale(1);

	}

}

.fxEarthquake .navOutNext {

	opacity: 1;

	-webkit-animation: shakeSlideBottom 1s 0.1s forwards;

	animation: shakeSlideBottom 1s 0.1s forwards;

}

.fxEarthquake .navInNext {

	-webkit-animation: pushFromTop 1s 0.1s forwards;

	animation: pushFromTop 1s 0.1s forwards;

}

.fxEarthquake .navOutPrev {

	opacity: 1;

	-webkit-animation: shakeSlideTop 1s 0.1s forwards;

	animation: shakeSlideTop 1s 0.1s forwards;

}

.fxEarthquake .navInPrev{

	opacity: 1;

	-webkit-animation: pushFromBottom 1s 0.1s forwards;

	animation: pushFromBottom 1s 0.1s forwards;

}

.fxEarthquake li::after {

	content: '';

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	opacity: 0;

	pointer-events: none;

	background-color: rgba(0,0,0,0.3);

	-webkit-transition: opacity 0.5s;

	transition: opacity 0.5s;

}

.fxEarthquake .navOutPrev::after,

.fxEarthquake .navOutNext::after {

	opacity: 1;

}

@-webkit-keyframes shakeSlideBottom { 

	0% { -webkit-transform: translate(0px, 0px) rotate(0deg); }

	2% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	4% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	6% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); }

	8% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	10% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	12% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); }

	14% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	16% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); }

	18% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	20% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	22% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	24% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); }

	26% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); }

	28% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); }

	30% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	32% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); }

	34% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	36% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); }

	38% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	40% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); }

	42% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); }

	44% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	46% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	48% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	50% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	52% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); }

	54% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	56% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	58% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); }

	60% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); }

	62% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	64% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); }

	66% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); }

	68% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); }

	70% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); }

	100% { -webkit-transform: translateY(100%); } 

}

@keyframes shakeSlideBottom { 

	0% { transform: translate(0px, 0px) rotate(0deg); }

	2% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	4% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	6% { transform: translate(0px, 0px) rotate(-0.5deg); }

	8% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	10% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	12% { transform: translate(0px, 0px) rotate(-0.5deg); }

	14% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	16% { transform: translate(0px, 0px) rotate(-0.5deg); }

	18% { transform: translate(0px, -1px) rotate(-0.5deg); }

	20% { transform: translate(0px, -1px) rotate(-0.5deg); }

	22% { transform: translate(0px, -1px) rotate(-0.5deg); }

	24% { transform: translate(-1px, 0px) rotate(-0.5deg); }

	26% { transform: translate(0px, 0px) rotate(-0.5deg); }

	28% { transform: translate(-1px, 0px) rotate(-0.5deg); }

	30% { transform: translate(0px, -1px) rotate(-0.5deg); }

	32% { transform: translate(-1px, 0px) rotate(-0.5deg); }

	34% { transform: translate(0px, -1px) rotate(-0.5deg); }

	36% { transform: translate(0px, 0px) rotate(-0.5deg); }

	38% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	40% { transform: translate(0px, 0px) rotate(-0.5deg); }

	42% { transform: translate(-1px, 0px) rotate(-0.5deg); }

	44% { transform: translate(0px, -1px) rotate(-0.5deg); }

	46% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	48% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	50% { transform: translate(0px, -1px) rotate(-0.5deg); }

	52% { transform: translate(-1px, 0px) rotate(-0.5deg); }

	54% { transform: translate(0px, -1px) rotate(-0.5deg); }

	56% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	58% { transform: translate(0px, 0px) rotate(-0.5deg); }

	60% { transform: translate(-1px, 0px) rotate(-0.5deg); }

	62% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	64% { transform: translate(0px, -1px) rotate(-0.5deg); }

	66% { transform: translate(-1px, -1px) rotate(-0.5deg); }

	68% { transform: translate(-1px, 0px) rotate(-0.5deg); }

	70% { transform: translate(0px, 0px) rotate(-0.5deg); }

	100% { transform: translateY(100%); } 

}

.fx3dReverse .itemwrap{

    perspective : 1600px;

}

.fx3dReverse .navOutNext {

    -webkit-animation: reverseOutNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

    animation: reverseOutNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

}

.fx3dReverse .navInNext {

    -webkit-animation: reverseInNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

    animation: reverseInNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

    z-index: 1000;

}

.fx3dReverse .navOutPrev {

    -webkit-animation: reverseOutPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

    animation: reverseOutPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

}

.fx3dReverse .navInPrev {

    -webkit-animation: reverseInPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

    animation: reverseInPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

}

@media screen and (max-width: 800px){

    .fx3dReverse .navInNext,.fx3dReverse .navInPrev{

        -webkit-animation: fn1_1 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

        animation: fn1_1 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

        z-index: 1000;

    }

    .fx3dReverse .navOutPrev,.fx3dReverse .navOutNext{

        -webkit-animation: fn1_2 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

        animation: fn1_2 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);

    }

}

@keyframes reverseOutNext {

    0%{

        -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg);

        opacity: 1;

        transform-origin: 50% 50%;

    }

    100% {

        -webkit-transform: translateY(100%) translateZ(0px) rotateX(-90deg);

        opacity: 0;

        transform-origin: 50% 0%;

    }

}

@keyframes reverseInNext {

    from {

        -webkit-transform: translateY(-100%) translateZ(0px) rotateX(90deg);

        opacity: 0;

        transform-origin: 50% 100%;

    }

    to {

        -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg);

        opacity: 1;

        transform-origin: 50% 50%;

    }

}

@keyframes reverseOutPrev {

    0%{

        -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg);

        opacity: 1;

        transform-origin: 50% 50%;

    }

    100% {

        -webkit-transform: translateY(-100%) translateZ(0px) rotateX(90deg);

        opacity: 0;

        transform-origin: 50% 100%;

    }

}

@keyframes reverseInPrev {

    from {

        -webkit-transform: translateY(100%) translateZ(0px) rotateX(-90deg);

        opacity: 0;

        transform-origin: 50% 100%;

    }

    to {

        -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg);

        opacity: 1;

        transform-origin: 50% 50%;

    }

}











#tenpay_txt {

    position: fixed;

    width: 100vw;

    height: 100vh;

    overflow: hidden;

    left: 0;

    top: 0;

    z-index: 999999;

    pointer-events: none;

}



#tenpay_txt .loading_box {

    background-color: #005ca1;

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

}



.loading_case {

    position: fixed;

    background-color: #fff;

    border-radius: 100%;

    font-family: 'BrownStd-Bold';

    width: .3rem;

    height: .3rem;

    right: 101%;

    top: 50%;

    transform: translate(50%, -50%) translateZ(0);

    animation: roundCome 2s ease 0s 1 forwards;

}



.loading_case .load_v_box {

    position: fixed;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%) translateZ(0);

    height: 50vh;

    width: 50vh;

    opacity: 0;

    animation: vO .1s ease 1s 1 forwards;

}



.loading_case .loading_text {

    position: absolute;

    width: 100%;

    left: 50%;

    top: 50%;

    transform: translate(-50%, -50%) translateZ(0);

    font-size: 0;

    text-align: center;

    animation: textOur 2s cubic-bezier(0, 0.31, 0.25, 1) 3.4s 1 forwards;

}



.loading_case .loading_text > div {

    display: inline-block;

    vertical-align: middle;

    position: relative;

    font-size: .3rem;

    color: #005ca1;

}



.loading_case .loading_text > div:first-child {

    z-index: 2;

}



.loading_case .loading_text > div.load_text_box {

    animation: textCome 1s ease 2.3s 1 forwards;

    overflow: hidden;

    z-index: -1;

}



.loading_case .loading_text > div .shade_blaxk {

    position: absolute;

    left: 0;

    top: 0;

    opacity: 0;

    background-color: #fff;

    height: 100%;

    width: .23rem;

    z-index: 2;

    animation: opCome .2s ease 2.1s 1 forwards;

}



.loading_case .loading_text .load_wz_box {

    position: absolute;

    width: 4.33rem;

    height: 100%;

    right: 0;

    top: 0;

    overflow: hidden;

    animation: textComeNei 1s ease 2.4s 1 forwards;

}



.loading_case .loading_text .load_wz {

    position: absolute;

    right: 0;

    top: 0;

    width: 4.33rem;

    display: flex;

    justify-content: flex-end;

    white-space: nowrap;

}



.loading_case .loading_text .load_wz.load_zw {

    opacity: 0;

    position: relative;

}



.loading_case .sha_case {

    position:relative;

     width: 242px;

    left:50%;

    top: 50%;

    transform: translate(-50%, -50%) translateZ(0);

    text-align: center;

    

}

.loading_case .sha_case .sha_name {

    display: block;

    position: relative;

    overflow: hidden;

    width: 100%;

    text-align: center;

    margin: 0 auto;

}



.loading_case .sha_case .sha_zw {

    opacity: 0;

    display: none;

}



.loading_case .sha_case .kh_name {

    position: relative;

    left: 0;

    top: 0;

    white-space: nowrap;

    overflow: hidden;

}



.sha_name img {

    display: block;

    width: 240px;

    max-width: none;

}



.loading_case .sha_case .kh_name .sha_show {

    width: 200%;

    height: 100%;

    position: absolute;

    left: -100%;

    top: 0;

    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)70%);

    /* Safari 5.1 - 6.0 */

    background: -o-linear-gradient(right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)70%);

    /* Opera 11.1 - 12.0 */

    background: -moz-linear-gradient(right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)70%);

    /* Firefox 3.6 - 15 */

    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)70%);

    /* 鏍囧噯鐨勮娉� */

   animation: logoCome  4s ease-in .5s 1 forwards;



}





@keyframes vO {

    0% {

        opacity: 0;

    }

	40% {

        opacity: 0;

    }

    100% {

        opacity: 1;

    }

}



@keyframes roundCome {

    0% {

        top: 50%;

        right: 101%;

    }

    50% {

        right: 50%;

        width: 28px;

        height:28px;

    }

    100% {

        top: 50%;

        right: 50%;

        width: 150vw;

        height: 150vw;

    }

}



@keyframes opCome {

    0% {

        opacity: 0;

    }

    100% {

        opacity: 0.5;

    }

}



@keyframes textCome {

    0% {

        margin-left: -.23rem;

        width: 4.56rem;

    }

    100% {

        width: 2.31rem;

        padding-left: .23rem;

        margin-left: -.23rem;

    }

}



@keyframes textComeNei {

    0% {

        width: 4.33rem;

    }

    100% {

        width: 2.07rem;

    }

}



@keyframes textOur {

    0% {

        left: 50%;

        transform: translate(-50%, -50%) translateZ(0);

    }

    100% {

        left: 0;

        transform: translate(-100%, -50%) translateZ(0);

    }

}



@keyframes logoCome {

    from  {

        left:-100%;

		transform: translate(0%, 0%) translateZ(0);

       

    }

    to  {

        left:0;

		transform: translate(50%, 0%) translateZ(0);

    }

}



@keyframes logoShake {

    0% {

        transform: translate(0, 0) translateZ(0);

    }

    50% {

        transform: translate(-10px, 0px) translateZ(0);

    }

    100% {

        transform: translate(0, 0) translateZ(0);

    }

}



@keyframes khName {

    0% {

        height: 0;

        width: 0;

    }

    40% {

        height: 0;

        width: 0;

    }

    100% {

        width: 100%;

        height: 100%;

    }

}



@keyframes opOut {

    0% {

        opacity: 1; right:0%;

    }

    100% {

        opacity: 0; right:-100%;

    }

}





















