.addbottom {
  text-align: center;
  background: url("../img/addbotom/bac.png") repeat-x;
  background-size: auto 100%;
  height: 14rem; }
  .addbottom .wechatimg {
    display: inline-block;
    height: .6rem;
    width: .7rem;
    padding: .7rem 0 .2rem 0; }
  .addbottom .code-w {
    display: flex;
    flex-direction: row;
    justify-content: center; }
    .addbottom .code-w .lr {
      text-align: center;
      width: 3rem; }
      .addbottom .code-w .lr .cat {
        font-size: 15px;
        color: #90caf1; }
      .addbottom .code-w .lr .title {
        font-size: 14px;
        color: #ffffff;
        padding-bottom: .1rem; }
      .addbottom .code-w .lr .code {
        width: 2.1rem;
        height: 2.1rem;
        border: 2px solid #96d2fa;
        display: inline-block; }
        .addbottom .code-w .lr .code img {
          width: 100%;
          height: 100%; }
  .addbottom .weibo {
    padding: .7rem 0 .28rem 0;
    text-align: center; }
    .addbottom .weibo img {
      width: .77rem;
      height: .6rem;
      padding-bottom: .2rem;
      display: inline-block; }
    .addbottom .weibo .cat {
      font-size: 15px;
      color: #90caf1; }
    .addbottom .weibo .title {
      font-size: 14px;
      color: #ffffff;
      padding-bottom: .12rem; }
  .addbottom .contact, .addbottom .bot {
    text-align: center;
    padding-bottom: .3rem; }
    .addbottom .contact div, .addbottom .bot div {
      font-size: 14px;
      color: #ffffff;
      padding-bottom: .18rem;
      line-height: 14px; }
  .addbottom .bot {
    padding-bottom: 0; }
  .addbottom a {
    color: #ffffff; }

.component-newnav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: .9rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  z-index: 5; }
  .component-newnav .logo {
    background: linear-gradient(to right, #0a1422, #1c2743);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 .25rem;
    border-right: 1px solid #263865; }
    .component-newnav .logo img {
      height: .5rem;
      width: 1.5rem;
      margin: auto; }
  .component-newnav .bread-w {
    border-left: 1px solid #000000;
    border-right: 1px solid #263865;
    width: 100%;
    display: flex;
    flex-direction: row;
    line-height: .9rem;
    font-size: 14px;
    background: linear-gradient(to right, #08121e, #1c2743); }
    .component-newnav .bread-w div {
      padding-left: .3rem;
      display: flex; }
      .component-newnav .bread-w div img {
        width: .33rem; }
      .component-newnav .bread-w div span {
        color: #96d2fa; }
  .component-newnav .more {
    border-left: 1px solid #000000;
    background-color: #1c2743;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: .29rem; }
    .component-newnav .more div {
      width: .48rem;
      height: 2px;
      background-color: #96d2fa; }
  .component-newnav .list-wrapper {
    position: fixed;
    top: .9rem;
    left: 0;
    right: 0;
    bottom: 0;
    display: none; }
    .component-newnav .list-wrapper.active {
      display: block; }
      .component-newnav .list-wrapper.active .list {
        right: 0; }
    .component-newnav .list-wrapper .mask {
      opacity: 1;
      background-color: rgba(0, 0, 0, 0.5);
      z-index: 1;
      width: 100%;
      height: 100%;
      -webkit-transition: .3s;
      -moz-transition: .3s;
      -ms-transition: .3s;
      -o-transition: .3s;
      transition: .3s; }
    .component-newnav .list-wrapper .list {
      position: fixed;
      top: .9rem;
      bottom: 0;
      right: -500px;
      padding: 1rem .64rem 0 .8rem;
      background: linear-gradient(to top, #0f1f35, #1b2c54);
      width: min-content;
      -webkit-transition: .3s;
      -moz-transition: .3s;
      -ms-transition: .3s;
      -o-transition: .3s;
      transition: .3s; }
      .component-newnav .list-wrapper .list #component-close {
        position: absolute;
        left: 0;
        top: 5.8rem;
        width: .4rem;
        height: .8rem;
        background-color: #2d478b;
        border-radius: 0 5px 5px; }
        .component-newnav .list-wrapper .list #component-close .arrow {
          width: 7px;
          height: 7px;
          border-top: 2px solid #96d2fa;
          border-right: 2px solid #96d2fa;
          position: absolute;
          left: 49%;
          top: 50%;
          -webkit-transform: translate(-50%, -50%) rotate(45deg);
          -moz-transform: translate(-50%, -50%) rotate(45deg);
          -ms-transform: translate(-50%, -50%) rotate(45deg);
          -o-transform: translate(-50%, -50%) rotate(45deg);
          transform: translate(-50%, -50%) rotate(45deg); }
      .component-newnav .list-wrapper .list .row {
        width: 3.6rem;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        margin-bottom: .22rem; }
        .component-newnav .list-wrapper .list .row a {
          width: 1.6rem;
          height: .58rem;
          background-color: #96d2fa;
          border-radius: 4px;
          font-size: 15px;
          color: #414142;
          line-height: .58rem;
          text-align: center; }

.cover-box {
  height: 4.6rem;
  position: relative; }
  .cover-box .img-box {
    height: 100%;
    overflow: hidden; }
    .cover-box .img-box img {
      width: 100%;
      height: 100%; }
  .cover-box .info-box {
    position: absolute;
    top: 0;
    padding-top: .5rem;
    padding-left: .4rem;
    color: #fff; }
    .cover-box .info-box .city-name {
      font-size: .5rem;
      line-height: .5rem;
      margin-bottom: .25rem; }
    .cover-box .info-box .weather-box {
      font-size: .3rem;
      line-height: .3rem;
      margin-bottom: .25rem; }
    .cover-box .info-box .air-info {
      font-size: .3rem;
      line-height: .3rem;
      margin-bottom: .25rem; }
  .cover-box .img-num {
    position: absolute;
    right: 0.4rem;
    bottom: 0.4rem;
    font-size: .26rem;
    line-height: .26rem;
    color: #fff; }

.city-compass {
  width: 3rem;
  height: .8rem;
  background-color: #ffcc00;
  box-shadow: 0 1px 0 0 #ed8b00;
  border-radius: .04rem;
  font-size: .36rem;
  line-height: .8rem;
  color: #424141;
  text-align: center;
  margin: 0.43rem auto;
  position: relative; }
  .city-compass:after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    top: .25rem;
    left: 2.3rem;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 7px solid #424141; }

.popular-box {
  height: 3.9rem; }
  .popular-box .title-box {
    margin-left: .42rem;
    margin-right: .42rem;
    height: .82rem;
    display: flex;
    justify-content: space-between; }
    .popular-box .title-box h4 {
      font-size: .4rem;
      align-self: center; }
    .popular-box .title-box a {
      align-self: center;
      box-sizing: border-box;
      font-size: .28rem;
      color: #969696;
      width: .85rem;
      padding-right: .28rem;
      background: url("../img/common/arrowCity.png") no-repeat right center;
      background-size: .13rem auto; }
  .popular-box .slider-box ul {
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch; }
    .popular-box .slider-box ul li {
      width: 3rem;
      margin-right: .22rem;
      display: inline-block;
      vertical-align: top; }
      .popular-box .slider-box ul li:nth-child(1) {
        margin-left: .42rem; }
      .popular-box .slider-box ul li a {
        display: block;
        position: relative; }
        .popular-box .slider-box ul li a .ableBook {
          position: absolute;
          left: 0;
          top: .25rem;
          width: 42px;
          height: 20px;
          font-size: 14px;
          line-height: 20px;
          border-radius: 0 10px 10px 0;
          background: #ffcc00;
          text-indent: 13px; }
        .popular-box .slider-box ul li a .isSupportScanCode {
          position: absolute;
          right: -5px;
          top: 1.5rem;
          height: 18px;
          font-size: 12px;
          color: #fff;
          background: #ff6262;
          padding: 0 7px;
          border-radius: 4px;
          vertical-align: middle; }
          .popular-box .slider-box ul li a .isSupportScanCode .scan {
            height: 12px;
            width: 12px;
            vertical-align: middle;
            display: inline-block; }
          .popular-box .slider-box ul li a .isSupportScanCode span {
            vertical-align: middle; }
        .popular-box .slider-box ul li a .img-box {
          overflow: hidden;
          height: 2rem; }
          .popular-box .slider-box ul li a .img-box img {
            width: 100%; }
      .popular-box .slider-box ul li .name {
        font-size: .24rem;
        margin-top: .15rem;
        white-space: normal;
        text-align: justify; }

.must-view-box > .title-box {
  margin-left: .42rem;
  margin-right: .42rem;
  height: .82rem;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #e5e5e5; }
  .must-view-box > .title-box h4 {
    font-size: .4rem;
    align-self: center; }
  .must-view-box > .title-box a {
    align-self: center;
    box-sizing: border-box;
    font-size: .28rem;
    color: #969696;
    width: .85rem;
    padding-right: .28rem;
    background: url("../img/common/arrowCity.png") no-repeat right center;
    background-size: .13rem auto; }
.must-view-box .list-box .item {
  height: 2.9rem;
  box-sizing: border-box;
  padding: .4rem;
  border-bottom: 1px solid #f0f0f0;
  position: relative; }
  .must-view-box .list-box .item .isSupportScanCode {
    position: absolute;
    bottom: 10px;
    right: -5px;
    height: 18px;
    font-size: 12px;
    color: #fff;
    line-height: 17px;
    background: #ff6262;
    padding: 0 7px;
    border-radius: 4px;
    vertical-align: inherit;
    z-index: 1; }
    .must-view-box .list-box .item .isSupportScanCode .scan {
      height: 12px;
      width: 12px;
      display: inline-block;
      vertical-align: middle; }
    .must-view-box .list-box .item .isSupportScanCode span {
      vertical-align: middle; }
  .must-view-box .list-box .item .ableBook {
    position: absolute;
    left: 0;
    top: 0.3rem;
    width: 42px;
    height: 20px;
    font-size: 14px;
    line-height: 20px;
    border-radius: 0 10px 10px 0;
    background: #ffcc00;
    text-indent: 13px; }
  .must-view-box .list-box .item .item-left {
    float: left;
    width: 2.73rem;
    height: 100%;
    position: relative; }
    .must-view-box .list-box .item .item-left a {
      display: block;
      height: 100%;
      overflow: hidden; }
      .must-view-box .list-box .item .item-left a .cover-img {
        width: 100%;
        height: 100%; }
  .must-view-box .list-box .item .item-right {
    display: inline-block;
    margin-left: .5rem;
    width: 3.4rem;
    height: 100%;
    position: relative; }
    .must-view-box .list-box .item .item-right h4 {
      font-size: 17px;
      color: #414142;
      margin-top: .13rem;
      margin-bottom: 0.2rem;
      line-height: 17px;
      height: 17px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap; }
    .must-view-box .list-box .item .item-right .comment-box {
      font-size: 0;
      margin-bottom: .3rem; }
      .must-view-box .list-box .item .item-right .comment-box > div {
        display: inline-block; }
      .must-view-box .list-box .item .item-right .comment-box .star-wrapper {
        width: 1.3rem;
        height: .22rem; }
      .must-view-box .list-box .item .item-right .comment-box .score, .must-view-box .list-box .item .item-right .comment-box .rate {
        font-size: .22rem;
        line-height: .22rem;
        vertical-align: super;
        color: #959595; }
      .must-view-box .list-box .item .item-right .comment-box .score {
        margin-left: .28rem; }
      .must-view-box .list-box .item .item-right .comment-box .rate {
        cursor: pointer;
        margin-left: .23rem; }
    .must-view-box .list-box .item .item-right .tag {
      width: 1.16rem;
      height: 0.41rem;
      border-radius: 4px;
      font-size: .2rem;
      line-height: .41rem;
      text-align: center; }
      .must-view-box .list-box .item .item-right .tag.dushi {
        color: #f55858;
        border: solid 1px #f55858; }
      .must-view-box .list-box .item .item-right .tag.lishi {
        color: #3ebbdf;
        border: solid 1px #3ebbdf; }
      .must-view-box .list-box .item .item-right .tag.ziran {
        color: #3edf99;
        border: solid 1px #3edf99; }
      .must-view-box .list-box .item .item-right .tag.hongse {
        color: #fa7d49;
        border: solid 1px #fa7d49; }
    .must-view-box .list-box .item .item-right .address {
      font-size: 12px;
      line-height: 12px;
      color: #a1a1a2;
      position: absolute;
      bottom: 0;
      height: 12px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      width: 100%; }
.must-view-box .view-more {
  display: block;
  width: 4.28rem;
  height: .97rem;
  border: solid 1px #969696;
  font-size: .34rem;
  line-height: .97rem;
  color: #969696;
  text-align: center;
  margin: 0.4rem auto; }

.zhusu-box {
  height: 4.3rem; }
  .zhusu-box .title-box {
    margin-left: .42rem;
    margin-right: .42rem;
    height: .82rem;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: .4rem; }
    .zhusu-box .title-box h4 {
      font-size: .4rem;
      align-self: center; }
    .zhusu-box .title-box a {
      align-self: center;
      box-sizing: border-box;
      font-size: .28rem;
      color: #969696;
      width: .85rem;
      padding-right: .28rem;
      background: url("../img/common/arrowCity.png") no-repeat right center;
      background-size: .13rem auto; }
  .zhusu-box .slider-box ul {
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden; }
    .zhusu-box .slider-box ul li {
      width: 3rem;
      margin-right: .22rem;
      display: inline-block;
      vertical-align: top; }
      .zhusu-box .slider-box ul li:nth-child(1) {
        margin-left: .42rem; }
      .zhusu-box .slider-box ul li a {
        display: block; }
        .zhusu-box .slider-box ul li a .img-box {
          overflow: hidden;
          height: 2rem; }
          .zhusu-box .slider-box ul li a .img-box img {
            width: 100%; }
      .zhusu-box .slider-box ul li .name {
        font-size: .24rem;
        margin-top: .15rem;
        white-space: normal;
        text-align: justify; }

.must-eat-box > .title-box {
  margin-left: .42rem;
  margin-right: .42rem;
  height: .82rem;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: .4rem; }
  .must-eat-box > .title-box h4 {
    font-size: .4rem;
    align-self: center; }
  .must-eat-box > .title-box a {
    align-self: center;
    box-sizing: border-box;
    font-size: .28rem;
    color: #969696;
    width: .85rem;
    padding-right: .28rem;
    background: url("../img/common/arrowCity.png") no-repeat right center;
    background-size: .13rem auto; }
.must-eat-box .item-box {
  margin-left: .42rem;
  margin-right: .42rem;
  height: 5.48rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
  margin-bottom: .4rem; }
  .must-eat-box .item-box .item {
    width: 3.24rem;
    height: 2.62rem; }
    .must-eat-box .item-box .item .img-box {
      height: 2.16rem;
      overflow: hidden; }
      .must-eat-box .item-box .item .img-box img {
        width: 100%;
        height: 100%; }
    .must-eat-box .item-box .item .title {
      font-size: .24rem;
      line-height: .24rem;
      color: #424141;
      padding-top: .2rem; }

.must-go-box > .title-box {
  margin-left: .42rem;
  margin-right: .42rem;
  height: .82rem;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: .4rem; }
  .must-go-box > .title-box h4 {
    font-size: .4rem;
    align-self: center; }
  .must-go-box > .title-box a {
    align-self: center;
    box-sizing: border-box;
    font-size: .28rem;
    color: #969696;
    width: .85rem;
    padding-right: .28rem;
    background: url("../img/common/arrowCity.png") no-repeat right center;
    background-size: .13rem auto; }
.must-go-box .item-box {
  margin-left: .42rem;
  margin-right: .42rem;
  height: 5.48rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
  margin-bottom: .4rem; }
  .must-go-box .item-box .item {
    width: 3.24rem;
    height: 2.62rem; }
    .must-go-box .item-box .item .img-box {
      height: 2.16rem;
      overflow: hidden; }
      .must-go-box .item-box .item .img-box img {
        width: 100%;
        height: 100%; }
    .must-go-box .item-box .item .title {
      font-size: .24rem;
      line-height: .24rem;
      color: #424141;
      padding-top: .2rem; }

.must-play-box {
  height: 3.9rem; }
  .must-play-box .title-box {
    margin-left: .42rem;
    margin-right: .42rem;
    height: .82rem;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: .4rem; }
    .must-play-box .title-box h4 {
      font-size: .4rem;
      align-self: center; }
    .must-play-box .title-box a {
      align-self: center;
      box-sizing: border-box;
      font-size: .28rem;
      color: #969696;
      width: .85rem;
      padding-right: .28rem;
      background: url("../img/common/arrowCity.png") no-repeat right center;
      background-size: .13rem auto; }
  .must-play-box .slider-box ul {
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden; }
    .must-play-box .slider-box ul li {
      width: 3rem;
      margin-right: .22rem;
      display: inline-block;
      padding-bottom: .2rem; }
      .must-play-box .slider-box ul li:nth-child(1) {
        margin-left: .42rem; }
      .must-play-box .slider-box ul li a {
        display: block; }
        .must-play-box .slider-box ul li a .img-box {
          overflow: hidden;
          height: 2rem; }
          .must-play-box .slider-box ul li a .img-box img {
            width: 100%; }
      .must-play-box .slider-box ul li .name {
        font-size: .24rem;
        line-height: .24rem;
        margin-right: .1rem;
        margin-top: .2rem; }

.activity-box .title-box {
  margin-left: .42rem;
  margin-right: .42rem;
  height: .82rem;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: .4rem; }
  .activity-box .title-box h4 {
    font-size: .4rem;
    align-self: center; }
  .activity-box .title-box a {
    align-self: center;
    box-sizing: border-box;
    font-size: .28rem;
    color: #969696;
    width: .85rem;
    padding-right: .28rem;
    background: url("../img/common/arrowCity.png") no-repeat right center;
    background-size: .13rem auto; }
.activity-box .item-box .item {
  margin-left: .42rem;
  margin-right: .42rem;
  margin-bottom: .5rem; }
  .activity-box .item-box .item a {
    display: block; }
    .activity-box .item-box .item a .img-box {
      height: 3.9rem;
      overflow: hidden; }
      .activity-box .item-box .item a .img-box img {
        width: 100%;
        height: 100%; }
    .activity-box .item-box .item a .title {
      font-size: .3rem;
      line-height: .36rem;
      color: #424141;
      padding-top: .23rem;
      margin-bottom: .23rem; }
    .activity-box .item-box .item a .activity-info {
      font-size: .24rem;
      line-height: .36rem;
      color: #a7a7a7; }
    .activity-box .item-box .item a .activity-time {
      font-size: .24rem;
      line-height: .36rem;
      color: #a7a7a7; }
.activity-box .view-more {
  display: block;
  width: 4.28rem;
  height: .97rem;
  border: solid 1px #969696;
  font-size: .34rem;
  line-height: .97rem;
  color: #969696;
  text-align: center;
  margin: 0.4rem auto; }

.more-trip-box {
  padding: 0 20px;
  padding-bottom: 1.33rem; }
  .more-trip-box .moretrip {
    font-size: .4rem;
    color: #424141;
    border-bottom: 1px solid #e2e2e2;
    padding: .55rem 0 .23rem 0; }
  .more-trip-box .trip-list .trip-item {
    position: relative;
    height: 3.25rem;
    padding: .34rem 0 .24rem 0;
    border-bottom: 1px solid #e2e2e2; }
    .more-trip-box .trip-list .trip-item:last-child {
      border-bottom: 0; }
    .more-trip-box .trip-list .trip-item .trip-l {
      float: left;
      width: 3.22rem;
      font-size: 14px; }
      .more-trip-box .trip-list .trip-item .trip-l .title {
        color: #424141;
        margin-bottom: .3rem; }
      .more-trip-box .trip-list .trip-item .trip-l .desc {
        color: #a09d9d; }
    .more-trip-box .trip-list .trip-item .img {
      float: right;
      width: 3.06rem;
      height: 2.24rem; }
      .more-trip-box .trip-list .trip-item .img img {
        width: 100%;
        height: 100%; }
    .more-trip-box .trip-list .trip-item .bott {
      position: absolute;
      bottom: .24rem;
      width: 100%; }
      .more-trip-box .trip-list .trip-item .bott .bott-item {
        color: #79797b;
        font-size: 12px;
        margin-right: .44rem; }
      .more-trip-box .trip-list .trip-item .bott .looked {
        float: right;
        color: #b8b7b7; }
  .more-trip-box .view-more {
    display: block;
    width: 4.28rem;
    height: .97rem;
    border: solid 1px #969696;
    font-size: .34rem;
    line-height: .97rem;
    color: #969696;
    text-align: center;
    margin: 0.4rem auto; }

.mask-compass-box {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: #fff;
  padding: .4rem;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch; }
  .mask-compass-box .close-btn {
    position: absolute;
    top: .2rem;
    right: .2rem;
    width: .68rem;
    height: .68rem; }
  .mask-compass-box .city-name {
    font-size: .48rem;
    line-height: .48rem;
    color: #414142;
    margin-bottom: 1.04rem; }
  .mask-compass-box .info {
    font-size: 18px;
    font-weight: bolder;
    line-height: .34rem;
    color: #414142;
    margin-bottom: .4rem; }
  .mask-compass-box .title {
    font-size: .28rem;
    line-height: .28rem;
    color: #424141;
    padding-bottom: .25rem;
    border-bottom: 1px solid #e2e2e2; }
  .mask-compass-box .jianjie-content {
    padding: .4rem 0;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: 1px;
    color: #424141; }
  .mask-compass-box .traffic-title {
    font-size: .28rem;
    line-height: .8rem;
    color: #969696;
    height: .8rem; }
  .mask-compass-box .traffic-content {
    font-size: .28rem;
    line-height: .42rem;
    color: #969696; }

.swiper-container {
  position: absolute !important;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0; }
  .swiper-container.active {
    background: black; }
  .swiper-container img {
    width: 100%;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute; }
  .swiper-container .swiper-pagination-fraction {
    color: #ffffff;
    font-size: 18px; }

.ovfHiden {
  overflow: hidden;
  height: 100%; }

/*# sourceMappingURL=cityDetail.css.map */