phone_uni_xiongan/pages/index/index.css

.inx_lbt{ position: relative;}
.inx_lbt .lh-swiper{ height: 400rpx;}
.inx_lbt:before{ content: ''; position:absolute; top:0; left: 0; width:100%; z-index: 2;background: linear-gradient(bottom, rgba(0,0,0,0), rgba(0,0,0,.4)); height: 80rpx; display: block;}
.inx_1{ position: absolute; top:20rpx; left: 40rpx; right: 40rpx; z-index: 6; height: 60rpx;align-items: center;
	 }
.inx_wz{width:136rpx ; font-size:28rpx ; color: #fff; }

.inx_sch{ flex: 1; background:rgba(255,255,255,.3); border-radius: 10rpx; height: 56rpx; line-height:56rpx; box-shadow: rgba(0,0,0,.1) 10rpx 0 30rpx;}
.sch_ipt{ padding-left: 10rpx; padding-right: 60rpx; font-size: 28rpx; height: 56rpx; line-height: 56rpx; position: relative;  font-size: 28rpx;}
.sch_ipt .uni-input-input{height: 56rpx; line-height: 56rpx;}
.inx_user{ width: 45rpx; height: 45rpx; margin-left:10rpx }
.usr_img{width: 45rpx; height: 45rpx;}

/*工具*/
.swiper_tol{ height: 360rpx;}
.inx_tol_box{ padding:40rpx 30rpx; align-items: center;  flex-flow: row wrap; justify-content: flex-start}
.tol_unit{ width: 20%; margin-bottom: 40rpx; text-align: center;}
.tol_img{ width:60rpx ; height: 60rpx;}
.tol_txt{ font-size: 28rpx; color: #333; }


/*热点话题*/
.scol_ht_box {white-space: nowrap;width: 100%;}
.scol_unit {display: inline-block;width: 45%;height: 400upx;margin-right: 15rpx; border:4rpx solid #ddd; border-radius: 15rpx;}

.inx_ht_warp{ margin-top:40rpx}
.ht_pic{ width:100%; height:260rpx ; border-radius: 15rpx;}

.scol_ht_box .scol_unit:last-child{ margin-right: 0;}


/*广告条*/
.ad-swiper{ height:160rpx ;}
.ad-image{ border-radius: 15rpx; height: 240rpx; width: 100%;}


/* 国际庄 */
.tol_2_warp{ flex-direction:row column; flex-wrap:wrap; justify-content:center; align-content:center;align-items:center; margin-bottom: 40rpx; }
.tol_2_unit{ width: 31%; text-align: center; height: 200rpx; border-radius: 15rpx; margin-right: 3.5%; box-shadow: rgba(0,0,0,.06) 0rpx 0rpx 15rpx; }
.tol_2_warp .tol_2_unit:first-child{ width: 100%; background:linear-gradient(left,#e5fffc,#f2ffe7) /* #e5fffc */; margin-bottom: 25rpx; margin-right: 0; height: 160rpx;}
.tol_2_warp .tol_2_unit:nth-child(2){ background:linear-gradient(45deg,#e5f1ff,#e5fffe)/* #e5f1ff */ ;}
.tol_2_warp .tol_2_unit:nth-child(3){ background:linear-gradient(45deg,#ffedf3,#ffe4f9)/* #ffe5e7 */}
.tol_2_warp .tol_2_unit:last-child{ margin-right: 0; background:linear-gradient(45deg,#fedbcf,#ffeacf) /* #fcecd7 */;}
.gjz_box{ padding: 15rpx;}
.gjz_pic{ width: 100rpx; height: 100rpx; }
.jqr_1 .ht_text{ font-weight: normal; /* font-weight: 600; */ font-size: 34rpx;}
.gjz_box .ht_text{ font-weight: normal; font-size: 30rpx;}
.tol_2_warp .tol_2_unit:first-child .ht_text{font-size: 34rpx;}
.jqr_1{ text-align: left; padding-left: 180rpx; padding-right: 120rpx; padding-top:40rpx; position: relative; z-index: 3; }
.jqr_p{ font-size: 28rpx; color: #666;}
.jqr_pic{ position: absolute; z-index: 0; width: 100%; height: 200rpx; left: -0rpx; top:-30rpx;border-radius: 10rpx;}

.tit_com_2{ font-weight: bold; font-size: 45rpx;}
.tit_com_2 text{ color: #00ceb9; display: inline-block; padding: 0 5rpx;  font-size: 46rpx; /* text-decoration: underline;*/  }


.tol_2_warp .tol_2_unit:first-child .jqr_1{padding-top:20rpx;}

/* 两个并列 */
.tol_2_warp .half_unit{ border-radius: 15rpx; box-shadow: 0 0 15rpx rgba(0,0,0,.06);}
.tol_2_warp .half_unit:nth-child(3){background:linear-gradient(45deg,#fedbcf,#ffeacf); width: 48%;  }
.tol_2_warp .half_unit:nth-child(2){margin-right: 2%; background:linear-gradient(45deg,#e5f1ff,#e5fffe); }
.half_unit .gjz_pic{width: 90rpx; height: 90rpx; }


/*tab切换*/
.tab_warp{ margin-top:40rpx}
.tab_warp .scol_unit{width: 94%; margin-right: 30rpx; border:none; height: 540rpx; position:relative; }
.tab_warp .ht_pic{height:540rpx ; border-radius: 15rpx; }
.tab_txt{ position: absolute; bottom: 0rpx; left: 0rpx; width: 100%;  z-index: 3;background: linear-gradient(bottom,rgba(19,18,18,.6),rgba(0,0,0,0)); padding:40rpx 0 20rpx 0 ;border-radius: 15rpx; }
.tab_txt .ht_text{ color: #fff; display: block;margin:0 40rpx; font-weight: 600; font-size: 36rpx; }
.level_tab{position: absolute; bottom: 30rpx; right:30rpx; display: inline-block; background: rgba(0,0,0,.7); padding: 0 30rpx; height: 56rpx; line-height: 56rpx; color: #fff; font-size: 25rpx; border-radius: 60rpx; box-shadow: rgba(0,0,0,.1) 0 0 20rpx;}
.inx_tab{ text-align: center; margin-bottom: 30rpx; display: block; margin-top:80rpx}
.inx_tab text{ display: inline-block; padding: 0 10rpx 0 0; position: relative; font-size: 28rpx; color: #aaa;}
.inx_tab .onc{position: relative; display: inline-block; color: #00b8a5; font-size: 34rpx; /* font-weight: bold; */}

.pd_scl_new .scol_unit:last-child{ margin-right: 40rpx;}
.tab_txt6{margin-left: 30rpx; padding-right: 40rpx; text-align: center;}
.tab_txt6 .ht_text{color: #fff; display: block; font-weight: bold; margin:0; max-height: 120rpx; line-height: 60rpx; font-size: 40rpx; -webkit-line-clamp:2; margin: 10rpx 0 30rpx 0;}
.tab_txt6 .mssj_adr{color: #fff; display:inline-block; font-size: 25rpx; -webkit-line-clamp:1; height: auto; border:4rpx solid rgba(255,255,255,.3); background: rgba(0,0,0,.3); border-radius: 50rpx; padding: 0 30rpx;}



/*印象邯郸*/
.yin_warp, .yin_warp2{flex-direction:row column; flex-wrap:wrap; justify-content:flex-start; align-content: flex-start;align-items:flex-start; /* margin-bottom: 40rpx; */ height: 600rpx;}
.yin_warp2{ height: auto;}
.unit_city{ height: 240rpx; position: relative; width: 31%; text-align: center;  border-radius: 15rpx; margin-right: 3.5%; box-shadow: rgba(0,0,0,.1) 0rpx 0rpx 15rpx; margin-bottom: 30rpx;  }
.city_img{ width: 100%;height: 240rpx; border-radius: 15rpx; overflow: hidden; }
.city_zhe{ height: 240rpx; width: 100%; background: radial-gradient(rgba(15,15,15,0), rgba(10,10,10,.6));position: absolute; left: 0; bottom:0;border-radius: 0 0 15rpx 15rpx}
.city_zhe text{display: block; text-align: center; /* line-height: 100rpx; */padding-top:170rpx; color: #fff; font-size: 36rpx;  font-weight: 700;  text-shadow: rgba(0,0,0,.3) 0 0 15rpx; letter-spacing: 6rpx; }
.yin_warp .unit_city:nth-child(1), .yin_warp .unit_city:nth-child(2){ width: 48.25%;}
/* .yin_warp .unit_city:nth-child(1) .city_zhe{background: radial-gradient(rgba(153,51,51,0), rgba(153,51,51,1));} */
.yin_warp .unit_city:nth-child(2){  margin-right: 0;}


.yin_warp .unit_city:nth-child(3){height: 220rpx; }
/* .yin_warp .unit_city:nth-child(3) .city_zhe{background: radial-gradient(rgba(0,51,0,0), rgba(0,51,0,1));} */
.yin_warp .unit_city:nth-child(3) .city_img{height: 220rpx;}
.yin_warp .unit_city:nth-child(3) .city_zhe{height: 220rpx;}

.yin_warp .unit_city:nth-child(4){ height: 220rpx;}
/* .yin_warp .unit_city:nth-child(4) .city_zhe{background: radial-gradient(rgba(51,102,102,0), rgba(51,102,102,1));} */
.yin_warp .unit_city:nth-child(4) .city_img{height: 220rpx;}
.yin_warp .unit_city:nth-child(4) .city_zhe{height: 220rpx;}


.yin_warp .unit_city:nth-child(5){margin-right: 0; height: 220rpx;}
/* .yin_warp .unit_city:nth-child(5) .city_zhe{background: radial-gradient(rgba(153,102,52,0), rgba(153,102,52,1));} */
.yin_warp .unit_city:nth-child(5) .city_img{height: 220rpx;}
.yin_warp .unit_city:nth-child(5) .city_zhe{height: 220rpx;}



/*0930*/
.yx_warp_2{width: 90%; display: inline-block; margin-left: 20rpx;}
.scol_ht_box .yx_warp_2:first-child, .scol_ht_box .yx_warp_2:only-child{margin-left: 0;}
.scol_ht_box .yx_warp_2:last-child{margin-right: 40rpx;}
/* .scol_ht_box .yx_warp_2:nth-child(2) .unit_city:nth-child(1) .city_zhe{ background: linear-gradient(rgba(25,92,57,0), rgba(25,92,57,1));height: 220rpx;} */
/* .yin_warp2 .unit_city:nth-child(3n){margin-right: 0; } */
.yin_warp2 .unit_city:nth-child(1){width: 65.5%; height: 240rpx; }
/* .yin_warp2 .unit_city:nth-child(1) .city_zhe{background: radial-gradient(rgba(153,51,51,0), rgba(153,51,51,1));} */
.yin_warp2 .unit_city:nth-child(1) .city_img{height: 240rpx;}
.yin_warp2 .unit_city:nth-child(1) .city_zhe{height: 240rpx;}


.yin_warp2 .unit_city:nth-child(2){margin-right: 0;height: 240rpx; }
/* .yin_warp2 .unit_city:nth-child(2) .city_zhe{background: radial-gradient(rgba(153,102,52,0), rgba(153,102,52,1));} */
.yin_warp2 .unit_city:nth-child(2) .city_img{height: 240rpx;}
.yin_warp2 .unit_city:nth-child(2) .city_zhe{height: 240rpx;}


.yin_warp2 .unit_city:nth-child(3){height: 240rpx; }
/* .yin_warp2 .unit_city:nth-child(3) .city_zhe{background: radial-gradient(rgba(0,51,0,0), rgba(0,51,0,1));} */
.yin_warp2 .unit_city:nth-child(3) .city_img{height: 240rpx;}
.yin_warp2 .unit_city:nth-child(3) .city_zhe{height: 240rpx;}


.yin_warp2 .unit_city:nth-child(4){width: 65.5%; margin-right: 0;height: 240rpx;}
/* .yin_warp2 .unit_city:nth-child(4) .city_zhe{background: radial-gradient(rgba(51,102,102,0), rgba(51,102,102,1));} */
.yin_warp2 .unit_city:nth-child(4) .city_img{height: 240rpx;}
.yin_warp2 .unit_city:nth-child(4) .city_zhe{height: 240rpx;}


/* 1009 */
.unit_city6 .city_img{ height: 196rpx;}
.unit_city6 .ht_text{ font-weight: bold; padding-top:10rpx}




/*视觉邯郸*/
.shij_list{ border-radius: 15rpx; box-shadow: rgba(0,0,0,.1) 0rpx 0rpx 50rpx; margin-bottom: 30rpx; }
.shij_img{ position: relative; }
.shij_pic{ width: 100%; height: 360rpx; border-radius: 15rpx;}
/* .shij_img:before{ display: block; position: absolute; left: 0; top:0; width: 100%; height:360rpx ; content: ''; background: radial-gradient(rgba(0,0,0,.2) 5%, rgba(0,0,0,.2) 15%, rgba(0,0,0,.3) 60%); z-index: 6;} */
.shij_bq{ position: absolute; z-index: 12; right: 20rpx; top: 20rpx; display: inline-block; padding: 8rpx 25rpx; background: rgba(50,50,50,.6); box-shadow:rgba(0,0,0,.1) 0rpx 0rpx 10rpx ; color: #fff; font-size: 24rpx; border-radius: 50rpx;}
.shij_num{position: absolute;z-index: 8; left: 30rpx; top: 0rpx; display: inline-block;background: rgba(255,194,48,1); color: #510202;padding:25rpx 10rpx 15rpx 10rpx; font-size: 24rpx; border-radius: 0rpx 0 50rpx 50rpx; }
.shij_inf{ padding:0  20rpx; }
.shij_inf .ht_text{ /* padding-bottom:20rpx; font-weight: 700; */}
.sp_num, .sp_like{ display: inline-block; padding-bottom: 40rpx; color: #999; font-size: 28rpx; margin-right: 20rpx;}
.inx_ht_warp .shij_list:nth-child(n+4) .shij_num{ display: none;}
.sj_pic_play{ position: absolute; width: 120rpx; height: 120rpx; top:120rpx; left:50% ; margin-left: -60rpx; z-index: 7;}

.inx_xcp .ht_text{ padding-bottom:40rpx; font-weight: 700; /* text-align: center; */}
.inx_xcp .shij_list{border-radius: 0;box-shadow:none; border-bottom: 2rpx solid #eee; padding-top:20rpx}
.inx_zhib .ht_text{ padding-bottom:0}
.inx_xcp .inx_ht_warp{margin-top:10rpx}



/*活动*/
.hd_warp .shij_list{ margin-bottom: 0; box-shadow: none; border-bottom: 2rpx solid #eee; }
.hd_warp .shij_img:before{ display: none;}
.hd_box .pic_shop{ width: 180rpx; height: 180rpx; box-shadow: rgba(0,0,0,.1) 10rpx 10rpx 0;}
.hd_box .fod_sp_box{ width:95%}
.hd_box .mssj_tit{-webkit-line-clamp: 2;}
.hd_warp .mssj_adr{ margin-bottom: 20rpx; }
.hd_warp .shij_pic{border-radius: 15rpx;}
.hd_warp .shij_inf{padding-left: 0;}
.hd_lst{width: 180%;  display: flex;}
.hd_bqa{ display: inline-block; padding:15rpx 30rpx; background: rgba(255,194,48,1); color: #510202; font-size: 26rpx; position: absolute; top:0; left: 0; z-index: 1; border-radius: 15rpx 0 15rpx 0; font-weight: bold;}


/*攻略*/
.glue_warp .mssj_tit{ font-size: 32rpx; font-weight: bold; }
.glue_warp .mssj_adr{-webkit-line-clamp:3}
.unit_book{  position: relative; width: 31%;   border-radius: 15rpx; margin-right: 3.5%;  margin-top: 30rpx;  }
.book_warp .unit_book:nth-child(3n){ margin-right:0}
.book_warp{justify-content:flex-start !important}
.book_warp .city_img{ width: 180rpx; height: 180rpx; }
.book_warp .ht_text{ text-align: center; padding-left: 0; max-height: 51rpx;}
.glue_bq_1{position:absolute; left: 5rpx; bottom:15rpx; display: inline-block; padding: 10rpx 25rpx; border-radius: 40rpx 0 25rpx 0; background: rgba(255,194,48,1); color: #510202; font-size: 24rpx;}

.glue_warp .pic_shop{ width: 300rpx;}
.glue_warp .yin_warp{ height: auto;}



/*音频*/
.voice_warp .shij_list{ box-shadow: none; border-bottom: 2rpx dashed #eee; margin-bottom: 40rpx; padding-bottom: 60rpx; border-radius: 0;}
.voice_warp .shij_list:last-child{ border-bottom: none;}
.voice_warp .shij_img{ margin-top:20rpx; position: relative;}
.voice_warp .shij_img:before{ display: none;}
.voice_warp .shij_pic{border-radius: 15rpx;}
.voice_warp .shij_inf{ position: absolute; bottom: 0; left: 0; background: linear-gradient(bottom, rgba(0,0,0,.8), rgba(0,0,0,0)) ; display: block; width:100%; padding: 0; border-radius: 0 0 10rpx 10rpx;}
.voice_warp .sp_num{ padding-left: 20rpx; }
.voice_warp .sp_num, .voice_warp .sp_like{ color: #fff;padding-bottom: 20rpx;}
.voe_btn{ position:absolute; z-index: 4; width: 100rpx; height: 100rpx; right: 20rpx; bottom: 10rpx; box-shadow: rgba(0,0,0,.1) 0 0 15rpx;}
.voe_bt{position: relative;}
.voe_bt .ht_text{ width:85%}
.voe_time{ position: absolute; right: 0; top:6rpx; color: #999; font-size: 28rpx;}

/*路线*/
.line_list{ width: 90%; margin-right: 40rpx; padding: 30rpx; box-shadow: rgba(0,0,0,.1) 0 0rpx 30rpx;  border: 2rpx solid #f5f5f5;/* height: 600upx; */ border-radius: 15rpx; position: relative; height:726rpx ;}
.line_pic{ width: 100%; height: 540rpx;}
.line_list .ht_text{ margin-bottom: 20rpx; font-weight: 700; height: 46rpx;}
.line_list .mssj_adr{ height: 96rpx;}
.line_bq{ position: absolute; top:110rpx; left: 20rpx;}
.line_bq text{  background: #fd5978; display: inline-block; position: relative; padding: 0 30rpx 0 20rpx; color: #fff; font-size: 28rpx; height: 60rpx; line-height: 60rpx;}
.line_bq text:after{ content: ''; display: block; width: 0; height: 0; border-top:60rpx solid #fd5978; border-right: 20rpx solid transparent; right: -20rpx; top:0; position: absolute;}
/* .scol_ht_box .line_list:last-child{ margin-right: 0;} */

.lux_new .yx_warp_3{ margin-right: 0;}
.lux_new{}

.scroll-view {
    position: absolute;
    top: 60rpx;
    right: 0;
    left: 0;
    bottom: 0; 
	z-index: 4;
} 


/* swiper点 样式修改 */
.dots {
			position: absolute;
			bottom: 20rpx;
			left: 50%;
			// 这里一定要注意兼容不然很可能踩坑
			transform: translate(-50%, 0);
			-webkit-transform: translate(-50%, 0);			
			z-index: 99;
			display: flex;
			flex-direction: row;
			justify-content: center;
}
			.dot {
				width: 12rpx;
				height: 12rpx;
				border-radius: 12rpx;
				transition: all .6s;
				background: rgba(50, 50, 50, .3);
				margin-right: 10rpx;
			}

			.active {
				width: 36rpx;
				height: 12rpx;
				border-radius: 12rpx;
				background: rgba(17, 201, 102, 1);
			}