.index_hao{padding: 0;}

.index_hao .container {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  height: 95vh;
}
.index_hao .container .box:nth-child(2n){ margin-top: 50px;}

.index_hao .container .box {
  flex: 1;
  overflow: hidden;
  transition: .5s;
  margin: 0 0.5%;
  line-height: 0;position: relative;
}

.index_hao .container .box > img {
  width: 200%;
  height: calc(100% - 10vh);
  -o-object-fit: cover;
     object-fit: cover;
  transition: .5s; 
}

.index_hao .container .box:hover {
  flex: 1 1 8%;
}

.index_hao .container .box:hover > img {
  width: 100%;
  height:  calc(100% - 10vh);  -o-object-fit: cover;
  object-fit: cover;
}

.box .hao_text{ position: absolute; left: 20px; top:60px; z-index: 22;  width: 80%;}
.box .hao_text  a {display: flex;align-items:flex-start;justify-content:space-between;}
.box .hao_text  a h5{ display: flex;  flex-direction:column;justify-content:center; margin-left: 10px;}
.box .hao_text  a h5 span{ font-size: 23px; color: #bd9f66;writing-mode:tb-rl;line-height: 60px;font-weight: normal;letter-spacing:3px}
.box .hao_text  a h5 b{ font-family:"constan"; font-size: 39px; margin-bottom: 30px;color: #bd9f66; }
.box .hao_text  p{font-size: 15px; color: #666; line-height: 25px;writing-mode:tb-rl; height: 270px; margin-top: 30px;}
@font-face{font-family:"constan";src:url("../font/constan.ttf");}
.index_hao .container .box:hover .hao_text  a h5 span{font-size: 28px;}
.index_hao .container .box:hover .hao_text  a h5 b{font-size: 45px;}
.index_hao .container .box:hover .hao_text   p{font-size: 17px;}

@media screen and (max-width:990px){
  .box .hao_text{ left: 0;}

.box .hao_text a h5 span{ font-size: 20px; }
.box .hao_text a h5 b{ font-size: 30px}
.index_hao .container .box:hover .hao_text  a h5 span{font-size: 24px;}
.index_hao .container .box:hover .hao_text  a h5 b{font-size: 40px;}
.index_hao .container .box:hover .hao_text   p{font-size: 15px;}

}

@media screen and (max-width:767px){
  .box .hao_text a h5{ margin: 0;}
  .box .hao_text p{font-size: 13px;line-height: 22px;}


}


@media screen and (max-width:540px){
  .index_hao .container .box .hao_text{ top: 94px;left: 10px}
  .index_hao .container .box .hao_text  p{display: none;}

}