.flex {
  display: flex;
}
.align_center {
  align-items: center;
}
.j_center {
  justify-content: center;
}
.j_between {
  justify-content: space-between;
}
.flex_wrap {
  flex-wrap: wrap;
}
.align_end {
  align-items: flex-end;
}
.over_1 {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.over_2 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: break-word;
  white-space: normal !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.banner {
  width: 19.8rem;
  height: 100vh;
  position: relative;
}
.banner .img1 {
  width: 100%!important;
  height: 100%;
  background: url("../images/banner1.jpg") no-repeat left center/cover;
}
.banner .img2 {
  width: 100%!important;
  height: 100%;
  background: url("../images/banner2.jpg") no-repeat left center/cover;
}
.banner .swiper-container,.banner .swiper-wrapper{
  width: 100%!important;
  height: 100%;
}
.banner_text{
  /* display: inline-block; */
  width:100%;
  position: relative;
  z-index:998;
}
.banner_text_img{
  text-align: center;
  height:0.84rem;
}
.banner_text_img img{
  height:100%;
  letter-spacing: normal;
  display: inline-block;
  vertical-align: top;
}
.banner_text_img.two{
 height:0.3rem;
 margin-top:0.1rem;
}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
  width: 100%;
  bottom:0.3rem;
}
.swiper-pagination-bullet {
  width: 0.1rem;
  height: 0.1rem;
  background: #fff;
  border-radius: 0.1rem;
  cursor: pointer;
  opacity: 1;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 0.42rem;
  height: 0.1rem;
  background: #fff;
  border-radius: 0.1rem;
}
 .logo {
  width: 1.96rem;
  height: 0.51rem;
  background: url("../images/logo_w.png") no-repeat center/100% 100%;
  position: fixed;
  top: 0.24rem;
  left: 0.4rem;
  z-index: 999;
}
.logo.active{
  background: url("../images/logo_g.png") no-repeat center/100% 100%;
}
.nav {
  width: 0.5rem;
  height: 100vh;
  background: #fff;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
  box-shadow: 0 0 0.06rem 0 #ebebeb;
}
.nav_menu {
  width: 0.21rem;
  /* height: 1.2rem; */
  padding-bottom:0.25rem;
  letter-spacing: 0.02rem;
  margin: 0.26rem auto 0;
  cursor: pointer;
  background: url("../images/menu.png") no-repeat center bottom/0.22rem 0.2rem;
}
.nav_menu_text{
  font-size: 0.14rem;
  color:#333;
  font-weight: bold;
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  line-height: 0.21rem;
}
.nav_operate {
  width: 0.5rem;
  position: absolute;
  left: 0;
  bottom: 0;
  background: #107344;
}
.nav_operate_item {
  width: 100%;
  height: 0.58rem;
  border-bottom: 0.01rem solid #04542e;
  position: relative;
}
.nav_operate_item img{
  width:0.25rem ;
  height:0.26rem;
}
.wechat_mask{
  display: none;
  width:1.32rem;
  padding:0.05rem;
  background: #fff;
  box-shadow: 0 0 0.08rem 0.04rem rgba(0, 0, 0, 0.05);
  position: absolute;
  bottom:0;
  right:0.5rem;
}
.wechatCode:hover .wechat_mask{
  display: block;
}
.wechat_mask img{
  width:1.32rem;
  height:1.31rem;
}
.wechat_mask_text{
  font-size: 0.14rem;
  color:#2f6b68;
  text-align: center;
}
.wechat_icon {
  width: 0;
  height: 0;
  border-top: 0.1rem solid transparent;
  border-left: 0.2rem solid #fff;
  border-bottom: 0.1rem solid transparent;
  position: absolute;
  bottom:0.23rem;
  right:-0.1rem;
}
#navPage {
  position: fixed;
  top: 50%;
  left: 0;
  text-align: left;
  transition: all 0.1s ease-out 0s;
  transform: translateY(-50%);
  z-index: 999;
}

#navPage.noactive {
  left: -10%;
}

#navPage li {
  position: relative;
  padding-left: 0.4rem;
}

#navPage li:after {
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 0;
  height: 0.01rem;
  background: #107344;
  content: "";
  transition: all 0.5s ease-out 0s;
}

#navPage li.active:first-child:after {
  width: 0.95rem;
}

#navPage li:first-child + li.active:after {
  width: 0.95rem;
}

#navPage li:first-child + li + li.active:after {
  width: 1.1rem;
}

#navPage li:first-child + li + li + li.active:after {
  width: 0.95rem;
}

#navPage li:first-child + li + li + li + li.active:after {
  width: 1.3rem;
}

#navPage li:first-child + li + li + li + li + li.active:after {
  width: 1.15rem;
}

#navPage li:first-child + li + li + li + li + li + li.active:after {
  width: 0.95rem;
}

#navPage li:first-child + li + li + li + li + li + li + li.active:after {
  width: 1.15rem;
}
#navPage li{
  letter-spacing: -0.5em;font-size: 0;
}
#navPage li a {
  display: inline-block;
  color: #aaa;
  font-weight: 700;
  font-size: 0;
  font-family: Arial;
  line-height: 0.34rem;
  letter-spacing: normal; display: inline-block; vertical-align: top;
}

#navPage li a i,
#navPage li a span {
  display: inline-block;
  vertical-align: middle;
  font-size: 0.14rem;
}

#navPage li a i {
  font-style: normal;
}

#navPage li a span {
  overflow: hidden;
  width: 0;
  white-space: nowrap;
  transition: all 0.5s ease-out 0s;
}

#navPage li a:hover,
#navPage li.active a {
  color: #107344;
}

#navPage li a:hover span,
#navPage li.active a span {
  width: 0.8rem;
}
.profile {
  width: 100%;
  height: 100vh;
  position: relative;
  background: url("../images/p_back.jpg") no-repeat center bottom/cover;
}
.logo_green {
  width: 1.96rem;
  height: 0.51rem;
  background: url("../images/logo_g.png") no-repeat;
  position: absolute;
  top: 0.45rem;
  left: 0.57rem;
}
.profile_title {
  padding-top: 1.22rem;
  position: relative;
  left: -120%;
}
.profile_title_en {
  width: 2.5rem;
  font-size: 0.14rem;
  color: #2f6b68;
  font-weight: bold;
  margin: 0 auto;
}
.profile_title_cn {
  width: 2.5rem;
  font-size: 0.6rem;
  color: #2f6b68;
  font-family: "宋体";
  font-weight: bold;
  margin: 0 auto;
  margin-top: 0.5rem;
}
.profile p {
  font-size: 0.14rem;
  color: #333;
  text-align: center;
  line-height: 3;
  margin-top: 0.56rem;
  position: relative;
  right: -120%;
}
.tea {
  width: 100%;
  height: 100vh;
  position: relative;
  background: url("../images/t_back.jpg") no-repeat center bottom/cover;
}
.tea_title {
  padding-top: 1.72rem;
  position: relative;
  right: -120%;
}
.tea_title_en {
  width: 2.5rem;
  font-size: 0.14rem;
  color: #2f6b68;
  font-weight: bold;
  margin: 0 auto;
}
.tea_title_cn {
  width: 2.5rem;
  font-size: 0.6rem;
  color: #2f6b68;
  font-family: "宋体";
  font-weight: bold;
  margin: 0 auto;
  margin-top: 0.5rem;
}
.tea_container {
  padding-top: 0.47rem;
}
.tea_container_bold {
  font-size: 0.26rem;
  color: #2f6b68;
  font-weight: bold;
  position: relative;
  left: -120%;
  text-align: center;
}
.tea_container_normal {
  font-size: 0.24rem;
  color: #333;
  padding: 0.24rem 0;
  position: relative;
  right: -120%;
  text-align: center;
}
.concept {
  width: 100%;
  height: 100vh;
  position: relative;
  background: url("../images/brand_back.jpg") no-repeat center bottom/cover;
}
.concept_left {
  width: 30%;
}
.concept_container {
  width: 10rem;
  margin: 0 auto;
  padding-top: 2rem;
}
.concept_title {
  position: relative;
  left: -30%;
  opacity: 0;
}
.concept_title_en {
  font-size: 0.24rem;
  color: #2f6b68;
  line-height: 1.5;
}
.concept_title_cn {
  font-size: 0.3rem;
  color: #2f6b68;
  line-height: 1.5;
}
.concept_nav {
  margin-top: 0.3rem;
}
.concept_nav_li {
  padding-left: 0.44rem;
  margin-bottom: 0.43rem;
  cursor: pointer;
  position: relative;
  transform: translateY(0.3rem);
}
.concept_nav_li.show {
  transform: translateY(0);
}
.concept_nav_li:last-child {
  margin-bottom: 0;
}
.concept_nav_li:first-child {
  background: url("../images/yiyecha.png") no-repeat left top/0.27rem 0.36rem;
  transition: all 0.5s ease 0s;
}
.concept_nav_li:nth-child(2) {
  background: url("../images/yizuocheng.png") no-repeat left top/0.34rem 0.33rem;
  transition: all 0.7s ease 0s;
}
.concept_nav_li:nth-child(3) {
  background: url("../images/yfwh.png") no-repeat left top/0.33rem 0.33rem;
  transition: all 0.9s ease 0s;
}
.concept_nav_li.on:first-child {
  background: url("../images/yiyecha01.png") no-repeat left top/0.27rem 0.36rem;
}
.concept_nav_li.on:nth-child(2) {
  background: url("../images/yizuocheng01.png") no-repeat left top/0.34rem 0.33rem;
}
.concept_nav_li.on:nth-child(3) {
  background: url("../images/yfwh01.png") no-repeat left top/0.33rem 0.33rem;
}
.concept_nav_li_line {
  width: 0.3rem;
  height: 0.02rem;
  background: #696969;
  transition: all 0.6s ease 0s;
  margin-top: 0.18rem;
}
.concept_nav_li_title {
  padding-left: 0.06rem;
  margin-top: 0.1rem;
}
.concept_nav_li_cntitle {
  font-size: 0.18rem;
  color: #333;
}
.concept_nav_li_entitle {
  font-size: 0.12rem;
  color: #333;
  margin-top: 0.06rem;
}
.concept_nav_li.on .concept_nav_li_line {
  background: #7c9b99;
  width: 0.6rem;
}
.concept_nav_li.on .concept_nav_li_cntitle,
.concept_nav_li.on .concept_nav_li_entitle {
  color: #2f6b68;
}
.concept_right {
  width: 3.9rem;
  height: 5.1rem;
  position: relative;
  right: -30%;
}
.concept_right ul,.concept_right li {
  width: 3.9rem!important;
  height: 5.1rem!important;
}
.concept_right li img {
  width: 100%;
  height: 100%;
}
.concept_right_text {
  width: 4.85rem;
  height: 1.45rem;
  background: #fff;
  box-shadow: 0 0 0.08rem 0.04rem rgba(0, 0, 0, 0.05);
  position: absolute;
  bottom: 0.69rem;
  right: -0.05rem;
}
.concept_right_text_con {
  padding: 0.18rem 0.4rem;
}
.concept_right_text_title {
  font-size: 0.24rem;
  color: #2f6b68;
}
.concept_right_text_p {
  font-size: 0.16rem;
  color: #333;
  padding-top: 0.16rem;
}
.concept_right_prev_next {
  width: 10%;
  position: absolute;
  left: 0.47rem;
  bottom: 0.15rem;
}
.concept_right_prev,
.concept_right_next {
  cursor: pointer;
  width:0.09rem;
  height:0.15rem;
}
.concept_right_next img,.concept_right_prev img{
  display: block;
  width:100%;
  height:100%;
}
.product {
  width: 12rem;
  margin: 0 auto;
  height: 100vh;
}
.product_nav {
  width: 35%;
  margin: 0 auto;
  padding-top: 1.36rem;
}
.product_nav_item {
  display: block;
  padding-top: 0.59rem;
  background: url("../images/p_icon01.png") no-repeat center top/0.55rem 0.42rem;
  transform: translateY(0.3rem);
  letter-spacing: -0.5em;font-size: 0;
}
.product_nav_item.show {
  transform: translateY(0);
}
.product_nav_item:first-child {
  transition: all 0.5s ease 0s;
}
.product_nav_item:nth-child(2) {
  transition: all 0.7s ease 0s;
}
.product_nav_item:nth-child(3) {
  transition: all 0.9s ease 0s;
}
.product_nav_item.active {
  background: url("../images/p_icon02.png") no-repeat center top/0.55rem 0.42rem;
}
.product_nav_item span {
  font-size: 0.3rem;
  color: #333333;
  letter-spacing: normal; display: inline-block; vertical-align: top;
}
.product_nav_item.active span {
  color: #2f6b68;
}
.product_container {
  padding-top: 1.2rem;
}
.product_image {
  width: 5.15rem;
  height: 4.7rem;
  background: url("../images/product01.png") no-repeat center/100% 100%;
  position: relative;
  left: -120%;
}
.product_list {
  width: 50%;
  padding-left: 1.17rem;
  position: relative;
  right: -120%;
}
.product_item {
  display: none;
}
.product_item.active {
  display: block;
}
.product_item_entitle {
  font-size: 0.14rem;
  color: #333;
  font-weight: bold;
  margin-bottom: 0.2rem;
}
.product_item_cntitle {
  font-size: 0.6rem;
  color: #333;
  position: relative;
  z-index: 2;
}
.product_item_cntitle::after {
  content: "";
  width: 2.27rem;
  height: 0.16rem;
  background: #d1da88;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -1;
}
.product_item_text {
  margin-top: 1.2rem;
}
.product_item_text p {
  font-size: 0.2rem;
  color: #333;
  line-height: 1.6;
}
.product_item_text p strong {
  padding-bottom: 0.04rem;
  border-bottom: 0.02rem solid #eee;
}
.lookDetail {
  display: block;
  width: 1.2rem;
  height: 0.32rem;
  border-radius: 0.32rem;
  border: 0.01rem solid #2f6b68;
  color: #2f6b68;
  font-size: 0.16rem;
  margin-top: 0.5rem;
  text-align: center;
  line-height: 0.32rem;
}
.science {
  width: 12rem;
  height: 100vh;
  margin: 0 auto;
}
.science_nav {
  width: 35%;
  margin: 0 auto;
  padding-top: 1.36rem;
}
.science_nav_item {
  display: block;
  padding-top: 0.59rem;
  background: url("../images/p_icon01.png") no-repeat center top/0.55rem 0.42rem;
  transform: translateY(0.3rem);
  letter-spacing: -0.5em;font-size: 0;
}
.science_nav_item.show {
  transform: translateY(0);
}
.science_nav_item:first-child {
  transition: all 0.5s ease 0s;
}
.science_nav_item:nth-child(2) {
  transition: all 0.7s ease 0s;
}
.sciencet_nav_item:nth-child(3) {
  transition: all 0.9s ease 0s;
}
.science_nav_item.active {
  background: url("../images/p_icon02.png") no-repeat center top/0.55rem 0.42rem;
}
.science_nav_item span {
  font-size: 0.3rem;
  color: #333333;
  letter-spacing: normal; display: inline-block; vertical-align: top;
}
.science_nav_item.active span {
  color: #2f6b68;
}
.science_list {
  padding-top: 1.73rem;
  display: none;
}
.science_list.active {
  display: flex;
}
.science_ul {
  width: 48%;
}
.science_ul.left {
  position: relative;
  left: -120%;
}
.science_ul.right {
  position: relative;
  right: -120%;
}
.science_item {
  width: 46%;
}
.science_item_title {
  font-size: 0.3rem;
  color: #333;
  text-align: center;
}
.science_image {
  width: 2.73rem;
  height: 2.63rem;
  margin: 0 auto;
}
.science_image img {
  width: 100%;
  height: 100%;
}
.science_temp {
  font-size: 0.3rem;
  color: #333;
  text-align: center;
}
.science_temp span {
  font-size: 0.16rem;
}
.science_text {
  font-size: 0.14rem;
  color: #333;
  line-height: 1.8;
  margin-top: 0.3rem;
}
.time {
  width: 100%;
  height: 100vh;
  background: url("../images/back_xxx.jpg") no-repeat center/cover;
}
.time_container {
  width: 42%;
}
.time_title {
  width: 62%;
  margin: 0 auto;
  text-align: center;
  position: relative;
  right:-120%;
}
.time_title_en {
  font-size: 0.18rem;
  color: #fff;
}
.time_title_cn {
  font-size: 0.6rem;
  color: #fff;
  font-weight: bold;
  font-family: "宋体";
  margin-top: 0.3rem;
}
.time_container p {
  font-size: 0.2rem;
  color: #fff;
  text-align: center;
  line-height: 2;
  margin-top: 0.69rem;
  position: relative;
  left:-120%;
}
/* .time_container p.top{
  margin-top: 0.69rem;
}

.landIn span {
  animation: landIn 0.8s ease-out both;
}
.lang span {
  animation: landIn 0.8s ease-out both;
}
@keyframes landIn {
  from {
    opacity: 0;
    transform: translateY(-20%);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
} */
.article{
  width:100%;
  height:100vh;
  position: relative;
}
.article_image{
  width:14.84rem;
  height:4.33rem;
  position: absolute;
  left:4.39rem;
  bottom:1.32rem;
}
.article_image img{
  width:100%;
  height:100%;
}
.article_con{
  width:10.3rem;
  margin:0 auto;
}
.article_title{
  font-size: 0.6rem;
  color:#333;
  padding-top:1.48rem;
  position: relative;
  left:-120%;
}
.article_con p{
  font-size: 0.2rem;
  color:#666666;
  margin-top:0.63rem;
  line-height: 2;
  position: relative;
  right:-120%;
}
.contact{
  width:100%;
  height:100vh;
  background: url("../images/contact.jpg")no-repeat center/cover;
}
.contact_container{
  padding-top:1.98rem;
}
.contact_main{
  margin: 0 auto;
  height: 5.04rem;
  max-width: 12rem;
  transform-style: preserve-3d;
  perspective: 10rem;
}
.contact_left{
  float: left;
    padding: 0.4rem 0.5rem;
    width: 3.2rem;
    height: 4.25rem;
    background: rgba(16, 115, 68, .65);
    box-shadow: -0.2rem 0 0.2rem rgb(0 0 0 / 20%) inset;
    color: #FFF;
    transition: all 1s ease 0s;
    transform: rotateY(
-80deg
);
    transform-origin: right center;
    transform-style: preserve-3d;
}
.section.active .contact_left {
  transform: rotateY(0);
}
.contact_right{
  height:5.04rem;
  background: #fff;
}
.contact_left_en{
  font-size: 0.2rem;
  color:#fff;
  font-family: "宋体";
}
.contact_left_cn{
  font-size: 0.24rem;
  color:#fff;
  padding-top:0.19rem;
  font-family: "宋体";
}
.form_item{
  padding:0.2rem 0;
  border-bottom:0.01rem solid #fff;
  margin-top:0.27rem;
}
.form_item input{
  display:block;
  border:none;
  padding:0;
  margin:0;
  font-size: 0.16rem;
  color:#fff;
  font-family: "宋体";
  background: 0;
  outline: none;
}
.form_item input::placeholder{
  color:#fff;
  font-size: 0.16rem;
  font-family: "宋体";
}
.form_btn{
  display: block;
  width:3.2rem;
  height:0.5rem;
  font-size: 0.16rem;
  background: #fff;
  color:#0f5634;
  text-align: center;
  font-family: "宋体";
  margin-top:0.5rem;
  line-height: 0.5rem;
}
.contact_right_title{
  font-size: 0.24rem;
  color:#2f6b68;
  font-family: "宋体";
  font-weight: bold;
  margin-top:0.76rem;
  text-align: center;
}
.contact_right p{
  font-size: 0.16rem;
  color:#333;
  line-height: 2;
  font-family: "宋体";
  font-weight: bold;
  text-align: center;
  margin-top:0.3rem;
}
.contact_right_subtitle{
  font-size: 0.16rem;
  color:#333;
  line-height: 2;
  font-family: "宋体";
  font-weight: bold;
  text-align: center;
  margin-top:0.42rem;
  padding:0 0.2rem;
}
.contact_right_list{
  width:69%;
  margin: 0 auto;
  margin-top:0.4rem;
}
.contact_right_item_icon{
  width:100%;
  text-align: center;
  letter-spacing: -0.5em;font-size: 0;
}
.contact_right_item_icon img{
  width:0.45rem;
  min-height:0.45rem;
  letter-spacing: normal; display: inline-block; vertical-align: top;
}
.contact_right_item_title{
  font-size: 0.16rem;
  color:#333;
  text-align: center;
  margin-top:0.2rem;
  font-family: "宋体";
  font-weight: bold;
}
.contact_right_item_text{
  font-size: 0.16rem;
  color:#333;
  text-align: center;
  margin-top:0.2rem;
  font-family: "宋体";
  font-weight: bold;
}
.footer{
  font-size: 0.14rem;
  color:#fff;
  font-weight:bold;
  font-family: "宋体";
  text-align: center;
  line-height: 2;
  margin-top:0.57rem;
}
.footer a{
  color:#fff;
}
.mask{
  display: none;
  width:100%;
  height:100vh;
  background: #fcfaf8;
  position: fixed;
  top:0;
  left:0;
  z-index: 9999;
}
.mask_nav{
  width:2.8rem;
  height:100vh;
  float: left;
  background: url("../images/productList01.png")no-repeat center/cover;
  box-shadow: 0 0 0.08rem 0.04rem rgba(0, 0, 0, 0.05);
}
.mask_logo{
  display: block;
  width:1.96rem;
  height:0.51rem;
  background: url("../images/logo_w.png")no-repeat center/100% 100%;
  margin:0 auto;
  margin-top:0.35rem;
}
.mask_nav_list{
  margin-top:0.77rem;
}
.mask_nav_item{
  padding-left:0.77rem;
  height:0.53rem;
  font-size: 0.16rem;
  color:#fff;
  position: relative;
  line-height: 0.53rem;
}
.mask_nav_item.active{
  background: #f7f4f2;
  color:#2f6b68;
  font-weight: bold;
}
.mask_nav_item.active::before{
  content:"";
  width:0.72rem;
  height:0.02rem;
  background: #0f5634;
  position: absolute;
  margin:auto;
  top:0;
  bottom:0;
  left:0;
}
.mask_close{
  width:0.3rem;
  height:0.3rem;
  background: url("../images/close.png")no-repeat center/0.3rem 0.3rem;
  position: absolute;
  top:0.5rem;
  right:0.5rem;
  cursor: pointer;
  padding:0.05rem;
}
.mask_close:hover{
  background: #2f6b68 url("../images/close02.png")no-repeat center/0.3rem 0.3rem;
}
.mask_container{
  width:calc(100% - 2.8rem);
  height:100vh;
  float: left;
  overflow-x: hidden;
  overflow-y:scroll;
}
.mask_banner{
  width:100%;
}
.mask_banner img{
  width:100%;
  display: block;
}
.mask_desc{
  width:100%;
  padding:0.6rem 0;
  background: #fff;
}
.mask_desc_container{
  width:12rem;
  height:3.6rem;
  background: url("../images/kuang.png")no-repeat center/100% 100%;
  position: relative;
  margin:0 auto;
}
.mask_desc_title{
  width:3.03rem;
  text-align: center;
  font-size: 0.3rem;
  color:#7e6342;
  font-weight: bold;
  position:absolute;
  left:4.91rem;
  top:-0.15rem;
}
.mask_desc_sub{
  width:64%;
  margin:0 auto;
  padding-top:0.93rem;
}
.mask_desc_sub span{
  font-size: 0.18rem;
  color:#7e6342;
}
.mask_desc_container p{
  font-size: 0.16rem;
  color:#333;
  text-align: center;
  line-height: 2.5;
  margin-top:0.5rem;
}
.mask_detail{
  width:100%;
}
.mask_detail img{
  display: block;
  width:100%;
}
.phone_mask{
  display: none;
  width:1.6rem;
  height:0.58rem;
  background: #04542e;
  position: absolute;
  right:0.5rem;
  top:0;
  font-size: 0.14rem;
  color:#fff;
  line-height: 0.58rem;
  text-align: center;
}
.nav_operate_item.phone:hover .phone_mask{
  display: block;
}