html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
    margin: 0;
    padding: 0;
}

img, fieldset {
    border: 0;
}

/* set image max width to 100% */
img {
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;
}
html{ -webkit-text-size-adjust:none;}

/************************************************************************************
GENERAL STYLING
*************************************************************************************/

a {
    color: #027B7E;
    text-decoration: none;
    outline: none;
}
a:hover {
    text-decoration:none !important;
}
p {
    padding: 0;
}

/* list */
ul, ol {

}
li {
    margin: 0 0 .5em 0;
    padding: 0;
}

/* headings */


/* reset webkit search input styles */
input[type=search] {
    -webkit-appearance: none;
    outline: none;
}
input[type="search"]::-webkit-search-decoration, 
input[type="search"]::-webkit-search-cancel-button {
    display: none;
}



body, div, dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6, pre, code,
form, fieldset, legend, input, button,
textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
    }
fieldset, img {
    border: 0;
    }
ul,ol {
    list-style:none;
    }
table {
    border-collapse:collapse;
    border-spacing:0;
    }
a{
    text-decoration:none;
    }
a:hover{
    text-decoration:underline;
    }
small {
    font-size:12px;
    }
h1,h2,h3,h4,h5,h6,button,input,select,textarea {
    font-size:100%;
    }
label,input,select,form img,button,textarea {
    vertical-align:middle;
    }
address, caption, cite, code, dfn,
em, strong, th, optgroup {
    font-style: normal;
    font-weight: normal;
    }   
input, textarea, button, a,li{-webkit-tap-highlight-color:rgba(0,0,0,0);}
.clear:after { 
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clear {
    display: inline-block;
    }
/* Hides from IE-mac \*/
* html .clear {
    height: 1%;
    } 
.clear {
    display: block;
    } 
/* End hide from IE-mac */
html,body{width:100%;height:100%;overflow-x: hidden;}
input, textarea, button, a{-webkit-tap-highlight-color:rgba(0,0,0,0);}
@font-face
{
font-family: NotoSansHans;
src: url(NotoSansHans-Light.otf);
}
.page{
  width: 1920px;
  height: auto;
  overflow-x: hidden;
  margin: 0 auto;
  position: relative;
}

.page.pages{
  width: 100%;
  height: 100%;
}

.banners_img1{
  background: url(../images/banner_img1.jpg) center no-repeat;
  width: 100%;
  height: 100%;
  position: relative;
}

.banners_img2{
  background: url(../images/banner_img2.jpg) center no-repeat;
  width: 100%;
  height: 100%;
  position: relative;
}

.banner_img2_center{
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -409.5px;
  margin-top: -277.5px;
  width: 40%;
}

.banner_img1_center{
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -409.5px;
  margin-top: -277.5px;
  width: 30%;
}

.animate_icon{
  position: absolute;
}

.banner_img3_box{
  position: relative;
  width: 100%;
  height: 100%;
  background: url(../images/banner_img3.jpg) center no-repeat;
  background-size: cover;
}

.banner_img3_pop{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 100;
  background: rgba(0,0,0,0.7);
}

.animate_icon1{
  left: 75px;
  top: 505px;
}

.animate_icon2{
  left: 360px;
  top: 390px;
}

.animate_icon3{
  left: 587px;
  top: 320px;
}

.animate_icon4{
  left: 980px;
  top: 327px;
}

.animate_icon5{
  left: 1314px;
  top: 279px;
}

.animate_icon6{
  left: 1440px;
  top: 475px;
}

.animate_icon7{
  left: 1302px;
  top: 625px;
}

.animate_icon8{
  left: 983px;
  top: 585px;
}

.animate_icon9{
  left: 745px;
  top: 555px;
}

.animate_icon10{
  left: 405px;
  top: 580px;
}

.animate_icon11{
  left: 148px;
  top: 673px;
}

.logo_box{
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  pointer-events: none;
}

.logo_box *{
  pointer-events: auto;
}

.logo{
  position: absolute;
  left: 38px;
  top: 36px;
  width: 5%;
}

.banner_words{
  position: absolute;
  left: 38px;
  width: 9%;
  bottom: 33px;
}

.menu_button{
  background: url(../images/menu_button.png) center no-repeat;
  width: 83px;
  height: 83px;
  position: absolute;
  right: 43px;
  top: 33px;
  cursor: pointer;
}

.icon_box{
  position: absolute;
  top: 50%;
  right: 40px;
  width: 67px;
  height: 118px;
  margin-top: -59px;
  text-align: right;
}

.contact_us{
  font-size: 15px;
  position: absolute;
  right: 0;
  top: 0;
  color: #fff;
  font-weight: bold;
}

.icon_weibo{
  background: url(../images/icon_weibo.png) center no-repeat;
  width: 32px;
  height: 32px;
  position: absolute;
  right: 0px;
  top: 30px;
  cursor: pointer;
}

.icon_weixin{
  background: url(../images/icon_weixin.png) center no-repeat;
  width: 32px;
  height: 32px;
  position: absolute;
  right: 0px;
  top: 78px;
  cursor: pointer;
  display: none;
}

.weixin{
  position: absolute;
  right: 0;
  top: 0;
  max-width: none;
  display: none;
}

.erweima{
  position: absolute;
  right: 36px;
  bottom: 36px;
  width: 7%;
}

.menu_pop{
  position: absolute;
  width: 325px;
  height: 100%;
  background: #1a1a1a;
  right: -325px;
  top: 0;
  z-index: 102;
}

.menu_img{
  position: absolute;
  top: 50px;
  left: 38px;
  cursor: pointer;
}

.list_box{
  position: absolute;
  left: 33px;
  /*top: 265px;*/
  top: 10%;
  height: 70%;
}

.list_box li{
  /*margin-top: 50px;*/
  margin-top: 15%;
  font-family: NotoSansHans;
}

.list_box li a{
  color: #474545;
  font-size:41px;
  font-family: NotoSansHans;
}

.list_box li a:hover{
  color: #b4b4b4;
}

.logo_box .swiper-pagination1{
  position: absolute;
  left: 50%;
  margin-left: -59px;
  bottom: 88px;
}

.logo_box .swiper-pagination .swiper-pagination-bullet{
  width: 36px;
  height: 5px;
  background: #bdbdbd;
  border-radius: 0%;
  margin-right: 5px;
  cursor: pointer;
}

.logo_box .swiper-pagination .swiper-pagination-bullet:last-child{
  margin-right: 0px;
}

.logo_box .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
  background: #c6660b;
}

.example_demo_div .swiper-pagination2{
  position: absolute;
  left: 50%;
  margin-left: -59px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination3{
  position: absolute;
  left: 50%;
  margin-left: -59px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination4{
  position: absolute;
  left: 50%;
  margin-left: -100px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination6{
  position: absolute;
  left: 50%;
  margin-left: -77px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination7{
  position: absolute;
  left: 50%;
  margin-left: -100px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination8{
  position: absolute;
  left: 50%;
  margin-left: -59px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination9{
  position: absolute;
  left: 50%;
  margin-left: -18px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination12{
  position: absolute;
  left: 50%;
  margin-left: -77px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination13{
  position: absolute;
  left: 50%;
  margin-left: -18px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination14{
  position: absolute;
  left: 50%;
  margin-left: -77px;
  bottom: -30px;
}

.example_demo_div .swiper-pagination .swiper-pagination-bullet{
  width: 36px;
  height: 5px;
  background: #bdbdbd;
  border-radius: 0%;
  margin-right: 5px;
  cursor: pointer;
}

.example_demo_div .swiper-pagination .swiper-pagination-bullet:last-child{
  margin-right: 0px;
}

.example_demo_div .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
  background: #c6660b;
}

.banner_img3_words{
  position: absolute;
  margin-left: -391px;
  left: 50%;
  top: 50%;
  margin-top: -24px;
  z-index: 103;
}

.shows_box{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.box_swiper2 .shows_box1{
  background: url(../images/show1.png) center no-repeat;
  background-size: contain;
}

.box_swiper2 .shows_box2{
  background: url(../images/show2.png) center no-repeat;
  background-size: contain;
}

.box_swiper2 .shows_box3{
  background: url(../images/show33.png) center no-repeat;
  background-size: contain;
}

.box_swiper3 .shows_box1{
  background: url(../images/case2_1.png) center no-repeat;
  /*background-size: contain;*/
  cursor: pointer;
}

.box_swiper3 .shows_box2{
  background: url(../images/case2_2.png) center no-repeat;
  background-size: contain;
}

.box_swiper3 .shows_box3{
  background: url(../images/case2_3.png) center no-repeat;
  /*background-size: contain;*/
}



.box_swiper4 .shows_box1{
  background: url(../images/case3_1.png) center no-repeat;
  background-size: contain;
}

.box_swiper4 .shows_box2{
  background: url(../images/case3_2.png) center no-repeat;
  background-size: contain;
}

.box_swiper4 .shows_box3{
  background: url(../images/case3_3.png) center no-repeat;
  background-size: contain;
}

.box_swiper4 .shows_box4{
  background: url(../images/case3_4.png) center no-repeat;
  background-size: contain;
}

.box_swiper4 .shows_box5{
  background: url(../images/case3_5.png) center no-repeat;
  background-size: contain;
}



.box_swiper6 .shows_box1{
  background: url(../images/case4_1.png) center no-repeat;
  background-size: contain;
}

.box_swiper6 .shows_box2{
  background: url(../images/case4_2.png) center no-repeat;
  background-size: contain;
}

.box_swiper6 .shows_box3{
  background: url(../images/case4_3.png) center no-repeat;
  background-size: contain;
}

.box_swiper6 .shows_box4{
  background: url(../images/case4_4.png) center no-repeat;
  background-size: contain;
}





.box_swiper7 .shows_box1{
  background: url(../images/case5_1.png) center no-repeat;
  background-size: contain;
}

.box_swiper7 .shows_box2{
  background: url(../images/case5_2.png) center no-repeat;
  background-size: contain;
}

.box_swiper7 .shows_box3{
  background: url(../images/case5_3.png) center no-repeat;
  background-size: contain;
}

.box_swiper7 .shows_box4{
  background: url(../images/case5_4.png) center no-repeat;
  background-size: contain;
}

.box_swiper7 .shows_box5{
  background: url(../images/case5_5.png) center no-repeat;
  background-size: contain;
}





.box_swiper8 .shows_box1{
  background: url(../images/case6_1.png) center no-repeat;
  background-size: contain;
}

.box_swiper8 .shows_box2{
  background: url(../images/case6_2.png) center no-repeat;
  background-size: contain;
}

.box_swiper8 .shows_box3{
  background: url(../images/case6_3.png) center no-repeat;
  background-size: contain;
}



.box_swiper9 .shows_box1{
  background: url(../images/case7_1.png) center no-repeat;
  /*background-size: contain;*/
}







.box_swiper12 .shows_box1{
  background: url(../images/case8_1.png) center no-repeat;
  background-size: contain;
}

.box_swiper12 .shows_box2{
  background: url(../images/case8_2.png) center no-repeat;
  background-size: contain;
}

.box_swiper12 .shows_box3{
  background: url(../images/case8_3.png) center no-repeat;
  background-size: contain;
}

.box_swiper12 .shows_box4{
  background: url(../images/case8_4.png) center no-repeat;
  background-size: contain;
}



.box_swiper13 .shows_box1{
  background: url(../images/case9_1.png) center no-repeat;
  /*background-size: contain;*/
}




.box_swiper14 .shows_box1{
  background: url(../images/case10_1.png) center no-repeat;
  background-size: contain;
}

.box_swiper14 .shows_box2{
  background: url(../images/case10_2.png) center no-repeat;
  background-size: contain;
}

.box_swiper14 .shows_box3{
  background: url(../images/case10_3.png) center no-repeat;
  background-size: contain;
}

.box_swiper14 .shows_box4{
  background: url(../images/case10_4.png) center no-repeat;
  background-size: contain;
}

.scale_s{
  -webkit-animation: scale_s 5s infinite ease-in-out;
  animation: scale_s 5s infinite ease-in-out; 
}

@-webkit-keyframes scale_s {
  0%{-webkit-transform: scale(1);}
  50% {-webkit-transform: scale(0.8);}
  100% {-webkit-transform: scale(1);}
}

@keyframes scale_s {
  0%{transform: scale(1);}
  50% {transform: scale(0.8);}
  100% {-webkit-transform: scale(1);}
}


.department1{
  background: url(../images/department1.png) center no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-size: cover;
}























.page.about_us{
  background: url(../images/about_us_banner.jpg) center no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  overflow-x: hidden;
}

.content{
  height: 680px;
  width: 100%;
  position: absolute;
  top: 50%;
  margin-top: -340px;
  left: 0;
  z-index: 1000;
}

.about_us_all{
  position: relative;
  left:0;
  z-index: 100;
  /*top: 50%;*/
}

.about_us_title_box{
  background: rgba(0,0,0,0.5);
  width: 100%;
}

.about_us_title{
  width: 1412px;
  height: 220px;
  margin: 0 auto;
  position: relative;
}

.about_us_year_box{
  width: 100%;
  height: 447px;
  margin-top: 12px;
  position: relative;
}

.left_square{
  width: 230px;
  height: 100%;
  background: rgba(0,0,0,0.66);
  position: absolute;
  left: 0;
  top: 0;
}

.right_square{
  width: 223px;
  height: 100%;
  background: rgba(0,0,0,0.66);
  position: absolute;
  right: 0;
  top: 0;
}

.about_us_img{
  position: absolute;
  left: 45px;
  top: 40px;
}

.about_us_words{
  width: 880px;
  text-align: justify;
  color: #fff;
  font-size: 14px;
  position: absolute;
  right: 10px;
  top: 85px;
  line-height: 150%;
}

.year_unit{
  background: rgba(0,0,0,0.66);
  width: 710px;
  position: relative;
  height: 218px;
  left: 0;
  top: 0;
  color: #fff;
  overflow: hidden;
  float: left;
  margin-left: 10px;
  margin-bottom: 12px;
}

.year_unit:nth-child(2n-1){
  margin-left: 0px;
}

.years{
  position: absolute;
  bottom: 10px;
  right: 5px;
}

.about_us_year{
  width: 1430px;
  height: 220px;
  margin: 0 auto;
  position: relative;
}

.year_unit_words{
  line-height: 150%;
  font-family: SimHei;
  margin-left: 37px;
  margin-top: 35px;
}



























.page.product{
  width: 100%;
  background: url(../images/product_bg.jpg) center no-repeat;
  height: 100%;
  overflow-x: hidden;
}

.product_box{
  width: 1315px;
  margin: 273px auto 0px;
  z-index: 1000;
  position: relative;
  top: 50%;
}

.product_left{
  float: left;
  width: 540px;
}

.product_choose{
  width: 260px;
  height: 260px;
  float: left;
  background: #2d2d2d;
  cursor: pointer;
}

.center_img_box{
  width: 260px;
  height: 260px;
  display: table;
  text-align:center; 
  vertical-align:middle;
}

.center_span{
  display:table-cell;
  vertical-align:middle;
}

.product_choose:nth-child(2n-1){
  margin-right: 20px;
  margin-bottom: 20px;
}

.product_choose:hover,.product_choose.focus{
  width: 260px;
  height: 260px;
  float: left;
  background: #474646;
}

.product_right{
  width: 645px;
  float: right;
  font-weight: bold;
  height: 560px;
  position: relative;
}

.product_instro{
  position: absolute;
  right: 0;
  top: 0;
}

.product_title{
  color: #b4b4b4;
  font-size: 31px;
  margin-bottom: 12px;
}

.product_words{
  color: #b4b4b4;
  font-size: 14px;
  text-align: justify-all;
}

.product_img{
  width: 680px;
  height: 430px;
  margin-top: 15px;
  overflow:hidden;
}

.product_img .mCSB_scrollTools .mCSB_draggerRail{
  background: #3b3b3b;
}

.product_img .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  background: #3b3b3b;
  width: 14px;
  height: 45px;
  border-radius:0px;
}





































.page.service{
  width: 100%;
  background: url(../images/product_bg.jpg) center no-repeat;
  height: 100%;
  overflow-x: hidden;
  position: relative;
}

.service_box{
  width: 80%;
  margin: 0 auto;
  position: relative;
  top: 50%;
}

.service_unit{
  float: left;
  width: 18%;
  margin-right: 2%;
  margin-bottom: 20px;
  /*cursor: pointer;*/
}

.service_unit:nth-child(5n){
  margin-right: 0px;
}


























.example_box{
  width: 100%;
  height: 100%;
}


.example_unit{
  width: 20%;
  height: 33.33%;
  float: left;
  cursor: pointer;
}

.example_unit1{
  background: url(../images/an_icon_01.jpg) center no-repeat;
  background-size: cover;
  cursor: default;
}

.example_unit2{
  background: url(../images/an_icon_02.jpg) center no-repeat;
  background-size: cover;
}

.example_unit3{
  background: url(../images/an_icon_03.jpg) center no-repeat;
  background-size: cover;
}

.example_unit4{
  background: url(../images/an_icon_04.jpg) center no-repeat;
  background-size: cover;
}

.example_unit5{
  background: url(../images/an_icon_05.jpg) center no-repeat;
  background-size: cover;
  cursor: default;
}

.example_unit6{
  background: url(../images/an_icon_06.jpg) center no-repeat;
  background-size: cover;
}

.example_unit7{
  background: url(../images/an_icon_07.jpg) center no-repeat;
  background-size: cover;
}

.example_unit8{
  background: url(../images/an_icon_08.jpg) center no-repeat;
  background-size: cover;
}

.example_unit9{
  background: url(../images/an_icon_09.jpg) center no-repeat;
  background-size: cover;
}

.example_unit10{
  background: url(../images/an_icon_10.jpg) center no-repeat;
  background-size: cover;
  cursor: default;
}

.example_unit11{
  background: url(../images/an_icon_11.jpg) center no-repeat;
  background-size: cover;
  cursor: default;
}

.example_unit12{
  background: url(../images/an_icon_12.jpg) center no-repeat;
  background-size: cover;
}

.example_unit13{
  background: url(../images/an_icon_13.jpg) center no-repeat;
  background-size: cover;
}

.example_unit14{
  background: url(../images/an_icon_14.jpg) center no-repeat;
  background-size: cover;
}

.example_unit15{
  background: url(../images/an_icon_15.jpg) center no-repeat;
  background-size: cover;
  cursor: default;
}


/*.example_unit1:hover,.example_unit1.focus{
  background: url(../images/liang_icon_01.jpg) center no-repeat;
  background-size: cover;
}*/

.example_unit2:hover,.example_unit2.focus{
  background: url(../images/liang_icon_02.jpg) center no-repeat;
  background-size: cover;
}

.example_unit3:hover,.example_unit3.focus{
  background: url(../images/liang_icon_03.jpg) center no-repeat;
  background-size: cover;
}

.example_unit4:hover,.example_unit4.focus{
  background: url(../images/liang_icon_04.jpg) center no-repeat;
  background-size: cover;
}

/*.example_unit5:hover,.example_unit5.focus{
  background: url(../images/liang_icon_05.jpg) center no-repeat;
  background-size: cover;
}*/

.example_unit6:hover,.example_unit6.focus{
  background: url(../images/liang_icon_06.jpg) center no-repeat;
  background-size: cover;
}

.example_unit7:hover,.example_unit7.focus{
  background: url(../images/liang_icon_07.jpg) center no-repeat;
  background-size: cover;
}

.example_unit8:hover,.example_unit8.focus{
  background: url(../images/liang_icon_08.jpg) center no-repeat;
  background-size: cover;
}

.example_unit9:hover,.example_unit9.focus{
  background: url(../images/liang_icon_09.jpg) center no-repeat;
  background-size: cover;
}

/*.example_unit10:hover,.example_unit10.focus{
  background: url(../images/liang_icon_10.jpg) center no-repeat;
  background-size: cover;
}

.example_unit11:hover,.example_unit11.focus{
  background: url(../images/liang_icon_11.jpg) center no-repeat;
  background-size: cover;
}*/

.example_unit12:hover,.example_unit12.focus{
  background: url(../images/liang_icon_12.jpg) center no-repeat;
  background-size: cover;
}

.example_unit13:hover,.example_unit13.focus{
  background: url(../images/liang_icon_13.jpg) center no-repeat;
  background-size: cover;
}

.example_unit14:hover,.example_unit14.focus{
  background: url(../images/liang_icon_14.jpg) center no-repeat;
  background-size: cover;
}

/*.example_unit15:hover,.example_unit15.focus{
  background: url(../images/liang_icon_15.jpg) center no-repeat;
  background-size: cover;
}*/

.pops_example{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.7);
  z-index: 100;
}

.introduction{
  width: 60%;
  height: 69.4%;
  margin: 0 auto;
  position: relative;
  top: 50%;
}

.intro_left{
  width: 52.7%;
  float: left;
  height: 100%;
}

.intro_right{
  width: 47.3%;
  float: left;
  height: 100%;
  background: #212121;
  text-align: center;
}

.intro_title{
  height: 60%;
  width: 100%;
  text-align: center;
  background: #2a2929;
}

.intro_con{
  height: 40%;
  width: 100%;
}

.intro_title img{
  width: 20.5%;
  margin-top: 7.1%;
}

.intro_title .ex_t_t{
  font-size: 3em;
  color: #cccccc;
  margin-left: 4%;
  display: block;
  text-align: left;
  margin-top: 15%;
}

.intro_title .ex_keywords{
  font-size: 1.5em;
  color: #cccccc;
  margin-left: 4%;
  display: block;
  text-align: left;
  margin-top: 4%;
}

.l_con{
  background: #302f2f;
  color: #cccccc;
  float: left;
  height: 100%;
  width: 33.33%;
}

.c_con{
  background: #4b4a4a;
  color: #cccccc;
  float: left;
  height: 100%;
  width: 33.33%;
}

.r_con{
  background: #5a5a5a;
  color: #cccccc;
  float: left;
  height: 100%;
  width: 33.33%;
}

.intro_con div span{
  font-size: 1.5em;
  display: block;
  font-weight: bold;
  margin-top: 25%;
  margin-bottom: 5%;
  margin-left: 1em;
}

.con_words{
  box-sizing: border-box;
  padding-left: 1em;
  padding-right: 1em;
  text-align: justify;
}

.close_intro_button{
  width: 4em;
  height: 4em;
  background: url(../images/close_button.png) left top no-repeat;
  position: absolute;
  right: -4em;
  top: 0;
  cursor: pointer;
}

.intro_right{
  background: #212121;
  position: relative;
}

.intro_right .swiper-slide img{
  vertical-align: middle;
}

.show_img_box{
  width: 47.3%;
  height: 78.6%;
  margin: 12% auto;
}

.intro_right .swiper-pagination{
  position: absolute;
  left: 50%;
  margin-left: -59px;
  bottom: 7%;
}

.intro_right .swiper-pagination .swiper-pagination-bullet{
  width: 36px;
  height: 5px;
  background: #bdbdbd;
  border-radius: 0%;
  margin-right: 5px;
  cursor: pointer;
}

.intro_right .swiper-pagination .swiper-pagination-bullet:last-child{
  margin-right: 0px;
}

.intro_right .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
  background: #c6660b;
}

.example_demo{
  margin: 0 auto;
  display: block;
  width: 60%;
  position: relative;
  top: 50%;
}

.example_demo_div{
  margin: 0 auto;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
}

.box_swiper2{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper3{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper4{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper6{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper7{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper8{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper9{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper12{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper13{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}

.box_swiper14{
  height: 80%;
  position: absolute;
  top: 50%;
  right: 8%;
}


.pops_video{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 10000;
}


#example_video_1{
  margin: 0 auto;
  position: relative;
  /*top: 50%;
  margin-top: -347.5px;*/
}

.play_btn{
  position: absolute;
  top: 50%;
  margin-top: -50px;
  left: 50%;
  margin-left: -50px;
  cursor: pointer;
}

.back_btn{
  position: absolute;
  right: -59px;
  top: 0;
  width: 59px;
  height: 56px;
  background: url(../images/back_btn.png) left top no-repeat;
  cursor: pointer;
}

.video_box{
  width: 1165px;
  height: 695px;
  margin: 0 auto;
  position: relative;
  top: 50%;
  margin-top: -347.5px;
}





















.page.join{
  width: 100%;
  background: url(../images/product_bg.jpg) center no-repeat;
  height: 100%;
  overflow-x: hidden;
  position: relative;
}

.join_box{
  width: 1230px;
  margin: 0 auto;
  position: relative;
  top: 50%;
  height: 768px;
}

.join_left{
  float: left;
  width: 575px;
  position: relative;
  height: 768px;
  
}

.join_right{
  float: left;
  width: 650px;
  position: relative;
  height: 708px;
  border-left: 1px solid #ec7c23;
}

.join_us_img{
  position: absolute;
  top: 50%;
  right: 105px;
  margin-top: -90px;
}

.cloud{
  position: absolute;
}

.cloud1{
  left: 23px;
  top: 183px;
}

.cloud2{
  left: 23px;
  top: 122px;
}
.cloud3{
  left: 173px;
  top: 135px;
}

.cloud4{
  left: 235px;
  top: 85px;
}

.cloud5{
  left: 205px;
  top: 231px;
}

.cloud6{
  left: 58px;
  top: 470px;
}
.cloud7{
  left: 161px;
  top: 441px;
}

.cloud8{
  left: 150px;
  top: 511px;
}

.cloud9{
  left: 238px;
  top: 558px;
}

.cloud10{
  left: 336px;
  top: 500px;
}
.cloud11{
  left: 402px;
  top: 446px;
}

.position_box{
  margin-left: 74px;
  padding-top: 70px;
}

.apply{
  width: 212px;
  height: 36px;
  background: url(../images/shenqing1.png) center no-repeat;
  margin-top: 37px;
  margin-bottom: 10px;
  border: 1px solid #363636;
  display: block;
}

.position_unit{
  width: 580px;
  height: 58px;
  line-height: 58px;
  font-size: 18px;
  color: #ccc;
  border-bottom: 1px solid #363636;
  cursor: pointer;
}

.mail_address{
  position: absolute;
  margin-left: -307.5px;
  left: 50%;
  bottom: 10px;
}

.jiantou{
  background: url(../images/jiantou.png) center no-repeat;
  width: 7px;
  height: 4px;
  float: right;
  margin-right: 5px;
  position: relative;
  top: 25px;
  right: 5px;
}

.focus .jiantou{
  background: url(../images/jiantou_shang.png) center no-repeat;
}

.show_more{
  width: 100%;
  font-weight: normal;
  font-size: 14px;
}

.cloud_move{
   animation:cloud_move 8s linear infinite;
  -webkit-animation:cloud_move 8s linear infinite;
}

.cloud_move1{
   animation:cloud_move 8s 2s linear infinite;
  -webkit-animation:cloud_move 8s 2s linear infinite;
}

.cloud_move2{
   animation:cloud_move 8s 4s linear infinite;
  -webkit-animation:cloud_move 8s 4s linear infinite;
}

.cloud_move3{
   animation:cloud_move 8s 3s linear infinite;
  -webkit-animation:cloud_move 8s 3s linear infinite;
}

@keyframes cloud_move{
  0% {
     transform:translate(8px,12px)
  }
  25% {
      transform:translate(16px,0px)
  }
  50% {
      transform:translate(8px,-12px)
  }
  75% {
      transform:translate(-8px,0px)
  }
  100% {
      transform:translate(8px,12px)
  }
}
@-webkit-keyframes cloud_move{
  0% {
     -webkit-transform:translate(8px,12px)
  }
  25% {
      -webkit-transform:translate(16px,0px)
  }
  50% {
      -webkit-transform:translate(8px,-12px)
  }
  75% {
      -webkit-transform:translate(-8px,0px)
  }
  100% {
      -webkit-transform:translate(8px,12px)
  }
}


.position_name,.position_name_en{
  font-size: 18px;
  
}

.position_name_en{
  opacity: 0;
}

.position_instro{
  font-size: 14px;
  margin-right: 10px;
  margin-bottom: 30px;
  display: inline-block;
}

.position_page{
  line-height: 200%;
  
}

































.page.intro{
  width: 100%;
  background: url(../images/product_bg.jpg) center no-repeat;
  height: 100%;
  overflow-x: hidden;
  position: relative;
}

.intro_swiper_box{
  width: 1080px;
  margin: 0 auto 0px;
  position: relative;
  height: 824px;
  top: 50%;
  margin-top: -412px;
}

.person_unit{
  float: left;
}

.department{
  width: 100%;
  text-align: center;
  margin-bottom: 100px;
}

.person_unit div{
  font-size: 12.3px;
  color:#ccc;
  text-align: center;
  line-height: 150%;
}

.person_unit span{
  font-size: 37px;
  color:#fca24d;
  text-align: center;
  display: block;
  margin-top: 20px;
}

.left_button{
  width: 45px;
  height: 85px;
  background: url(../images/left_big_jiantou.png) center no-repeat;
  position: absolute;
  top: 50%;
  margin-top: -42.5px;
  left: -135px;
  cursor: pointer;
}

.right_button{
  width: 45px;
  height: 85px;
  background: url(../images/right_big_jiantou.png) center no-repeat;
  position: absolute;
  top: 50%;
  margin-top: -42.5px;
  right: -135px;
  cursor: pointer;
}


















@media screen and (max-width:1605px){
  .scale_sp{
    -webkit-transform:scale(0.9);
    transform: scale(0.9);
  }

  .menu_pop{
    position: absolute;
    width: 300px;
    height: 100%;
    background: #1a1a1a;
    right: -300px;
    top: 0;
    z-index: 102;
  }

  .animate_icon1{
    left: -19px;
    top: 505px;
  }

  .animate_icon2{
    left: 315px;
    top: 390px;
  }

  .animate_icon3{
    left: 542px;
    top: 320px;
  }

  .animate_icon4{
    left: 935px;
    top: 327px;
  }

  .animate_icon5{
    left: 1224px;
    top: 279px;
  }

  .animate_icon6{
    left: 1260px;
    top: 475px;
  }

  .animate_icon7{
    left: 1223px;
    top: 625px;
  }

  .animate_icon8{
    left: 890px;
    top: 585px;
  }

  .animate_icon9{
    left: 700px;
    top: 555px;
  }

  .animate_icon10{
    left: 360px;
    top: 580px;
  }

  .animate_icon11{
    left: 103px;
    top: 673px;
  }
}

@media screen and (max-width:1370px){
  .scale_sp{
    -webkit-transform:scale(0.80);
    transform: scale(0.80);
  }

  .menu_pop{
    position: absolute;
    width: 270px;
    height: 100%;
    background: #1a1a1a;
    right: -270px;
    top: 0;
    z-index: 102;
  }

  .menu_button{
    width: 70px;
    height: 70px;
    background-size: cover;
  }

  .icon_box{
    -webkit-transform:scale(0.9);
    transform:scale(0.9);
  }

  .content{
    -webkit-transform:scale(0.7);
    transform:scale(0.7);
    margin-top: -305px;
  }

  .list_box li{
    margin-top:10%;
  }

  .left_square{
    left: -315px;
    width: 300px;
  }

  .right_square{
    right: -298px;
  }

  /*.erweima{
    width: 100px;
    height: 100px;
  }*/

  .about_us_words{
    width: 850px;
    right: -15px;
    font-size: 16px;
    /*-webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;*/
  }

  .product_box{
    -webkit-transform:scale(0.8);
    transform:scale(0.8);
  }

  .intro_swiper_box{
    -webkit-transform:scale(0.8);
    transform:scale(0.8);
  }

  .join_box{
    -webkit-transform:scale(0.8);
    transform:scale(0.8);
  }

  .video_box{
    -webkit-transform:scale(0.8);
    transform:scale(0.8);
  }

  .show_img_box{
    margin: 20% auto;
  }

  .about_us_title_box{
    width: 145%;
    position: relative;
    left: -291px;
  }

  .close_intro_button{
    width: 3em;
    height: 3em;
    background: url(../images/close_button.png) left top no-repeat;
    position: absolute;
    right: -3em;
    top: 0;
    background-size: cover;
    cursor: pointer;
  }

  .animate_icon1{
    left: -119px;
    top: 505px;
  }

  .animate_icon2{
    left: 215px;
    top: 390px;
  }

  .animate_icon3{
    left: 442px;
    top: 320px;
  }

  .animate_icon4{
    left: 835px;
    top: 327px;
  }

  .animate_icon5{
    left: 1124px;
    top: 279px;
  }

  .animate_icon6{
    left: 1080px;
    top: 457px;
  }

  .animate_icon7{
    left: 1123px;
    top: 625px;
  }

  .animate_icon8{
    left: 790px;
    top: 585px;
  }

  .animate_icon9{
    left: 600px;
    top: 555px;
  }

  .animate_icon10{
    left: 260px;
    top: 580px;
  }

  .animate_icon11{
    left: 3px;
    top: 605px;
  }


  .intro_title .ex_t_t{
    font-size: 2em;
    color: #cccccc;
    margin-left: 4%;
    display: block;
    text-align: left;
    margin-top: 15%;
  }

  .intro_title .ex_keywords{
    font-size: 1em;
    color: #cccccc;
    margin-left: 4%;
    display: block;
    text-align: left;
    margin-top: 4%;
  }

  .l_con{
    background: #302f2f;
    color: #cccccc;
    float: left;
    height: 100%;
    width: 33.33%;
  }

  .c_con{
    background: #4b4a4a;
    color: #cccccc;
    float: left;
    height: 100%;
    width: 33.33%;
  }

  .r_con{
    background: #5a5a5a;
    color: #cccccc;
    float: left;
    height: 100%;
    width: 33.33%;
  }

  .intro_con div span{
    font-size: 1em;
    display: block;
    font-weight: bold;
    margin-top: 25%;
    margin-bottom: 5%;
    margin-left: 1em;
  }

  .con_words{
    box-sizing: border-box;
    padding-left: 1em;
    padding-right: 1em;
    font-size: 0.8em;
    text-align: justify;
  }
}


@media screen and (max-width:1285px){
  .scale_sp{
    -webkit-transform:scale(0.80);
    transform: scale(0.80);
  }

  .left_square{
    left: -400px;
  }

  .about_us_year{
    left: -86px;
  }

  .product_box{
    -webkit-transform:scale(0.7);
    transform: scale(0.7);
  }

  .intro_swiper_box{
    -webkit-transform:scale(0.7);
    transform:scale(0.7);
  }

  .join_box{
    -webkit-transform:scale(0.7);
    transform:scale(0.7);
  }

  .video_box{
    -webkit-transform:scale(0.7);
    transform:scale(0.7);
  }

  .animate_icon1{
    left: -119px;
    top: 505px;
  }

  .animate_icon2{
    left: 215px;
    top: 390px;
  }

  .animate_icon3{
    left: 442px;
    top: 320px;
  }

  .animate_icon4{
    left: 835px;
    top: 327px;
  }

  .animate_icon5{
    left: 1058px;
    top: 279px;
  }

  .animate_icon6{
    left: 990px;
    top: 457px;
  }

  .animate_icon7{
    left: 1123px;
    top: 625px;
  }

  .animate_icon8{
    left: 790px;
    top: 585px;
  }

  .animate_icon9{
    left: 600px;
    top: 555px;
  }

  .animate_icon10{
    left: 260px;
    top: 580px;
  }

  .animate_icon11{
    left: 3px;
    top: 605px;
  }
}



@media screen and (max-width:1035px){
  .scale_sp{
    -webkit-transform:scale(0.80);
    transform: scale(0.80);
  }

  .about_us_title_box {
    width: 167%;
    position: relative;
    left: -344px;
  }

  .left_square{
    left: -501px;
  }

  .content {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    margin-top: -326px;
  }

  .right_square {
    right: -458px;
  }

  .about_us_year {
    left: -185px;
  }

  .product_box {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    margin-left: -152px;
  }

  .con_words{
    font-size: 12px;
  }

  .intro_title{
    height: 55%;
  }

  .intro_con{
    height: 45%;
  }

  .intro_title .ex_t_t{
    margin-top: 25%;
  }

  .show_img_box{
    margin: 47% auto;
  }

  .intro_swiper_box{
    -webkit-transform:scale(0.6);
    transform:scale(0.6);
    margin-left: -38px;
  }

  .join_box{
    -webkit-transform:scale(0.6);
    transform:scale(0.6);
    margin-left: -102px;
  }

  .video_box{
    -webkit-transform:scale(0.6);
    transform:scale(0.6);
    margin-left: -89px;
  }

  .animate_icon1{
    left: -125px;
    top: 505px;
  }

  .animate_icon2{
    left: 115px;
    top: 390px;
  }

  .animate_icon3{
    left: 342px;
    top: 320px;
  }

  .animate_icon4{
    left: 677px;
    top: 327px;
  }

  .animate_icon5{
    left: 918px;
    top: 279px;
  }

  .animate_icon6{
    left: 711px;
    top: 457px;
  }

  .animate_icon7{
    left: 896px;
    top: 625px;
  }

  .animate_icon8{
    left: 618px;
    top: 585px;
  }

  .animate_icon9{
    left: 441px;
    top: 555px;
  }

  .animate_icon10{
    left: 160px;
    top: 580px;
  }

  .animate_icon11{
    left: -93px;
    top: 605px;
  }
}


@media screen and (max-width:965px){
  .scale_sp{
    -webkit-transform:scale(0.75);
    transform: scale(0.75);
  }
}