﻿
/*基本*/
.flexgrow1 {
    flex-grow: 1;
}

.flex_leaf_left_v1 {
         display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
            justify-content: flex-start;
         /*border: solid 1px green;*/
         align-items:  center ;
    flex-wrap: wrap;
}

.flex_leaf_left_v1 .item {
    margin-left: 3px;
}


.flex_leaf_left_v2 {
         display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
            justify-content: flex-start;
         /*border: solid 1px green;*/
       
    flex-wrap: wrap;
}



.flex_leaf_center  {
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
    /*height: 100%;*/
      /*height: 150px;*/
      justify-content: center;
         /*border: solid 1px green;*/
         align-items:  center ;
    flex-wrap: wrap;
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}



.flex_leaf_center_v1  {
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
      justify-content: center;
         /*border: solid 1px green;*/
         align-items:  center ;
    flex-wrap: wrap;
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}
.flex_leaf_center_v1 .productsort {
    padding: 5px 8px;
        color: #616060;
    font-size: 16px; 
    font-weight: bold;
    cursor: pointer;
    /*text-transform: capitalize;
    -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
    -ms-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;*/
}
    .flex_leaf_center_v1 .productsort:hover {
          color: #e99c2e;
    }

.flex_leaf_space_between_v1  {
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
      justify-content: space-between;
         /*border: solid 1px green;*/
         align-items:  center ;
    /*flex-wrap: wrap;*/
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}



.flex_leaf_space_between_warp_v1  {
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
      justify-content: space-between;
         /*border: solid 1px green;*/
         align-items:  center ;
    flex-wrap: wrap;
    /*flex-wrap: wrap;*/
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}

.flex_leaf_space_between_warp_v2  {
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
      justify-content: space-between;
         /*border: solid 1px green;*/
        
    flex-wrap: wrap;
    /*flex-wrap: wrap;*/
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}
.flex_leaf_space_between_warp_v3  {
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
      justify-content: space-between;
         /*border: solid 1px green;*/
    align-items: flex-end;
    flex-wrap: wrap;
    /*flex-wrap: wrap;*/
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}


.flex_leaf_space_around_v1  {
  
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
    justify-content: space-around;
         /*border: solid 1px green;*/
         align-items:  center ;
    /*flex-wrap: wrap;*/
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}


.flex_leaf_space_around_warp_v1  {
  
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
    justify-content: space-around;
         /*border: solid 1px green;*/
         align-items:  center ;
    flex-wrap: wrap;
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}


.flex_leaf_space_around_warp_v1>.item1 {
    text-align: center;
    border: dotted 1px green;
    margin: 10px auto;
    border-radius: 5px;
}

.flex_leaf_space_around_warp_v1>.item1_flex_column {

     border: dotted 1px green;

    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
    flex-direction: column;
      /*height: 150px;*/
    justify-content: space-around;
         /*border: solid 1px green;*/
         align-items:  center ;
    /*flex-wrap: wrap;*/
}
.flex_leaf_space_around_warp_v1>.item2 {
    text-align: center;
    border: dotted 1px  #FFCB1F;
    margin: 10px auto;
    border-radius: 5px;
}
.flex_leaf_space_around_warp_v1>.item3 {
    margin-bottom: 3px;
}
.flex_leaf_space_around_warp_v1>.itemdata {
    text-align: center;
}

@media screen and (max-device-width: 1024px) {
    .flex_leaf_space_around_warp_v1>.itemdata {
     text-align: center;
        font-size: 13px;
       
}
}


/*加入这个 itemdata_m 自动判断是不是移动端，如果是则隐藏，否则手机端展现不开*/
@media screen and (max-device-width: 1024px) {
  .flex_leaf_space_around_warp_v1>.itemdata_m {
      display: none;
}
}




.flex_leaf_space_around_warp_v1>.itemdata img {
    border-radius: 100px;
    width: 120px;
    height: 120px;
}
@media screen and (max-device-width: 1024px) {
    .flex_leaf_space_around_warp_v1>.itemdata img {
    border-radius: 100px;
        width: 80px;
    height: 80px;
}
}

.flex_leaf_space_around_warp_v1 .itemdataa a{
    color: #fff;
}
.flex_leaf_space_around_warp_v1 .itemdataa a:hover{
    color: #FFCB1F;
}


/*竖向排列样式*/
/*----------------------------------------------------------------*/
.flex_column_leaf_v1 {
      display: -webkit-flex; /* Safari */
         display: flex;
          flex-direction: column;
}
.flex_column_leaf_v1 .item {
    flex: 1;
}

/*----------------------------------------------------------------*/

.flex_column_leaf_space_around_v1  {
    flex-direction: column;
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
    justify-content: space-around;
         /*border: solid 1px green;*/
         align-items:  center ;
    /*flex-wrap: wrap;*/
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}
.flex_column_leaf_space_around_v1>.opitem {
    margin: 10px auto;
}

.flex_column_leaf_space_around_v2  {
    flex-direction: column;
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
    justify-content: space-around;
         /*border: solid 1px green;*/
       
    /*flex-wrap: wrap;*/
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}



.flex_column_leaf_space_between_v2  {
    flex-direction: column;
    display: -webkit-flex; /* Safari */
         display: flex;
      width: 100%;
  
      /*height: 150px;*/
    justify-content: space-between;
         /*border: solid 1px green;*/
       
    /*flex-wrap: wrap;*/
    /*width: 100%;
	height: 100px;
	margin: 0 auto;*/
	/*margin-top: -60px;*/
}





/*竖向排列流布局，子元素左右居中*/
.operatebox_leaf_v1 {
    display: -webkit-flex; /* Safari */
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.operatebox_leaf_v1 .item {
    margin: 3px auto;
}
.operatebox_leaf_v1 .item>a {
    color: #fff;
    cursor: pointer;
}
