@charset "utf-8";

* {
    font-family: sans-serif, Arial;
}

.mc_blur {
    -webkit-backdrop-filter: blur(13px);
    backdrop-filter: blur(13px);
}

.btn_breathe {
    -webkit-animation: btn_breathe linear infinite 1.5s;
}

@-webkit-keyframes btn_breathe {
    0% {
        -webkit-transform: scale(1.02);
    }
    50% {
        -webkit-transform: scale(0.95);
    }
    100% {
        -webkit-transform: scale(1.02);
    }
}

.kd_professional_area {
    width: 100%;
    max-width: 30rem;
    margin: 0 auto;
    position: relative;
}

.kd_professional_area::before {
    content: "";
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background-image: linear-gradient(180deg, #ffe7bb, #ffe7bb);
}

.kd_professional_area .banner {
    width: 100%;
    position: relative;
    margin-bottom: 1.23rem;
}

.kd_professional_area .banner .opera {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 10%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1.32rem;
}

.kd_professional_area .banner .opera .city {
    height: 1.58rem;
    color: #26386d;
    font-size: 0.92rem;
    font-weight: bold;
    background-color: #fff;
    display: inline-flex;
    align-items: center;
    border-radius: 100rem;
    padding: 0 0.56rem;
}

.kd_professional_area .banner .opera .city::before {
    content: "";
    display: inline-block;
    margin-right: 0.2rem;
    width: 1rem;
    height: 1rem;
    background: url(../images/ico_city.png) center center/contain no-repeat;
}

.kd_professional_area .banner .opera .rule img {
    height: 1.58rem;
}

.kd_professional_area .kdpro_list {
    margin-bottom: 2rem;
}

.kd_professional_area .kdpro_list .floor {
    margin: 0 0.7rem 0.7rem;
    padding: 0.7rem;
    border-radius: 1.32rem;
    background-color: #fff;
    position: relative;
}

.kd_professional_area .kdpro_list .floor.bg {
    background: #fff url(../images/WIFI.png) right 0.4rem top 0.3rem/auto 2.38rem no-repeat;
}

.kd_professional_area .kdpro_list .floor .sale {
    position: absolute;
    height: 1.54rem;
    line-height: 1.54rem;
    top: 0;
    right: 0;
    border-radius: 0 1.32rem;
    font-size: 0.9rem;
    font-weight: bold;
    color: #fff;
    background-color: #ff8cb6;
    padding: 0 1rem;
    font-style: italic
}

.kd_professional_area .kdpro_list .floor .sale span {
    font-size: 0.6rem;
}


.kd_professional_area .kdpro_list .floor .title {
    display: inline-block;
    font-size: 1.42rem;
    color: #26386d;
    font-weight: bold;
    margin: 0 0.7rem 0.7rem;
    line-height: 1.1;
    position: relative;
    z-index: 1;
}

.kd_professional_area .kdpro_list .floor .title::before {
    content: "";
    width: 110%;
    height: 110%;
    position: absolute;
    left: -7%;
    top: -5%;
    z-index: -1;
    background: url(../images/bg_title.png) left center/100% 100% no-repeat;
}

/* flex;justify-content:space-between;align-items: flex-start;flex-wrap: wrap; */
.kd_professional_area .kdpro_list .floor .list {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.66rem;
	padding-bottom: 1rem;
}

.kd_professional_area .kdpro_list .floor .list li {
    width: calc(50% - 0.33rem);
}

.kd_professional_area .kdpro_list .floor .list li.long {
    width: 100%;
}

.kd_professional_area .kdpro_list .floor .list li img {
    border-radius: 0.8rem;
}

.kd_professional_area .kdpro_list .ban_s {
    margin: 0.92rem 1rem 1.23rem;
}


.kd_professional_area .kdpro_list .floor .img_tit {
    display: block;
    width: calc(100% + 1.4rem);
    margin: 0 -0.7rem;
}

.kd_professional_area .kdpro_list .floor .list2 {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 0.66rem;
    margin-bottom: 0.87rem;
}

.kd_professional_area .kdpro_list .floor .list2 li {
    width: 100%;
}


.kd_professional_area .kdpro_list .floor_2 {
    margin: 0 0.7rem 0.7rem;
    padding: 0.7rem;
    border-radius: 1.32rem;
    background-color: #fff;
}

.kd_professional_area .kdpro_list .floor_2 .title1 {
    display: inline-block;
    font-size: 1.42rem;
    color: #26386d;
    font-weight: bold;
    margin: 0 0.7rem 0.7rem;
    line-height: 1.1;
    position: relative;
    z-index: 1;
}
.kd_professional_area .kdpro_list .floor_2 .title1::before {
    content: "";
    width: 110%;
    height: 110%;
    position: absolute;
    left: -7%;
    top: -5%;
    z-index: -1;
    background: url(../images/bg_title.png) left center/100% 100% no-repeat;
}
.kd_professional_area .kdpro_list .floor_2 .list{width:100%;display:grid;grid-template-columns: repeat(2,1fr);gap:0.57rem 0.8rem;}
.kd_professional_area .kdpro_list .floor_2 .list li{width:100%;background-color: #ffecca;border-radius: 0.8rem;position: relative;font-weight:bold;padding:1.94rem 0.8rem 0.66rem;font-size:0.75rem;line-height:1;color:#43251a;}


.kd_professional_area .kdpro_list .floor_2 .list li .label{height:1.38rem;line-height:1.38rem;font-size:0.87rem;background-image:linear-gradient(90deg,#76a4ff,#6676ff);border-radius:0 0.8rem;padding:0 0.45rem;color:#fff;position: absolute;top:0;right:0;}
.kd_professional_area .kdpro_list .floor_2 .list li:nth-child(2) .label{background-image:linear-gradient(90deg,#fd88b3,#ea5c90);}
.kd_professional_area .kdpro_list .floor_2 .list li .title{font-size:1.32rem;margin-bottom:0.15rem;}
.kd_professional_area .kdpro_list .floor_2 .list li .btn_area{width:100%;margin-top: 0.7rem;height:1.58rem;line-height:1.58rem;border-radius: 100rem;background-image:linear-gradient(90deg,#f77916,#fa3c2e);color:#fff;display: flex;justify-content: space-between;}
.kd_professional_area .kdpro_list .floor_2 .list li .btn_area .price{flex:auto;text-align: center;font-weight:normal;font-size:0.48rem;}
.kd_professional_area .kdpro_list .floor_2 .list li .btn_area .price span{font-size:1.1rem;font-weight:bold;}
.kd_professional_area .kdpro_list .floor_2 .list li .btn_area .btn{flex:auto;text-align: center;font-size:0.7rem;position: relative;}
.kd_professional_area .kdpro_list .floor_2 .list li .btn_area .btn::before{
	content:"";
	position: absolute;top:0;bottom:0;left:0;
	border-left: 1px solid #fff;
	-webkit-transform: skew(-15deg);
	opacity:0.3;
}




.kd_professional_area .kdzq_swi_ban {
    width: 100%;
    padding: 0.4rem 0 0;
    overflow: hidden;
    position: relative;
}

.kd_professional_area .kdzq_swi_ban .box {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.kd_professional_area .kdzq_swi_ban .box .lay {
    height: 100%;
    position: absolute;
    left: 0;
}

.kd_professional_area .kdzq_swi_ban .box .lay:nth-child(2n) {
    left: unset;
    right: 0;
}

.kd_professional_area .kdzq_swi_ban .box .lay img {
    height: 100%;
}

.kd_professional_area .kdzq_swi_ban .box .lay .txt_1 {
    font-size: 0.95rem;
    color: #221d1c;
    font-weight: bold;
    position: absolute;
    top: 5%;
    left: 6%;
    line-height: 1.1;
}

.kd_professional_area .kdzq_swi_ban .box .lay .txt_1 .broadband {
    font-size: 1.36rem;
    letter-spacing: -1px;
    padding-right: 0.2rem;
}

.kd_professional_area .kdzq_swi_ban .box .lay .txt_1 .price {
    font-size: 1.72rem;
    letter-spacing: -1px;
    padding-right: 0.2rem;
    color: #ee1009;
    position: relative;
    top: 1px;
}

.kd_professional_area .kdzq_swi_ban .box .lay .txt_1 .summary {
    font-size: 0.75rem;
}

.kd_professional_area .kdzq_swi_ban .box .lay .txt_2 {
    font-size: 0.95rem;
    color: #221d1c;
    font-weight: bold;
    position: absolute;
    top: 12%;
    left: 6%;
    line-height: 1.1;
}

.kd_professional_area .kdzq_swi_ban .box .lay .txt_2 .broadband {
    font-size: 1.36rem;
    letter-spacing: -1px;
    padding-right: 0.2rem;
}

.kd_professional_area .kdzq_swi_ban .box .lay .txt_2 .price {
    font-size: 1.72rem;
    letter-spacing: -1px;
    padding-right: 0.2rem;
    color: #ee1009;
    position: relative;
    top: 1px;
}
.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_1 {
    font-size: 1.1rem;
    color: #221d1c;
    font-weight: bold;
    position: absolute;
    top: 5%;
    left: 23%;
    bottom: 8%;
    line-height: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
}

.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_1 .price {
    font-size: 1.72rem;
    letter-spacing: -1px;
    padding-right: 0.2rem;
    color: #ee1009;
    position: relative;
    top: 1px;
    line-height: 1;
}

.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_1 .unit {
    font-size: 0.92rem;
}

.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_1 .summary {
    font-size: 0.7rem;
    font-weight: normal;
    white-space: nowrap;
}

.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_1 .btn {
    height: 1.12rem;
    line-height: 1.12rem;
    background-color: #e9517a;
    font-size: 0.7rem;
    color: #fff;
    font-weight: normal;
    border-radius: 100rem;
    padding: 0 0.3rem 0 0.45rem;
    display: inline-flex;
    align-items: center;
}

.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_1 .btn::after {
    content: "";
    width: 0.56rem;
    height: 0.56rem;
    background: url(../images/arrow_r.png) center center/100% 100% no-repeat;
}


.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_2 {
    font-size: 1rem;
    color: #221d1c;
    font-weight: bold;
    position: absolute;
    top: 20%;
    left: 6%;
    bottom: 15%;
    line-height: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_2 .btn {
    height: 1.12rem;
    line-height: 1.12rem;
    background-color: #e9517a;
    font-size: 0.7rem;
    color: #fff;
    font-weight: normal;
    border-radius: 100rem;
    padding: 0 0.3rem 0 0.45rem;
    display: inline-flex;
    align-items: center;
}

.kd_professional_area .kdzq_swi_ban .box.nanjing .lay .txt_2 .btn::after {
    content: "";
    width: 0.56rem;
    height: 0.56rem;
    background: url(../images/arrow_r.png) center center/100% 100% no-repeat;
}




.kd_professional_area #kdzq_swi_dot {
    text-align: center;
}

.kd_professional_area #kdzq_swi_dot .swiper-pagination-bullet {
    width: 4px;
    height: 4px;
    display: inline-block;
    border-radius: 100%;
    background-color: #4da3ff;
    margin: 0 3px !important;
    transition: all ease 0.3s;
    opacity: 0.2;
}

.kd_professional_area #kdzq_swi_dot .swiper-pagination-bullet-active {
    opacity: 1;
    width: 16px;
    height: 4px;
    border-radius: 10px;
    background-color: #4da3ff;
}

.tc_package_upgrade {
    position: fixed;
    width: 100%;
    max-width: 30rem;
    left: 50%;
    bottom: 0;
    -webkit-transform: translateX(-50%);
    background-color: #fff;
    border-radius: 1.76rem 1.76rem 0 0;
    z-index: 11;
    padding: 0.66rem 0.66rem 1.32rem 0.66rem;
}

.tc_package_upgrade .close {
    width: 1.54rem;
    position: absolute;
    top: 0.7rem;
    right: 0.7rem;
}

.tc_package_upgrade .title {
    font-size: 1.32rem;
    color: #090328;
    font-weight: bold;
    text-align: center;
    padding: 0.3rem 0;
    margin-bottom: 0.7rem;
}

.tc_package_upgrade .title span {
    padding: 0 0.87rem;
    background: url(../images/bg_title.png) center center/100% 100% no-repeat;
}

.tc_package_upgrade .product {
    width: 100%;
    overflow: scroll;
    padding: 0 0.2rem;
    margin-bottom: 0.87rem;
}

.tc_package_upgrade .product img {
    width: 100%;
    vertical-align: top;
}

.tc_package_upgrade .btn_area {
    margin: 0 0.2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 100rem;
    overflow: hidden;
    font-size: 1.23rem;
    background-color: #f4e893;
}

.tc_package_upgrade .btn_area .left {
    height: 3.3rem;
    line-height: 3.3rem;
    font-size: 1.23rem;
    text-align: center;
    color: #282828;
    width: 40%;
    padding-left: 0.5rem;
}

.tc_package_upgrade .btn_area .right {
    flex: 1;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    clip-path: polygon(1rem 0%, 0% 100%, 100% 100%, 100% 0%);
    background-color: #ffc71c;
    height: 3.3rem;
    line-height: 3.3rem;
}

.tc_package_upgrade .btn_area .right img {
    height: 1.45rem;
    margin-left: 0.3rem;
}


/* iphone8 */
@media screen and (max-height: 604px) {
    .tc_package_upgrade .product {
        height: 26rem
    }
}


@media (min-width: 501px) and (max-width: 2000px) {
    .kd_professional_area .kdzq_swi_ban .box .lay .txt_1 {
        top: 9%;
    }

    .kd_professional_area .kdzq_swi_ban .box .lay .txt_2 {
        top: 15%;
    }
}