@import "../../assets/stylus/colorConfig"
.productDetail{
  background #f8f8f8
}
.detail-slide{
  width 100%
  min-height 210px
  max-height 375px
  .swiper-container{
    width 100%
    max-height 375px
    .swiper-pagination{
      left: auto
      right: 10px
      text-align: right
      color: #fff
      display: inline-block
      width: auto
      bottom: 10px
      background: #0000007
      font-size: 12px
      padding: 4px 6px
      border-radius: 2px
    }
  }
  .swiper-slide{
    width 100%
    min-height 210px
    max-height 375px
    background url('https://file.luckytrip.cn/IBE/img/pic_hotel.jpg') no-repeat center
    background-size cover
    img{
      min-height 210px
      max-height 375px
    }
  }
}
.detail-content{
  padding 15px 10px
  .search-bar{
    justify-content space-between
    align-items center
    background #fff
    padding 10px
    .date-night{
      padding 3px 8px
      font-size 12px
      border-radius 10px
    }
    .line{
      display inline-block
      width 1px
      height 24px
      background #e5e5e5
    }
    .gray{
      color #d2d2d2
    }
    .bar-cell{
      label{
        font-size 12px
        color mainTitleColor
      }
      p{
        margin-top 7px
        font-size 14px
        font-weight bold
      }
    }
  }
  .detail-bar{
    padding 25px 0px
    span{
      display inline-block
      margin-right 30px
      padding-bottom 15px
      font-size 20px
      color subheadColor
      &.active{
        font-weight bold
        font-size 20px
        color subColor
        border-bottom 2px solid subColor
      }
    }
  }
}
.item-content{
  margin-top 15px
  padding 10px
  background #fff
  .itemTitle{
    margin-bottom 15px
    font-weight bold
    font-size 18px
  }
  .flight-box{
    margin-bottom 25px
    .f-title{
      height 30px
      line-height 30px
      box-sizing border-box
      background #6d8493
      background: bg
      font-size 14px
      color #ffffff
      span{
        font-weight bold
      }
      &.back{
        background: bg
      }
      img{
        display inline-block
        position relative
        width 20px
        top 2px
      }
    }
    .f-content {
      .f-name {
        line-height 24px
        font-size 12px
        color mainTitleColor
        img{
          display inline-block
          position relative
          width 18px
          height 18px
          margin 0 5px 0 15px
          top 4px
        }
        .package{
          font-size 12px
          color subheadColor
          i{
            margin-right 3px
            font-size 12px
          }
        }
      }
      .airInfo {
        clear both
        padding 15px 0
        color mainTitleColor
        h1{
          margin-bottom 5px
          font-size 27px
          font-weight bold
        }
        p{
          font-size 11px
        }
      }
      .f-policy {
        font-size 12px
        color subheadColor
        span {
          margin-right 30px
          i {
            margin-right 5px
            font-size 12px
          }
        }
      }
    }
  }
  .f-airType{
    margin-bottom 10px
    span{
      padding 2px 8px
      background mainColor
      border-radius 10px
      font-size 12px
      color #fff
    }
  }

  .f-content{
    margin-bottom 15px
    padding 5px 5px 0px
    background #f8f8fd
  }

  .f-airTip{
    border-top 1px dashed #eee
    padding 10px 0
    font-size 11px
    color #999
    i{
      font-size 13px
    }
  }
  .h-name{
    line-height 22px
    margin-bottom 10px
    p{
      font-weight bold
      font-size 16px
      color mainTitleColor
    }
  }

  .hotel-item-cell{
    min-height 64px
    margin 15px 0 10px
    .item-img{
      position relative
      float left
      width 90px
      height 64px
      background #dddddd
      overflow hidden
      img{
        position: absolute
        width: 150%
        min-height: 100%
        left: 50%
        -webkit-transform: translateX(-50%)
        transform: translateX(-50%)
      }
    }
    .cell-info{
      padding-left 100px
      color mainTitleColor
      h4{
        line-height 18px
        font-weight bold
        font-size 14px
      }
      p{
        line-height 18px
        font-size 12px
      }
      .cell-date-wrap{
        justify-content space-between
        align-items center
        label{
          line-height 14px
          font-size 12px
          span{
            display block
            color subheadColor
          }
        }
        span{
          margin-left 8px
          padding 2px 5px
          border-radius 13px
          font-size 11px
          color subheadColor
        }
      }
    }
  }

}
.h-category{
  span{
    font-size 12px
    color blueColor
    i{
      font-size 14px
      color inherit
    }
  }
  i{
    font-size 20px
  }
}

.h-name{
  line-height 30px
  font-weight bold
  margin 7px 0 14px
  font-size 23px
  span{
    float right
    font-size 13px
    color #2c8bfa
  }
}
.h-label {
  margin 15px 0
  clear both
  span{
    border: 0.04rem solid border_color
    color mainTitleColor
  }
}
.hotel-content{
  padding 20px 0px
  background #fff
  color mainTitleColor
  .hotel-info{
    padding 0 20px
  }
  .h-address-box{
    margin 10px 0 20px
    border-top 1px solid border_color
    border-bottom 1px solid border_color
    .h-address{
      padding 15px 0
      font-size 14px
      line-height 20px
      color subheadColor
      a{
        display inline-block
        width 75px
        margin-left 8px
        color subColor
        i{
          color #e33023
        }
      }
    }
    .h-near{
      margin 5px 0 10px
      ul{
        li{
          margin-bottom 15px
          p{
            font-size 16px
            font-weight bold
            color mainTitleColor
          }
          span{
            font-size 12px
            color subcontentColor
          }
        }
      }
      .showMore{
        display block
        width 200px
        margin auto
      }
    }
  }

}

.h-title{
  display block
  margin-bottom 15px
  font-weight bold
  font-size 20px
}
.showMore{
  display block
  line-height 24px
  font-size 13px
  color blueColor
  text-align center
}
.h-info{
  margin 30px -20px 0
  padding 12px
  background subColor
  border-top-left-radius 10px
  border-top-right-radius 10px
  .h-date{
    .h-info-left{
      padding 10px
      background #fff
      border-radius 3px
      border-top-left-radius 8px
      .h-half{
        display inline-block
        width 48%
      }
      .h-out{
        border-left 1px solid border_color
        padding-left 15px
        box-sizing border-box
      }
    }
    .h-info-right{
      flex 0 0 78px
      padding 10px
      margin-left 12px
      background #fff
      border-radius 3px
      border-top-right-radius 8px
    }
    label{
      font-size 14px
      color contentColor
    }
    p{
      margin-top 6px
      font-size 18px
      font-weight bold
      color subColor
    }
  }
}
.h-roomList{
  padding 25px 0 10px
  margin-bottom 20px
  ul{
    li{
      margin-bottom 10px
      border-radius 5px
      background #fff
      box-shadow 0 0 12px rgba(166, 166, 167, 0.26)
      .r-right{
        position relative
        width 98px
        align-self center
        text-align center
        &:before{
          content ''
          position absolute
          height 100%
          top 0px
          left 0
          width 1px
          background #f7f7f7
        }
        p{
          font-size 16px
          color listColor
          &.green{
            color greenColor
          }
        }
        .room-btn{
          display inline-block
          width 68px
          height 26px
          line-height 26px
          margin-top 5px
          font-size 12px
        }
      }

      .h-room{
        padding 8px 10px
        border-radius 3px
        background #ffffff
        h3{
          min-height 18px
          line-height 18px
          margin-top 4px
          margin-bottom 5px
          font-weight bold
          font-size 14px
          color mainTitleColor
        }
        .tip{
          span{
            display inline-block
            height 22px
            line-height 22px
            margin-right 10px
            padding 0 10px
            background #eee
            border-radius 2px
            font-size 12px
            color contentColor
          }
        }
        .cancel{
          font-size 11px
          color #f35448
          i{
            margin-left 6px
            font-size 12px
          }
        }
      }
    }
  }
}
.gray{
  color #d2d2d2
}

.proFixedTop{
  height 50px
}
