@import url("reset.css");
@charset "UTF-8";

@media (max-width:1800px){

}

@media (max-width:1660px){
  section.autoplayVideo{height:860px;}
  body h1{font-size:32px;}
  body h2{font-size:26px;}

  body #pageWarp h1{font-size:30px;}
}

@media (max-width:1440px){
	  body h1{font-size:30px;}
	   body h2{font-size:24px;}
	    body h3{font-size:20px;}
  .busPro_l strong{font-size:80px;}
  .busPro_l span{font-size:24px;}
  .titfont40{font-size: 36px;}
  .titfont30{font-size:22px;}
  .titfont20{ font-size: 18px;}

  section.autoplayVideo{height:760px;}
}

@media (max-width:1360px){

}

@media (max-width:1280px){


	body #pageWarp h1{font-size:26px;}
	  body h1{font-size:26px;}
	  body h2{font-size:22px;}
	 body h3{font-size:18px;}
  body h4{font-size:16px;}
  section.autoplayVideo{height: 720px;}
}

@media (max-width:1024px){
  .w1024{
    display: none;
  }
  .ipad_show{display: block;} .ipad_hide{ display: none;}
  .flex_w_ipad{ flex-wrap: wrap;}
  .flex_column_ipad{flex-direction: column;}
  #header{height:76px;}
.logoBtn{ padding:0;}
   .logoBtn a{width:130px;}
  .sloganBox .container{padding-right:10%;padding-left:10%;padding-top: 2%;}
  ul.visionUl{ top: -50px;}
  .footLogoBox{display: flex;justify-content: space-between;padding-right: 0px; border-right: none; margin-bottom: 40px;}
  .footLogoBox .footetTXt{padding-top: 0px; text-align: right; font-weight: 600;}
  .footerNav{padding-left: 0px;}
  .footernavUl li{ width: 100%; padding: 10px 0px; border-bottom: 1px solid #C9C9C9;border-left:none;}
  .footernavUl .slideBox{position: relative; display: none;}
.footernavUl li a.bg_a{justify-content:space-between;display: flex;align-items: center;}
.footernavUl .slideBox a{ text-align:left;}
  .header_bot{ padding:15px 0px;}
  ul.langUl{ display:none;}
    .navBox ul.langUl{padding-left:0px;display:flex; position:absolute; bottom:20px; left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);}
	.navBox ul.langUl li a{ color:#ffffff;}
	.navBox ul.langUl li:hover a, .navBox ul.langUl li.active a{background: #000000;}
  .navBox{
    /*display: none;*/
    opacity: 0;
    position: fixed;
    width: 100vw;
    height: calc(100vh - 76px);
    top:76px;
    left: 0px;
    background: #59B3A3;
    align-items: center;display: flex;flex: auto;
    padding: 50px 0 70px 0px;
    transform:translateX(100%);
    -moz-transform:translateX(100%);
    -ms-transform:translateX(100%);
    -webkit-transform:translateX(100%);
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
  }
  .navBox.active{
    opacity: 1;
    transform:translateX(0);
    -moz-transform:translateX(0);
    -ms-transform:translateX(0);
    -webkit-transform:translateX(0);
  }
  .navBox ul.navUl li:hover .slideBox{
    display: none;
  }
  ul.navUl{ flex-wrap: wrap; font-size: 16px;}
  ul.navUl li{ width: 100%; text-align: center; padding:0px;}
  ul.navUl li a.bg_a{ padding:15px 0px; text-transform: capitalize; font-size: 16px; color: #fff;}
ul.navUl li a.bg_a br{ display:none;}
.footernavUl li a.bg_a br{ display:none;}
  ul.navUl li.current a.bg_a{
    background: #000000;
  }
  ul.navUl li .slideBox{
    position: relative;
    text-align: center;
    top: auto;
    background: #fff;
  }
  ul.navUl li .slideBox a{ color: #000!important; font-size: 14px;}
  ul.navUl li.current{background: #000;}
  ul.navUl li.current a.bg_a, ul.navUl li:hover a.bg_a{color: #fff;}
  .scrollBox{
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
  }

  section.autoplayVideo{height:580px;}

  .pageBanner{padding:100px 0px 60px 0px;}

  ul.partnerUl li{ width: 100%;}
  ul.partnerUl li:last-child{margin-bottom: 0px;}
  ul.partnerUl li dl dt img{ max-width: 70%;}


  .busPro_l strong{font-size:60px;}
  .busPro_l span{font-size:22px;}
  .titfont40{font-size: 32px;}
  .titfont30{font-size:20px;}
  .titfont20{ font-size: 16px;}


  .busServeText{padding: 50px 30px;}

  ul.newCenterUl li{width: 50%;}
  ul.boardUl li{width: 50%;}
  .boardDeatil{width: calc(100% * 2);}
  .boardDeatil.Item3 {
    left: 0px;
   }
  .boardDeatil.Item4 {
    left: -100%;
  }
}


@media (max-width:992px){
  .w990{
    display: none;
  }

  :root{
    --visionW:180px;
    --visionH:180px;
	--valueW: 165px;
    --valueH: 185px;
  }
  .Padbot150{padding-bottom: 120px;}
  section.autoplayVideo {
    height: 520px;
  }
  a.linkMore{padding: 10px 20px;}
  .sloganBox::before,
  .sloganTxt{width: 70%;}
  .visionMain{padding-top: calc(var(--visionW)/2 + 120px);}


  ul.visionUl li dl{ padding: 0px 10px; width: 100%;
    height: 100%;
    display: flex;
    align-items: center;}
  ul.visionUl li dl dd{
    position: absolute;
    width: 100%;
    right: 0px;
    left: 0px;
    display: none;
    padding: 0px 20px;
  }
  li.visionItem3.active dl dt, li.visionItem3:hover dl dt,
  li.visionItem2.active dl dt, li.visionItem2:hover dl dt,
  li.visionItem1.active dl dt, li.visionItem1:hover dl dt{display: none;}
  li.visionItem3.active dl dd, li.visionItem3:hover dl dd,
  li.visionItem2.active dl dd, li.visionItem2:hover dl dd,
  li.visionItem1.active dl dd, li.visionItem1:hover dl dd{display: block;}

ul.valueLinxUl{ max-width:520px;}
  ul.valueLinxUl li.valueLinx1{margin-left:2%;}
  ul.valueLinxUl li.valueLinx2{margin-right:2%;}

  ul.valueLinxUl li.valueLinx3,ul.valueLinxUl li.valueLinx4,ul.valueLinxUl li.valueLinx5,ul.valueLinxUl li.valueLinx6,ul.valueLinxUl li.valueLinx7{margin-top: -40px;}
  ul.valueLinxUl li .popBgdiv{background: url(../images/valueIconBG.png) center no-repeat;
    background-size: 100% 100%;}
  ul.valueLinxUl li.active .popBgdiv, ul.valueLinxUl li:hover .popBgdiv {
    background: url(../images/valueIconBG_h.png) center no-repeat;
    background-size: 100% 100%;
  }

  .boardDiv{padding-left: 0px; border-left: none;}

  .busPro_r,
  .busPro_l{ width: 100%;}
  .productrSLideIpad{padding-top: 30px; display: none;}
  .busProductItem{padding: 30px 30px;}

   .busServeText, .busServeImg{width: 100%;}
  .busServeText{
    position: absolute;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 3;
  }

  ul.irEsgUl li{ width: 50%;}

  ul.newCenterUl{width: calc(100% + 20px); margin-left: -10px;}
  ul.newCenterUl li{padding: 0px 10px;}

}

@media (max-width:768px){
  .w768{
    display: none;
  }

}

@media (max-width:680px){
	.container {padding-right:15px;padding-left:15px;}
  .ph_show{ display: block; } .ph_hide{ display: none;}
  :root{
    --valueW: 110px;
    --valueH: 120px;
  }
  #ver-tc,
  #ver-en{font-size: 14px; line-height: 1.4;}
  .Padbot100 {padding-bottom: 80px;}
  .Padbot180{ padding-bottom: 120px}
  .Padbot60 {
    padding-bottom: 40px;
  }
  #header{height: 60px;}
  .header_bot { padding:10px 0px; }
.header_top{ padding:5px 0;}
  body #pageWarp h1{font-size:20px;}
  body h1{font-size:14px;}
   body h2{font-size:20px;}
    body h3{font-size:16px;}
  .font_sm{font-size: 12px;}
  a.linkMore{ font-size:12px;padding:8px 15px;}
  h2.titleH2{padding-bottom:10px;}
  h2.titleH2::after{height:2px;width:40px;   margin-left: -20px;}
.sloganBox .container{ padding-left:15px;padding-right:15px}
.LineBlock{margin-bottom:15px;}
  .logoBtn a{width: 110px;}
  .footLogoBox .logoBtn a{width:100px;}
  .navBox{height: calc(100vh - 60px);top:60px;}

  section.autoplayVideo{ height: 330px;}
.Padbot40{ padding-bottom:20px;}
  .visionMain{padding-top:150px;}
  ul.visionUl{top: -20px;}
  ul.visionUl li{ width:100px; height:100px;}
  ul.visionUl li dl dt{ width: 50px; height: 50px;}
  ul.visionUl li dl dd{font-size: 10px; padding:20px 2px;    line-height: 1.2;}
  ul.visionUl li::before{height: 3px;}

  ul.boardUl li dl dd{padding: 20px 0px 20px 20px;}

  ul.valueLinxUl {max-width: 310px;width:310px}
  ul.valueLinxUl li{ width:100px; height:120px; margin: 0px; }
  ul.valueLinxUl li .popBgdiv{padding:40px 0px;}
  ul.valueLinxUl li .popBgdiv dl dt{height: 30px;}
  ul.valueLinxUl li .popBgdiv dl dd{font-size: 12px;}
  ul.valueLinxUl li.valueLinx3, ul.valueLinxUl li.valueLinx4, ul.valueLinxUl li.valueLinx5, ul.valueLinxUl li.valueLinx6, ul.valueLinxUl li.valueLinx7 {
    margin-top: -30px;
  }
  ul.valueLinxUl li .popBgdiv {
    background: url(../images/valueIconBG.png) center no-repeat;
    background-size: 110% 100%;
  }
  ul.valueLinxUl li.active .popBgdiv, ul.valueLinxUl li:hover .popBgdiv {
    background: url(../images/valueIconBG_h.png) center no-repeat;
    background-size: 110% 100%;
  }

  .missionSlideMain{width: 100%; margin-left: 0px;}

  span.logoTitBtn{width: 30px; margin-right: 10px;}
  .pageBanner{padding:80px 0px 40px 0px;}

  .busPro_l strong{font-size:40px;}
  .busPro_l span{font-size:20px;}
  .titfont40{font-size: 24px;}
  .titfont30{font-size:18px;}
  .titfont20{ font-size:14px;}
  .busProductItem{padding: 30px 20px;}
  .busPro_r ul li span{ padding-bottom: 10px;}


  .busServesItem{margin-bottom: 20px;}
  ul.gongsiUl li b{font-size: 10px;zoom: 0.7;}
  .busServeText{padding: 50px 20px;}
  ul.gongsiUl li p strong{ font-size:30px;}
  ul.gongsiUl li p span{ font-size: 20px;}

  .busServesSect .container{padding: 0px;}


  ul.annList li dl.annlistDL{ padding: 30px 20px;}

  ul.newCenterUl,
  ul.irEsgUl{width: calc(100% + 20px); margin-left: -10px;}
  ul.newCenterUl li,
  ul.irEsgUl li{padding: 0px 10px;}


  ul.irFaqUl li .irFatitleBx strong{ font-size: 15px;}


  .irEnquBoxBG{
    background: url(../images/ir/enquiryIcon.png) bottom right no-repeat;
    background-size: 120px auto;
  }

  ul.newCenterUl{width: 100%; margin-left: 0px;}
  ul.newCenterUl li{padding: 0px 0px; width: 100%;}

  ul.newCenterUl.newCenterDetailUl li dl{ padding: 30px 10px;}

  .contactBox{ padding: 30px; border-radius: 10px;}
  .contactBox .contactItem{padding: 30px 0px;}
ul.irEsgUl li{ width:100%;}
ul.boardUl li{width: 100%;}
.boardDeatil{ width: 100%;}
.boardDeatil.Item2,
.boardDeatil.Item3,
.boardDeatil.Item4 {
    left: 0px;
}
}