@import url("reset.css");
@charset "UTF-8";
/**
 *
 * @authors zhou.sunny (1576567774@qq.com)
 * @date    2016-10-31 10:25:51
 * @version $Id$
 * @public.less
 */

* {
    margin: 0;
    padding: 0;
    -webkit-text-size-adjust: none;
}

@font-face {
  font-family: 'Flama-Basic';
  src:  url('../fonts/Flama-Basic.eot?1aukq4');
  src:  url('../fonts/Flama-Basic.eot?1aukq4#iefix') format('embedded-opentype'),
    url('../fonts/Flama-Basic.ttf?1aukq4') format('truetype'),
    url('../fonts/Flama-Basic.woff?1aukq4') format('woff'),
    url('../fonts/Flama-Basic.svg?1aukq4#Prompt-Thin') format('svg');
}
@font-face {
  font-family: 'Flama-Book';
  src:  url('../fonts/Flama-Book.eot?1aukq4');
  src:  url('../fonts/Flama-Book.eot?1aukq4#iefix') format('embedded-opentype'),
    url('../fonts/Flama-Book.ttf?1aukq4') format('truetype'),
    url('../fonts/Flama-Book.woff?1aukq4') format('woff'),
    url('../fonts/Flama-Book.svg?1aukq4#Prompt-Thin') format('svg');
}
@font-face {
  font-family: 'Flama-Medium';
  src:  url('../fonts/Flama-Medium.eot?1aukq4');
  src:  url('../fonts/Flama-Medium.eot?1aukq4#iefix') format('embedded-opentype'),
    url('../fonts/Flama-Medium.ttf?1aukq4') format('truetype'),
    url('../fonts/Flama-Medium.woff?1aukq4') format('woff'),
    url('../fonts/Flama-Medium.svg?1aukq4#Prompt-Thin') format('svg');
}
@font-face {
  font-family: 'Flama-Semibold';
  src:  url('../fonts/Flama-Semibold.eot?1aukq4');
  src:  url('../fonts/Flama-Semibold.eot?1aukq4#iefix') format('embedded-opentype'),
    url('../fonts/Flama-Semibold.ttf?1aukq4') format('truetype'),
    url('../fonts/Flama-Semibold.woff?1aukq4') format('woff'),
    url('../fonts/Flama-Semibold.svg?1aukq4#Prompt-Thin') format('svg');
}
@font-face {
  font-family: 'Source-Sans-ProRegular';
  src:  url('../fonts/Source-Sans-ProRegular.eot?1aukq4');
  src:  url('../fonts/Source-Sans-ProRegular.eot?1aukq4#iefix') format('embedded-opentype'),
    url('../fonts/Source-Sans-ProRegular.ttf?1aukq4') format('truetype'),
    url('../fonts/Source-Sans-ProRegular.woff?1aukq4') format('woff'),
    url('../fonts/Source-Sans-ProRegular.svg?1aukq4#Prompt-Thin') format('svg');
}
html,body{position: relative;margin: 0 auto;padding: 0;background: #fff;
  min-width:320px;height:auto;overflow-x: hidden;font-size: 62.5%;}

body{overflow: hidden;}
body table,tr,td {border-collapse: collapse;}
body ul, li {list-style-type: none;}
body img{border: none;width:100%; height:auto;display: block;}
body b{font-weight:normal;}
body p.no_pad{padding-bottom: 0px!important;}
.detailZK:focus{
  border:2px solid #000000;
}
.sidenav ul li span:focus,
#menu:focus,
.our_slick_box .slick-dots li:focus,
body a:focus {
    outline: -webkit-focus-ring-color #22a19e 2px;
    outline: -moz-focus-ring-color #22a19e 2px;
    outline: -ms-focus-ring-color #22a19e 2px;
    outline: -webkit-focus-ring-color #22a19e 2px;
    outline:#22a19e solid 2px;
 
}
.sidenav ul li span:focus:hover,
#menu:focus:hover,
.our_slick_box .slick-dots li:hover,
body a:focus:hover{
  color: #22a19e;
  outline: -webkit-focus-ring-color #fff 0px;
    outline: -moz-focus-ring-color #fff 0px;
    outline: -ms-focus-ring-color #fff 0px;
    outline: -webkit-focus-ring-color #fff 0px;
     outline:#fff solid 0px;
}

#menu:focus:active{
  color: #22a19e;
  outline: -webkit-focus-ring-color #fff 0px;
    outline: -moz-focus-ring-color #fff 0px;
    outline: -ms-focus-ring-color #fff 0px;
    outline: -webkit-focus-ring-color #fff 0px;
     outline:#fff solid 0px;
}
a{color: #000;transition:all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-o-transition: all 0.3s;
}
a:hover{color: #22ac38;}
a,a:hover,a:focus,a:active{text-decoration:none;}  
a.underl{text-decoration: underline;}
a.underl:hover{text-decoration: none;}
.a_link{ text-decoration:underline}
a.write{color: #fff!important;}
a.write:hover{color: #B4E094!important;}
a.yello{color: #ffff00!important;}
a.yello:hover{color: #B4E094!important;}

.clearfix {*zoom: 1;clear:both;}
.clearfix::after{content: "";display: block;}
.ipad_show,.ph_show,.ph_show_834{display: none;}
.ipad_hide,.ph_hide{display: block;}

.flex_w_ipad,
.flex{position: relative;display: flex;width: 100%;height: auto;}
.flex_w{position: relative;display: flex;flex-wrap:wrap;width: 100%;height: auto;}
.justify_around_center{justify-content:space-around;align-items:center;}
.justify_around_end{justify-content:space-around;align-items:flex-end}
.justify_around_stretch{justify-content:space-around;align-items:stretch;}
.justify_between_center{justify-content:space-between;align-items:center;}
.justify_between_star{justify-content:space-between;align-items:flex-start;}
.justify_between_end{justify-content:space-between;align-items:flex-end;}
.justify_between_stretch{justify-content:space-between;align-items:stretch;}
.justify_center_center{justify-content:center;align-items:center;}
.justify_star_center{justify-content:flex-start;align-items:center;}
.justify_end_center{justify-content:flex-end;align-items:center;}
.flex_column{position: relative;display: flex;flex-direction:column;}
.flex_1{flex:1;}


.col_70{position:relative;width: 70%;}
.col_55{position:relative;width:55%;}
.col_45{position:relative;width:45%;}
.col_30{position:relative;width:30%;}


.com_position{position:relative;width: 100%;height: auto;}
.trans_x{left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);}
.trans_y{top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);}
.trans_xy{top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);}

.text_center{text-align: center;}
.text_right{text-align: right;}
.text_upper{text-transform: uppercase;}

.line3{overflow: hidden;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient: vertical;box-orient: vertical;display: -webkit-box;display: box;}

#ver-en{
  font-family:"Flama-Book", Arial, Helvetica, sans-serif, Verdana;
  font-size: 1.6rem;
  line-height: 1.4;
  color: #2e2a2b;
  font-weight: normal;
  height: auto;
}
#ver-chi{
   font-family: "Microsoft JhengHei","微軟正黑體",Arial,Verdana,Helvetica,sans-serif;
  font-size: 1.6rem;
  line-height: 1.4;
  color: #2e2a2b;
font-weight:bold;
}
/*.font_14{font-size: 14px!important;}*/
.fonts_book{
  font-family:"Flama-Book", Arial, Helvetica, Verdana, sans-serif;;
}

body h1{
  position:relative;
  font-size:4.5rem;
  line-height: 1.2;
  color: #765100;
  margin-bottom: 50px;
}
#ver-chi h1{ font-weight:bold;}
#ver-en  h2,
#ver-en h1{
   font-family:"Flama-Basic", Arial, Helvetica, sans-serif, Verdana;
}

.color_blue{
  color:#006900!important;
}

.index_warp{
  position: relative;
  width:100%;
  max-width:100%;
    margin-left: auto;
    margin-right: auto;
	padding-top:60px;
}
/*com-css-end*/
/*header*/
#header{
	position:fixed;
	height: auto;
	border-bottom:3px solid #34a344;
    line-height: 0;
    background-color: #fff;
    top: 0;
    width: 100vw;
    z-index:9999;
    padding:20px 0px;
    left: 0px;
    right: 0px;
}

a.logo{
	position:relative;
	display: block;
	max-width:280px;
	margin:0px auto;
}
.lang_nav{
	top:7px;
	left:2%;
	position:absolute;
  z-index: 8;
}
/*menu*/
#menu {
    position: absolute;
    display: block;
    z-index: 6;
	right: 0;
  width: 28px;
    height: 16px;
    cursor: pointer;
}
#menu span{
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
}
#menu em {
    position: absolute;
    display: block;
    width: 100%;
    height: 1px;
    /*background: #000000;*/
    border-top: 1px solid #000000;
    transition:all 0.3s;
 -moz-transition: all 0.3s;
 -webkit-transition: all 0.3s;
 -o-transition: all 0.3s;
}
#menu em:nth-of-type(2) {
    top: 50%;
    margin-top: -1px;
}
#menu em:last-child {
    bottom: 0px;
}
#menu.nofocus,
#menu.active{
  color: #22a19e;
  outline: -webkit-focus-ring-color #fff 0px;
    outline: -moz-focus-ring-color #fff 0px;
    outline: -ms-focus-ring-color #fff 0px;
    outline: -webkit-focus-ring-color #fff 0px;
     outline:#fff solid 0px;
}
#menu.active em:first-child {
-webkit-transform: rotateZ(-45deg);
-moz-transform: rotateZ(-45deg);
-ms-transform: rotateZ(-45deg);
-o-transform: rotateZ(-45deg);
transform: rotateZ(-45deg);
top: 50%;
}
#menu.active em:nth-child(2) {
visibility: hidden;
opacity: 0;
}
#menu.active em:last-child {
-webkit-transform: rotateZ(45deg);
-moz-transform: rotateZ(45deg);
-ms-transform: rotateZ(45deg);
-o-transform: rotateZ(45deg);
transform: rotateZ(45deg);
top: 50%;
bottom: auto;
}

.sidenav.active{
  display: block;
}
.sidenav{
  position: absolute;
  top:30px;
  height: auto;
  width: 150px;
  left:-15px;
  display: none;
  box-shadow: 1px 1px 11px 0 #ccc;
  background-color: #fff;
  border-radius: 7px;
  transition: all 0.4s linear;
  -webkit-transition: all 0.4s linear;
  -moz-transition: all 0.4s linear;
  -o-transition: all 0.4s linear;
  overflow: hidden;
  padding:5px 5px 7px 15px;
}
.sidenav ul li.separator {
    flex:1;
	height:22px;
} 
.font_A a{
 /* display: inline-block;*/
 /* width: 27%;*/
 /* text-align: center; */
}
.sidenav ul li span:hover,
.sidenav ul li span.selected,
.sidenav ul li a:hover,
.sidenav ul li a.selected{
  text-decoration: underline;
}
.sidenav ul li a,
.sidenav ul li span {
  position: relative;
  display: block;
    color: #10110f;
    margin: 0px;
    padding: 0px 0px 0px 0px;
    text-decoration: none;
    text-align: center;
	font-weight: 100;
}

.sidenav ul li span.smallFont {
	font-size:16px;
 line-height:1;
    cursor: pointer;
}
.sidenav ul li span.defaultFont {
line-height:1;
font-size:20px;
    cursor: pointer;
}
.sidenav ul li span.bigFont {
line-height:1;
font-size:24px;
    cursor: pointer;
}

.sidenav ul li.lang{
  position:relative;
  width: 40px;
  margin-left: 10px;
  margin-top: 3px;
  text-align: center;
  border-left: 1px solid #b3b3b2;
}
.sidenav ul li.lang a{	
  display: block;
  position: relative;
  font-size: 19px;
  font-weight: bold;
  line-height: 1;
}
#ver-en .sidenav ul li.lang a{
  font-family:"Microsoft JhengHei","微軟正黑體",Arial,Verdana,Helvetica,sans-serif;
}

.sidenav ul li span,
#ver-chi .sidenav ul li.lang a{font-family:"Flama-Book", Arial, Helvetica, sans-serif, Verdana;
}
.sidenav ul li.lang a img,
.sidenav ul li a img{
  height: 100%;
  width: auto;
  margin: 0px auto;
}
.higeBai{
  position:relative;
  width: 100%;
  height:6vh;
}
/*banner*/
.container{
  position: relative;
  width: 100%;
  height: auto;
  max-width: 1300px;
  margin:0px auto;
}

.index_banner{
  position:relative;
  width: 100%;
  height: 768px;
  z-index: 1;
  /*margin-top: 4vh!important;*/
}


.banner_img{
  position:absolute;
  width: 100%;
  height: 100%;
  /*top:4vh;*/
  z-index: 1;
  bottom: 0px;
  left: 0px;
  background:url("../images/banner.png") center no-repeat;
  background-size: contain;
}
svg,
ul.ban_icon_ul li img,
.banner_img img{ width: auto; margin:0px auto;max-width: 100%; max-height: 100%;}
ul.ban_icon_ul{
	position:absolute;
	width: 100%;
	/*height: 100%;*/
  top:4vh;
	bottom: 0px;
	left:-2%;
	z-index: 3;
	overflow: hidden;
}
ul.ban_icon_ul li.ban_icon{
  position:absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  z-index: 1;
}
.shp0 { fill: none;stroke: #ffffff;stroke-linecap:round;stroke-linejoin:round;stroke-width: 2.793 } 
.yy {
    stroke:#ffffff;
    animation: lineMove 3s ease-out;
}
.yy1 {
    stroke:#ffffff;
    animation: lineMove1 1s ease-out;
    animation-fill-mode:forwards;
    animation-delay:1.5s;
    -webkit-animation: lineMove1 1s ease-out;
    -webkit-animation-fill-mode:forwards;
    -webkit-animation-delay:1.5s;
    -moz-animation: lineMove1 1s ease-out;
    -moz-animation-fill-mode:forwards;
    -moz-animation-delay:1.5s;
    -ms-animation: lineMove1 1s ease-out;
    -ms-animation-fill-mode:forwards;
    -ms-animation-delay:1.5s;
    opacity: 0;
}
.yy2 {
    stroke:#ffffff;
    animation: lineMove2 1s ease-out;
    animation-fill-mode:forwards;
    animation-delay:1.5s;
    -webkit-animation: lineMove2 1s ease-out;
    -webkit-animation-fill-mode:forwards;
    -webkit-animation-delay:1.5s;
    -moz-animation: lineMove2 1s ease-out;
    -moz-animation-fill-mode:forwards;
    -moz-animation-delay:1.5s;
    -ms-animation: lineMove2 1s ease-out;
    -ms-animation-fill-mode:forwards;
    -ms-animation-delay:1.5s;
    opacity: 0;
}
.banIconFZ{
   display: none;
}
.banIcon2{
  animation: lineMoveFZ 10s ease-out infinite;
  animation-delay:0s;
  -webkit-animation: lineMoveFZ 10s ease-out infinite;
  -webkit-animation-delay:0s;
  -moz-animation: lineMoveFZ 10s ease-out infinite; 
  -moz-animation-delay:0s;
  -ms-animation: lineMoveFZ 10s ease-out infinite;
  -ms-animation-delay:0s;
}
.banIcon3{
  animation: lineMoveFZ_x 8s ease-out infinite;
  animation-delay:0s;
  -webkit-animation: lineMoveFZ_x 8s ease-out infinite;
  -webkit-animation-delay:0s;
  -moz-animation: lineMoveFZ_x 8s ease-out infinite; 
  -moz-animation-delay:0s;
  -ms-animation: lineMoveFZ_x 8s ease-out infinite;
  -ms-animation-delay:0s;
}
.banIcon4{
  animation: lineMoveFZ_Y 6.5s ease-out infinite;
  animation-delay:0s;
  -webkit-animation: lineMoveFZ_Y 6.5s ease-out infinite;
  -webkit-animation-delay:0s;
  -moz-animation: lineMoveFZ_Y 6.5s ease-out infinite; 
  -moz-animation-delay:0s;
  -ms-animation: lineMoveFZ_Y 6.5s ease-out infinite;
  -ms-animation-delay:0s;
}
ul.ban_icon_ul li.ban_icon.z_t{
	z-index: 2;
}
ul.ban_icon_ul li.ban_icon:last-child img{height: 100%;margin-left: 6%;}
ul.ban_icon_ul li.ban_icon img{
  position: absolute;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  /*height: 100%;*/
  left: 50%;
  top: 50%;
  transform:translate(-50%,-50%);
  -webkit-transform:translate(-50%,-50%);
  -moz-transform:translate(-50%,-50%);
  -ms-transform:translate(-50%,-50%);
}

.indBan_txt{
	position:relative;
	height: 12vh;
	width: 100%;
  max-width: 1000px;
  margin:0px auto;
	z-index: 2;
  /*bottom: 0px;*/
}
img.ie_2020{display: none; }
img.ie_2020none{display: block;}
.ban_Down{
	    position: relative;
    width: 100%;
    height: 100%;    min-width: 900px;
    display: flex;
    align-items: center;
}
ul.ban_down_ul{ padding-bottom:20px;}
ul.ban_down_ul li{
	position:relative;
  padding-left: 25px;
  display:flex;
   align-items: center;
}
ul.ban_down_ul li img{ width:18px; margin-right:5px;}
ul.ban_down_ul li:last-child img{ width:20px;}
ul.ban_down_ul li a{
	font-weight: bold;
	color: #4d4d4f;
  font-size:1.8rem;
  display: block;
  line-height:1;
}
#ver-en ul.ban_down_ul li a{font-family: 'Flama-Basic', Arial, Helvetica, Verdana, sans-serif;font-weight:100;}
ul.ban_down_ul li a:hover{
  color: #874234;
  text-decoration: underline;
}
ul.ban_down_ul li.icon3,
ul.ban_down_ul li.icon2,
ul.ban_down_ul li.icon1{
    background: url(../images/down.png) no-repeat left center transparent;
    background-size: auto 18px;
}

ul.ban_down_ul li.icon4{
    background: url(../images/icon-envelope.png) no-repeat left center transparent;
    background-size: auto 15px;
}

.down_btn{
	position:absolute;
	width:100%;
	height: auto;
	bottom:0px;
  -webkit-animation: bounce .5s ease-in-out alternate infinite;
  -moz-animation: bounce .5s ease-in-out alternate infinite;
  -ms-animation: bounce .5s ease-in-out alternate infinite;
    animation: bounce .5s ease-in-out alternate infinite;

   z-index: 6;
}
.down_btn span img{width:40px;    margin: auto;    cursor: pointer;}
.ban_heardBox{
  position: relative;
  width: 25%;
}
.ban_heard .banHead_item{
  width: 40%;
}
/*index-banner end*/

/*index-main*/
.index_main{
  position:relative;
  margin-top:60px;
	min-height: 600px;
}


.chief_infoBox{
	position:relative;
  width: 100%;
  height: 625px;
  padding-left:100px;
	color: #fff;
}
.com_abso{
  position:absolute;
}
.chief_infoBox::before{
	content: "";
	display: block;
	position:absolute;
	width: 2000px;
	left: 0px;
	top: 0px;
	height: 100%;
	background: #5b7744;
}

p.p_pad_t{
	padding-top:50px;
}
p.fonts_bg{  
	position:relative;
	font-size: 1.8rem;
	line-height:1.5;
	font-weight:500;
  color: #666666;
}
/*body#ver-en p.fonts_bg{font-family: 'Source-Sans-ProRegular', Arial, Helvetica, Verdana, sans-serif;}*/
p.fonts_sm{
	position:relative;
	font-size: 1.8rem;
}
.foot_fonts_sm{
  font-size: 1.4rem;
}

p.font_hao::before{
   content: "";
   display: block;
   position:relative;
   width: 40px;
   height: 40px;
   background: url("../images/hao_up.png") no-repeat left;
   background-size: 100% auto;
}
#ver-chi p.font_hao{font-weight:500;}
p.font_hao::after{
   content: "";
   display: block;
   position:absolute;
   right:0;
   width: 40px;
   height: 40px;
   background: url("../images/hao_down.png") no-repeat left;
   background-size: 100% auto;
}

.dialog {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    outline: 0;
    background: rgba(0,0,0,0.3);
    z-index: 9999;
}
.modal-dialog {    font-size: 16px;
    position:absolute;
    width:96%;
    max-width: 480px;
    height: auto;
    padding: 32px;
    border: 0;
    border-radius: 5px;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
}
.modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    border-radius: .3rem;
    outline: 0;
}

.modal-content #menu{
  width: 20px;
    height: 10px;
  top: -10px;
  right: -20px;
}
.modal-header{ font-weight:bold;
  font-size: 20px;
  line-height: 30px;
  margin-bottom: 15px;
}
.modal-body p{ font-weight:normal;} 
.modal-footer{
  position:relative;
  margin-top: 20px;
  display: flex;
      justify-content: flex-end;
}
.modal-footer a,
.modal-footer button{ font-size: 16px;
	font-weight:bold !important;
  border-radius: 5px;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none !important;
    padding: 6px 15px;
    font-weight: 500;
    background-color: transparent;
    border: 1px solid #b2b2b2;
    color: #666;
   text-align: center;
   margin-left: 8px;
}
.modal-footer a:after {
    background-image: url(../images/icon_link_white.svg) !important;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 20px;
    max-height: 20px;
    min-height: 20px;
    max-width: 20px;
    min-width: 20px;
    width: 20px;
    content: '';
    display: inline-block;
    margin-left: 0;
    vertical-align: text-bottom;
}

.modal-footer button:hover{ background-color:#eeeeee;}
.modal-footer a{
      font-weight: 500;
    background-color: #00a865;
    border: 1px solid #00a865;
    color: #fff;
    text-align: center;
}
.modal-footer a:hover{background-color: #298236;
    border: 1px solid #298236;}
.chief_mainBox{
	position:relative;
	width: 100%;
  height: auto;
}
.chiefContainer{position:relative; max-width:975px; margin:0px auto;}
.chief_bgLine{position: relative; width: 100%; height: auto; margin-top: 100px; overflow: hidden; margin:0px auto;
    width: 100%;
    height: auto;
    max-width: 1920px;}
.chiefLineBgBox img{position: absolute; width: 100%;height: 100%; left: 0px; top: 0px;}
.chiefLineBgBox{position: absolute; width: 100%;height: 100%; top: 0px; }
.chiefLineXian{position: absolute;width: 120%; left: -10%;height: 1px; left: 0px; bottom: 0px; background:#c6b893;}

img.chief_bgLineLIne{position:relative; width: 100%; margin:0px auto;}

.z_index{
	z-index: 2;
}
p.font_hao{font-size: 3.2rem; color: #765100; position:relative;}

ul.our_ul li{
	position:relative;
  width: 31.5%;
}
ul.our_ul li a{
  position: relative;
}
.susYeBox{position: relative;border-top-left-radius: 100px;border-bottom-right-radius: 100px; overflow: hidden;}
.susYeBox .brandsInfoYeBox{position: absolute; width: 100%;height: 100%;bottom: 0px; left: 0px;
  border-top-left-radius:100px;border-bottom-right-radius: 100px;  overflow: hidden;
}
.susYeBox .brandsInfoYeBox img{height: 100%\0;}
/*.ourliIrom1 .susYeBox{background:#389a49;background-clip: content-box;}*/
.susYeBox .brandsInfoYeBox::before{
  content:'';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  border-top-left-radius: 100px;
  border-bottom-right-radius: 100px;
}
.ourliIrom1 .susYeBox .brandsInfoYeBox::before{border:3px solid #266D2F;}
.ourliIrom2 .susYeBox .brandsInfoYeBox::before{border:3px solid #2A5975;}
.ourliIrom3 .susYeBox .brandsInfoYeBox::before{border:3px solid #9a70a0;}

.brandsInfoDetail{position: absolute;z-index: 3; width:0px;height: 0px; top: 0px;right: 0px;     
  transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s; overflow: hidden;}
.ourliIrom1 .brandsInfoDetail{ 
  background: rgba(38,109,47,0.95); 
}
.ourliIrom2 .brandsInfoDetail{ 
  background:rgba(42,89,117,0.95);
}
.ourliIrom3 .brandsInfoDetail{ background:rgba(116,85,122,0.95);}

.brandsInfoDetail.actrive{width: 100%;height: 100%;}

.brandsInfoDetailFlex{position: relative;
  overflow:hidden;
 width: 100%; height: 100%; padding:10px 20px 10px 40px; color: #fff;}
.brandsInfoDetailFlex h2{font-size: 2.4rem; padding-bottom: 15px;font-weight: bold;}
.itemBoxDetail p{font-size: 2rem; line-height: 1.2;}
span.itemBoxDetailClose{position: absolute; width: 35px; height: 35px; top: 0px; right: 0px;}
span.itemBoxDetailClose::before{
  content: "";
  display: block;
  position: absolute;
  width: 18px;
  height: 3px;
  background:#fff;
  top:16px;
  margin-top: -2px;
  left:10px;
}

.our_ul li dl dd{position: relative; padding-top: 20px; padding-left: 5px;}
.our_ul li dl dd a{ position: relative;}
.our_ul li dl dd a::after {
    content: "";
    display: none;
    position: absolute;
    bottom: 2px;
    width: 100%;
    height: 1px;
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    left: 0px;
}
.our_ul li dl dd ul li{width:100%;padding-bottom: 5px;    margin-bottom: 0;}
.ourliIrom1 dl dd a{color: #266D2F;    position: relative;}
.ourliIrom2 dl dd a{color: #2A5975;    position: relative;}
.ourliIrom3 dl dd a{color: #674A9D;}
.ourliIrom1 dl dd a:hover::after {display: block;border-bottom: 1px solid #006900;}
.ourliIrom2 dl dd a:hover::after {display: block;border-bottom: 1px solid #0057B1;}
.ourliIrom3 dl dd a:hover::after {display: block;border-bottom: 1px solid #674A9D;}

img.opciO{opacity: 0;}

.detailZK{position: absolute;top:0px; right:0px; width:35px; height: 35px; cursor: pointer;z-index:3;}
.ourliIrom1 .detailZK{background:#266D2F;}
.ourliIrom2 .detailZK{background:#2A5975;}
.ourliIrom3 .detailZK{background:#9a70a0;}

ul.pdfDown{position: relative; padding:0px 3%; margin-top: 60px;}
ul.pdfDown li.pdfLine{font-size:3rem;}
#ver-chi ul.pdfDown li.pdfLine{font-size:2rem;}
.our_ul li dl dd a,
.pdfDown li a{font-size: 2.4rem;position:relative;}
#ver-en .pdfDown li a{font-family:"Flama-Basic";}
.pdfDown li a::after {
    content: "";
    display: none;
    position: absolute;
    bottom: 2px;
    width: 100%;
    height: 1px;
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    left: 0px;
}
.pdfDown li a{ color:#4d4d4f;line-height: 1; }
.pdfDown li a:hover{ color:#765100;}
.pdfDown li a:hover::after{display: block;border-bottom: 1px solid #765100;}

.our_main {padding:100px 2%;}

.report_main{
  margin-bottom:60px;
  padding:0 2%;
}
.report_info{
	position: relative;
	width: 64%;
}
.report_info p{padding-bottom: 30px;}
.report_img{
	position:relative;
	width: 32%;
  margin-left: 5%;
}
.report_img img{
  width: 100%;
  height: auto;
}
.view_btn {color:#765100;    font-weight: 500;}

.view_btn:hover{color:#765100;
  text-decoration: underline;
}








.remind_box{padding-bottom: 10px;}
.ban_heard{position: relative; padding:0px 2% 30px 2%;}
.ban_heardBox {padding-bottom: 20px;}
#footer{
  position: relative;
  
}
#footer .footer_bg{
  position: relative;
  padding:15px 0px;
  background: #e6e6e6;
}

#footer p.foot_fonts_sm{
  font-size: 11px;
}
a.hsbc_logo{
	max-width: 160px;
	display: block;
  white-space: nowrap;
}
.foot_pad_new{padding-bottom: 5px;}
/*screen--------screen---------screen-----------screen*/
@media (max-width:1800px){

body h1{font-size:4.0rem;}
.chiefContainer{max-width: 855px;}
p.font_hao{font-size: 3rem;}


  .report_info{
    width: 65%;
  }

  .report_img{width: 35%;}


}



@media (max-width:1440px){
	body h1{
		font-size:3.6rem;
	}
  .chiefContainer{max-width: 773px;}
  p.font_hao{font-size: 2.4rem;}

	p.fonts_bg{    font-size:1.8rem;}
  .report_info{
    width: 70%;
  }

  .report_img{
    width:30%;
  }

  .chief_infoBox,
  .chief_imgbox{height: 580px;}
  ul.pdf_down_ul li a.underl_line{    font-size:1.8rem;}
}



@media (max-width:1366px){
  .report_img{
    right: 0px;
  }

	p.fonts_bg{    font-size:1.7rem;}
  
/*   ul.ban_icon_ul li.ban_icon img,
   svg, ul.ban_icon_ul li img, .banner_img img{
      height: auto;
      width: 100%;
      margin: 0px auto;
      max-width: 400%;
      max-height: 400%;
      left:0;
      top:0;
      transform: translate(0,0);
      -webkit-transform: translate(0,0);
      -moz-transform: translate(0,0);
      -ms-transform: translate(0,0);
   }*/

}
@media (min-height:1024px) and (min-width:1366px){
	 .indBan_wrap .index_banner{
    max-width:1300px;
    margin:0px auto;
  }
	}
@media (max-width:1280px){

.susYeBox .brandsInfoYeBox::before,  
.susYeBox, .susYeBox .brandsInfoYeBox{border-top-left-radius:70px;border-bottom-right-radius:70px;}

p.fonts_bg { font-size:1.6rem;}
.ban_tit{
  top: -5%;
 }
 .chief_imgbg{ background-position:25%;}
 .container{max-width: 900px;}
  .indBan_wrap .index_banner{
    max-width:950px;
    margin:0px auto;
  }
  .brandsInfoDetailFlex{padding: 10px 20px;}
  .brandsInfoDetailFlex h2{ font-size:2.0rem;}
.itemBoxDetail p { font-size:1.6rem;}
ul.pdfDown{ padding:0px; width: 110%; margin-left: -5%;}
ul.ban_icon_ul{top: 0px;}
}

@media (max-width:1050px){
  .ph_show_834{
    display: block;
  }
  
  .indBan_txt{ width: 112%;max-width: auto; margin-left: -6%;}


}

@media (max-width:1023px){
  .flex_w_ipad{flex-wrap:wrap;}
  .w1024{display: none;}
  .ipad_show{display: block;}
  .ipad_hide{display: none;}
  .col_100_ipad{
    width: 100%;
  }
  .index_warp{
    padding-right:0px;
  }
  body h1 {
    font-size:3rem;
  }
  .container{
    padding: 0px 40px;
  }
  .chiefContainer {
    max-width: 630px;padding:0px 20px;
  }
  p.font_hao {
    font-size: 2rem;
  }

  p.fonts_bg{
    font-size:1.4rem;
  }

  p.font_hao::after,
  p.font_hao::before{
    width: 30px;
    height:30px;
  }

  p.font_hao em{
    bottom: -20px;
  }
.lang_nav{ left:40px;}
  .index_warp{padding-top: 70px;}
  ul.ban_down_ul{ padding-bottom:0;}
.ban_Down{ min-width:inherit;}
  .indBan_wrap.container{padding:0px;width: 100%; overflow: hidden;
    max-width: 100%;}
  ul.ban_icon_ul li.ban_icon svg{height: auto!important;}
  .indBan_wrap .index_banner{height: auto!important; padding-top:0px;max-width: 100%;}
  ul.ban_icon_ul{top: 0px;}
  svg, ul.ban_icon_ul li img, .banner_img img{width: 100%; height: auto;}
  ul.ban_icon_ul li.ban_icon svg{
    position: relative;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
  }
  .banner_img{background: url(../images/banner.png) center no-repeat;
    background-size: 100% 100%; top: 0px;position: relative;}
  ul.ban_icon_ul li img, .banner_img img{width: 100%; height: auto; max-height: 800%;max-width: 800%;}

  ul.ban_down_ul li{width: 50%; margin-top: 25px;}
  .indBan_txt{height: auto;}

  .indBan_txt{max-width:630px; margin:0px auto; padding:0px 20px;}
  .index_main .container{padding:0px 60px;}

  ul.our_ul li{width: 100%; max-width: 450px; margin:0px auto; margin-bottom: 45px; }
  .our_ul li dl dd ul li{padding-bottom: 10px;}
  .our_ul li dl dd{padding:30px 0px 40px 0px;text-align: center;}
  .our_ul li.ourliIrom1 dl dd{ border-bottom: 1px solid #389a49;}
  .our_ul li.ourliIrom2 dl dd{ border-bottom: 1px solid #267eba;}
  .our_ul li.ourliIrom3 dl dd{ border-bottom: 1px solid #9a70a0;}
  ul.pdfDown{margin-top: 0px;}
  ul.pdfDown li.pdfDownItem{width: 100%; text-align: center; margin-bottom: 20px;}
  ul.pdfDown li.pdfDownItem.pdfLine{display: none;}

  .report_info{width: 100%;}
  .report_img{width: 100%; max-width: 450px; margin:0px auto; padding-bottom: 30px;}

   ul.ban_down_ul li a{font-size: 1.6rem;}
   ul.ban_down_ul li img{ width:14px; padding-top:1%;}
ul.ban_down_ul li:last-child img{ width:16px;}

   #footer{position: relative;background: #e6e6e6;} 
   .ban_heard{padding:20px 0px 0px 0px;}
   .ban_heardBox{ width: 180px; padding-bottom: 0px;}
   .our_main{padding-bottom: 20px;}
   .chief_bgLine.chief_bgLine1{width: 118%; margin-left: -9%; margin-bottom: 50px; margin-top: 0px;}
   .our_ul li dl dd a.noipadid{padding-bottom: 0px;}
   .our_ul li dl dd a{text-align: center;}
   
    .detailZK, span.itemBoxDetailClose{ width:25px; height: 25px;}
    .detailZK{
      top: 2px; right: 2px;
    }
    span.itemBoxDetailClose::before{ width: 12px; height: 2px; top: 12px; left: 8px;}
	  .chief_bgLine{width: 200%; margin-left: -50%; margin-top: 60px;}

    .down_btn{position: relative; bottom: auto; margin-top: 30px; }
	.down_btn span img{width: 30px;}
}


@media (max-width:990px){
  body h1 {
    font-size: 2.6rem;
  }
  

  p.fonts_bg{
    font-size:1.6rem;
  }

  p.fonts_sm{
  	font-size: 1.4rem;
  }
  
}

@media (max-width:768px){
  .w768{display: none;}
  p.fonts_bg{
    font-size:2rem;
  }
.our_ul li dl dd a, .pdfDown li a {font-size:2rem;}
 
}
@media (max-width:680px){
.modal-dialog{max-width:100%;}
.modal-footer{    flex-wrap: wrap;flex-direction:column-reverse;}
.modal-footer a, .modal-footer button{width:100%; padding-bottom:10px;}
}
@media (max-width:580px){
.our_ul li dl dd a, .pdfDown li a {font-size:1.8rem;}
  body h1{margin-bottom: 25px;font-size: 2.4rem;}
  .ph_show{display: block;}.ph_hide{display: none;}
  #header{padding: 16px 0px;}
  span#menu{width: 30px;height: 20px;}
  .sidenav{    right: 0; left: auto;}
  .index_warp{padding-top: 58px;}
  a.logo{    margin-left: 0px;
  	width: 230px;
  }
  #menu{ width: 26px;  height: 14px;}
  .lang_nav{
	right: 20px;
    left: inherit;
  }

  p.fonts_bg{font-size:1.4rem;}
img.ie_2020{display: block; }
img.ie_2020none{display: none;}

  .container{
    padding: 0px 20px;
  }
  .index_main .container{padding: 0px 40px;}
  ul.ban_down_ul li {
    position: relative;
    padding-left:0;
  }
  ul.ban_down_ul li a{font-size: 1.3rem;}
  ul.ban_down_ul li.icon3, ul.ban_down_ul li.icon2, ul.ban_down_ul li.icon1 {
    background: url(../images/down.png) no-repeat left center transparent;
    background-size: auto 10px;
  }
  ul.ban_down_ul li.icon4 {
    background: url(../images/icon-envelope.png) no-repeat left center transparent;
    background-size: auto 9px;
  }
  .chiefContainer{padding:0px;}
  body h1.text_center{text-align: left;}
p.font_hao {
    font-size:1.8rem;
}
  .chief_bgLine.chief_bgLine1{width: 126%; margin-left: -13%; margin-bottom: 50px; margin-top: 0px;}
  .index_main{margin-top: 50px;}
.susYeBox .brandsInfoYeBox::before,
.susYeBox, .susYeBox .brandsInfoYeBox{border-top-left-radius:50px;border-bottom-right-radius:50px;}
  .banner_img img{width: 150%;}
  ul.ban_icon_ul li.ban_icon svg, 
  ul.ban_icon_ul li.ban_icon img{
    width: 120%; max-width: 120%; left: 42%;
    height: auto;
        top:auto;
    transform: translate(-50%,0); 
    -webkit-transform: translate(-50%,0); 
    -moz-transform: translate(-50%,0); 
    -ms-transform: translate(-50%,0); 
  }
  ul.ban_icon_ul li.ban_icon img.ie_2020none{
     right: 0px; left: auto; max-width:200%;
    width: 200%; left:auto;bottom: 0px;right: -30px;max-height:400%;
    transform: translate(0,0); 
    -webkit-transform: translate(0,0); 
    -moz-transform: translate(0,0); 
    -ms-transform: translate(0,0);
  }
  ul.ban_icon_ul li.ban_icon.banner_people img{bottom: 0px; left: 50%;}
  .indBan_txt{padding:0px 10px;}
  /*ul.ban_icon_ul li.ban_icon img{}*/
  .our_main{padding:60px 0px;}
  

  .brandsInfoDetailFlex h2{font-size:1.8rem;    padding-bottom:10px;}
  .itemBoxDetail p{font-size: 1.4rem;}
  .report_main{margin-bottom:30px;}
#ver-chi .brandsInfoDetailFlex h2{font-size:2rem;padding-bottom:10px;}
#ver-chi .itemBoxDetail p{font-size: 1.6rem;}

  .banIcon3{
    animation: lineMoveFZ_x_ph 8s ease-out infinite;
    animation-delay:0s;
    -webkit-animation: lineMoveFZ_x_ph 8s ease-out infinite;
    -webkit-animation-delay:0s;
    -moz-animation: lineMoveFZ_x_ph 8s ease-out infinite; 
    -moz-animation-delay:0s;
    -ms-animation: lineMoveFZ_x_ph 8s ease-out infinite;
    -ms-animation-delay:0s;
  }



}
@media (max-width:580px){.index_main .container {    padding: 0px 20px;}
}
@media (max-height:1400px) and (max-width:1025px){
   /*.index_banner {height:45vh!important;}*/
}
@media (min-height:1081px) and (min-width:1025px){
   .index_banner {height:auto!important;}
   .banner_img{
        background: url(../images/banner.png) center no-repeat;
       background-size: 100% 100%;
   }
   .banner_img img.opciO{display: block;}
   .banner_img img.opciO,
   .banner_img{position:relative!important;}
   /*svg, ul.ban_icon_ul li img, .banner_img img{
     position: absolute; top: 0px; left: 0px;
   }
   ul.ban_icon_ul li.ban_icon img{
     height: auto;
    left:0;
    top:0;
    transform: translate(0,0);
    -webkit-transform: translate(0,0);
    -moz-transform: translate(0,0);
    -ms-transform: translate(0,0);
    left:50%\0;
    top:50%\0;
    transform: translate(-50%,-50%)\0;
    -webkit-transform: translate(-50%,-50%)\0;
    -moz-transform: translate(-50%,-50%)\0;
    -ms-transform: translate(-50%,-50%)\0;
   }*/
}

@media (min-height:1081px){
   .index_banner {height:40vh!important;}
}

/*横屏*/
@media all and (orientation : landscape) {
  
   @media (max-width:820px){
    .indBan_wrap.container{
      padding: 0px;
      width: 100%;
      max-width: 100%;
    }
    .indBan_wrap .index_banner{
      max-width: 100%;
    }
  }
  /*  ul.ban_icon_ul li.ban_icon svg {
  position: absolute;
    top: 0px;
    left: 0px;
    left: 50%;
    width: 100%;
    height: auto;
    top: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    }*/
}


/*screen--------screen---------screen-----------screen*/
@keyframes lineMove {
    0% {
        stroke-dasharray: 0, 3300;

    }
    50% {
        stroke-dasharray: 3300, 3300;
    }
    100% {
        stroke-dasharray: 3300, 3300;
    }
}
@-webkit-keyframes lineMove {
    0% {
        stroke-dasharray: 0, 3300;

    }
    50% {
        stroke-dasharray: 3300, 3300;
    }
    100% {
        stroke-dasharray: 3300, 3300;
    }
}
@keyframes lineMove1 {
    0% {
        stroke-dasharray: 0, 273;
        opacity: 1;
    }
    50% {
        stroke-dasharray: 273, 273;
        opacity: 1;
    }
    100% {
        stroke-dasharray: 273, 273;
        opacity: 1;
    }
}
@-webkit-keyframes lineMove1 {
    0% {
        stroke-dasharray: 0, 273;
        opacity: 1;
    }
    50% {
        stroke-dasharray: 273, 273;
        opacity: 1;
    }
    100% {
        stroke-dasharray: 273, 273;
        opacity: 1;
    }
}
@keyframes lineMove2 {
    0% {
        stroke-dasharray: 0, 307;
        opacity: 1;
    }
    50% {
        stroke-dasharray: 307, 307;
        opacity: 1;
    }
    100% {
        stroke-dasharray: 307, 307;
        opacity: 1;
    }
}
@-webkit-keyframes lineMove2 {
    0% {
        stroke-dasharray: 0, 307;
        opacity: 1;
    }
    50% {
        stroke-dasharray: 307, 307;
        opacity: 1;
    }
    100% {
        stroke-dasharray: 307, 307;
        opacity: 1;
    }
}
@keyframes lineMoveFZ {
    0% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg); 
    }
    50% {
        transform:rotateZ(-5deg) translateX(-0.3%);
        -ms-transform:rotateZ(-5deg) translateX(-0.3%);   /* IE 9 */
        -moz-transform:rotateZ(-5deg) translateX(-0.3%);  /* Firefox */
        -webkit-transform:rotateZ(-5deg) translateX(-0.3%); /* Safari 和 Chrome */
        -o-transform:rotateZ(-5deg) translateX(-0.3%); 
    }
    100% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
}

@-webkit-keyframes lineMoveFZ {
    0% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg); 
    }
    50% {
        transform:rotateZ(-5deg) translateX(-0.3%);
        -ms-transform:rotateZ(-5deg) translateX(-0.3%);   /* IE 9 */
        -moz-transform:rotateZ(-5deg) translateX(-0.3%);  /* Firefox */
        -webkit-transform:rotateZ(-5deg) translateX(-0.3%); /* Safari 和 Chrome */
        -o-transform:rotateZ(-5deg) translateX(-0.3%); 
    }
    100% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
}

@keyframes lineMoveFZ_x {
    0% {
         transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px);  
    }
    50% {
        transform:rotateZ(-5deg) translateX(0.6%);
        -ms-transform:rotateZ(-5deg) translateX(0.6%);   /* IE 9 */
        -moz-transform:rotateZ(-5deg) translateX(0.6%);  /* Firefox */
        -webkit-transform:rotateZ(-5deg) translateX(0.6%); /* Safari 和 Chrome */
        -o-transform:rotateZ(-5deg) translateX(0.6%); 
    }
    100% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
}

@-webkit-keyframes lineMoveFZ_x {
   0% {
         transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px);  
    }
    50% {
        transform:rotateZ(-5deg) translateX(0.6%);
        -ms-transform:rotateZ(-5deg) translateX(0.6%);   /* IE 9 */
        -moz-transform:rotateZ(-5deg) translateX(0.6%);  /* Firefox */
        -webkit-transform:rotateZ(-5deg) translateX(0.6%); /* Safari 和 Chrome */
        -o-transform:rotateZ(-5deg) translateX(0.6%); 
    }
    100% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
}
@keyframes lineMoveFZ_x_ph {
    0% {
         transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px);  
    }
    50% {
        transform:rotateZ(-5deg) translateX(2%);
        -ms-transform:rotateZ(-5deg) translateX(2%);   /* IE 9 */
        -moz-transform:rotateZ(-5deg) translateX(2%);  /* Firefox */
        -webkit-transform:rotateZ(-5deg) translateX(2%); /* Safari 和 Chrome */
        -o-transform:rotateZ(-5deg) translateX(2%); 
    }
    100% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
}

@-webkit-keyframes lineMoveFZ_x_ph {
   0% {
         transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px);  
    }
    50% {
        transform:rotateZ(-5deg) translateX(2%);
        -ms-transform:rotateZ(-5deg) translateX(2%);   /* IE 9 */
        -moz-transform:rotateZ(-5deg) translateX(2%);  /* Firefox */
        -webkit-transform:rotateZ(-5deg) translateX(2%); /* Safari 和 Chrome */
        -o-transform:rotateZ(-5deg) translateX(2%); 
    }
    100% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
}


@keyframes lineMoveFZ_Y {
    0% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
    50% {
        transform:rotateZ(-2deg) translateX(0.55%);
        -ms-transform:rotateZ(-2deg) translateX(0.55%);   /* IE 9 */
        -moz-transform:rotateZ(-2deg) translateX(0.55%);  /* Firefox */
        -webkit-transform:rotateZ(-2deg) translateX(0.55%); /* Safari 和 Chrome */
        -o-transform:rotateZ(-2deg) translateX(0.55%); 
    }
    100% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
}
@-webkit-keyframes lineMoveFZ_Y {
    0% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
    50% {
        transform:rotateZ(-2deg) translateX(0.55%);
        -ms-transform:rotateZ(-2deg) translateX(0.55%);   /* IE 9 */
        -moz-transform:rotateZ(-2deg) translateX(0.55%);  /* Firefox */
        -webkit-transform:rotateZ(-2deg) translateX(0.55%); /* Safari 和 Chrome */
        -o-transform:rotateZ(-2deg) translateX(0.55%); 
    }
    100% {
        transform:rotateZ(0deg) translateX(0px);
        -ms-transform:rotateZ(0deg) translateX(0px);   /* IE 9 */
        -moz-transform:rotateZ(0deg) translateX(0px);  /* Firefox */
        -webkit-transform:rotateZ(0deg) translateX(0px); /* Safari 和 Chrome */
        -o-transform:rotateZ(0deg) translateX(0px); 
    }
}