@keyframes line {
    0% {
        top: 10%
    }

    50% {
        top: 15%
    }

    100% {
        top: 10%
    }
}

@keyframes monney {
    0% {
        top: 43%
    }

    50% {
        top: 49%
    }

    100% {
        top: 43%
    }
}

.flex-box {
    flex-wrap: wrap
}

.price-wrap {
    height: 400px;
    margin-top: 68px;
    background: url("../images/price_banner_bg.png") no-repeat center center/cover
}

.price-wrap .banner-box {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: url("../images/price_banner.png") no-repeat right 90%/47% auto
}

.price-wrap .banner-box h1 {
    font-size: 36px;
    color: #333
}

.price-wrap .banner-box p {
    font-size: 18px;
    line-height: 1.7;
    color: #666;
    opacity: .8
}

.price-wrap .banner-box .price-banner-img {
    width: 340px;
    height: 100%;
    position: relative
}

.price-wrap .banner-box .price-banner-img img {
    position: absolute;
    max-width: 160px;
    animation: line 2.5s ease-in-out infinite
}

.price-wrap .banner-box .price-banner-img .price-banner-monney {
    position: absolute;
    left: 30%;
    max-width: 40px;
    animation: monney 2.5s ease-in-out infinite
}

.compare-wrap {
    margin-top: 68px;
    background: linear-gradient(180deg, #f4f7fa 0%, #fff 100%)
}

.compare-wrap h1.title {
    font-size: 30px;
    line-height: 1;
    margin: 80px auto 50px;
    text-align: center;
    color: #333
}

.compare-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.compare-item {
    width: 31.75%;
    border-radius: 4px 4px 0 0;
    transition: all .3s ease-in-out;
    border: 1px solid #e6e8ef;
    background: #f7fbfe;
    position: relative
}

.compare-item .compare-head {
    border-radius: 4px 4px 0 0;
    overflow: hidden;
    background: linear-gradient(121deg, #8ba9fc 0%, #638df7 100%);
    text-align: center;
    padding: 30px 0
}

.compare-item .compare-head h2 {
    font-size: 24px;
    line-height: 1;
    color: #fff;
    font-weight: bold;
    margin-bottom: 0
}

.compare-item .compare-head p {
    width: 70%;
    margin: 15px auto 0;
    font-size: 14px;
    color: #fff;
    opacity: .8
}

.compare-item .compare-buy {
    display: block;
    margin: 25px auto;
    width: 220px;
    height: 38px;
    line-height: 38px;
    color: #6ba3f7;
    border: 1px solid #6ba3f7;
    background: rgba(107, 163, 247, .1);
    text-align: center;
    transition: all .3s ease-in-out
}

.compare-item .compare-con {
    padding-left: 30px;
    padding-bottom: 80px
}

.compare-item .compare-con h4 {
    font-size: 14px;
    line-height: 1.7;
    color: #999;
    margin-left: 18%;
    margin-bottom: 5px
}

.compare-item .compare-con .compare-con-text {
    padding-left: 18%;
    font-size: 13px
}

.compare-item .compare-con .compare-con-text h3 {
    font-size: 14px;
    font-weight: 600;
    color: #444;
    margin-top: 15px;
    margin-bottom: 5px
}

.compare-item .compare-con .compare-con-text p {
    line-height: 2;
    color: #666
}

.compare-item .compare-con .compare-con-text p i {
    font-size: 13px;
    color: #5b93f1;
    margin-right: 5px
}

.compare-item:hover {
    box-shadow: 0px 9px 34px 1px rgba(212, 213, 222, .47)
}

.compare-item:hover .compare-buy {
    color: #fff;
    border: 1px solid #6ba3f7;
    background: #6ba3f7
}

.compare-item hr {
    width: 100%;
    position: absolute;
    bottom: 50px;
    left: 0
}

.compare-item .price-detail-link {
    position: absolute;
    left: 50%;
    bottom: 7px;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin: 15px auto;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    color: #ec3a3a;
    transform: translateX(-50%);
    transition: all .3s ease-in-out, transform 0s;
    border-bottom: 1px solid
}

.compare-item .price-detail-link:hover {
    color: #ec3a3a;
    border-bottom: 1px solid rgba(0, 0, 0, 0)
}

.compare-item-base {
    background: #f6f7ff
}

.compare-item-base .compare-head {
    background: linear-gradient(101deg, #9a9fea 0%, #6d74cc 100%)
}

.compare-item-base .compare-buy {
    color: #6d74cc;
    background: #f2efff;
    border: 1px solid #6d74cc
}

.compare-item-base .compare-con-text p i {
    color: #9b95eb !important
}

.compare-item-base:hover .compare-buy {
    color: #fff;
    border: 1px solid #6d74cc;
    background: #6d74cc
}

.compare-item-classic {
    background: #fcf8f7;
    overflow: visible;
    position: relative
}

.compare-item-classic .price-most-hot {
    position: absolute;
    top: -6px;
    right: -8px
}

.compare-item-classic .compare-head {
    background: linear-gradient(-36deg, #f15555 0%, #f99191 100%)
}

.compare-item-classic .compare-con-text i {
    color: #f15b5b !important
}

.compare-item-classic .compare-buy {
    color: #ec3a3a;
    background: #ffe7e7;
    border: 1px solid #ec3a3a
}

.compare-item-classic:hover .compare-buy {
    color: #fff;
    border: 1px solid #f46b6b;
    background: #f46b6b
}

.compare-item-com {
    margin-top: 30px;
    width: 100%
}

.compare-item-com .compare-com-box {
    padding: 4% 6%;
    align-items: flex-end
}

.compare-item-com .compare-com-box h2 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    -webkit-background-clip: text;
    background-clip: text;
    color: rgba(0, 0, 0, 0);
    background-image: linear-gradient(90deg, #e2b150 1%, #d38e0b 100%)
}

.compare-item-com .compare-com-box h2 img {
    height: 16px;
    vertical-align: baseline
}

.compare-item-com .compare-com-box p {
    font-size: 16px;
    color: #666
}

.compare-item-com .compare-com-line {
    width: 100%;
    height: 8px;
    background: linear-gradient(92deg, #efbf63 1%, #d7b16b 100%)
}

.compare-item-com .compare-buy-com {
    display: block;
    width: 220px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    color: #d4af6e;
    background: linear-gradient(to right, #f3ce87, #d7b16b, #d7b16b);
    background-size: 200%;
    background-position: 0 0;
    color: #fff;
    border: 1px solid #d7b16b;
    margin: 0 0 0 auto;
    transition: all .3s ease-in-out
}

.compare-item-com .compare-buy-com:hover {
    background-position: 99% 0
}

/*.price-more-wrap {
    background: url("../images/price_more_bg.png") no-repeat center center/cover
}*/

.price-more {
    width: 24%;
    padding: 40px 20px 60px 20px;
/*    background: #fbfcfe url("../images/qiyexinyong_more1.png") no-repeat right 100%/28% auto;*/
    transition: all .3s ease-in-out;
    border-radius: 4px;
    border: 1px solid #fff;
    box-shadow: 0px 11px 13px 0px rgba(189, 199, 208, .25), 0px 0px 4px 0px rgba(215, 225, 240, .21), 0px -2px 6px 0px rgba(219, 225, 232, .25)
}

.price-more h3 {
    font-size: 18px;
    color: #333;
    margin-bottom: 20px
}

.price-more p {
    font-size: 13px;
    color: #999;
    line-break: anywhere;
    line-height: 1.7;
    margin-bottom: 40px
}

.price-more a {
    display: block;
    color: #ec3d3d;
    transition: all .3s ease-in-out
}

.price-more a i {
    font-size: 12px;
    color: #ec3d3d;
    font-weight: lighter;
    margin-left: 2px;
    transition: all .3s ease-in-out
}

.price-more a:hover i {
    margin-left: 8px
}

.price-more:hover {
    transform: translateY(-5px);
    background-color: #f0f4fa
}

/*.price-more-voice {
    background: #fbfcfe url("../images/qiyexinyong_more2.png") no-repeat right 100%/28% auto
}

.price-more-robot {
    background: #fbfcfe url("../images/qiyexinyong_more3.png") no-repeat right 100%/28% auto
}

.price-more-data {
    background: #fbfcfe url("../images/qiyexinyong_more4.png") no-repeat right 100%/28% auto
}*/

.problem-box {
    min-height: 592px
}

.problem-box .problem-head {
    display: flex;
    align-items: center;
    padding: 20px 10px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 18px;
    color: #000;
    transition: all .2s ease-in-out
}

.problem-box .problem-head img {
    margin-right: 10px;
    height: auto
}

.problem-box .problem-head h3 {
    font-size: 18px
}

.problem-box .problem-head h3 img {
    height: 16px;
    vertical-align: 4px;
    margin-left: 0
}

.problem-box .problem-head i {
    margin-left: auto;
    transition: all .3s ease-in-out
}

.problem-box .problem-head:hover {
    background-color: #f2f4fa
}

.problem-box .problem-head:hover i {
    transform: rotate(180deg)
}

.problem-box .problem-head-active i {
    transform: rotate(180deg)
}

.problem-box .problem-con {
    padding: 0 20px 0 40px;
    height: 0;
    color: #666;
    overflow: hidden;
    font-size: 14px;
    line-height: 1.7;
    background-color: #fafbfd;
    transition: all .3s linear
}

.problem-box .problem-con .problem-con-ask {
    line-height: 1;
    height: 18px;
    margin-top: 12px;
    font-size: 12px;
}

.problem-box .problem-con .problem-con-ask span {
    position: relative
}

.problem-box .problem-con .problem-con-ask i {
    cursor: pointer;
    margin-right: 5px;
    color: #999
}

.problem-box .problem-con .problem-con-ask i:nth-child(2) {
    color: #ec3d3d
}

.problem-box .problem-con .problem-con-ask i.price_icon_cai {
    font-size: 18px;
    vertical-align: -3px
}

.problem-box .problem-con .problem-con-ask .iconyangshi_icon_tongyong_dislike {
    vertical-align: -3px
}

.problem-box .problem-con-active {
    padding: 20px 20px 20px 40px;
    height: auto
}

.problem-box .problem-con-active strong {
    font-weight: normal;
    color: #e72735;
    border-bottom: 1px solid
}

.problem-box .problem-con-active span {
    color: #333;
    border-bottom: 1px solid #333
}

.problem-box .problem-line {
    height: 1px;
    border-bottom: 2px dashed #c1bfbf
}

.problem-box .problem-bot-item {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
    color: #666
}

.problem-box .problem-bot-item a {
    cursor: pointer;
    color: #e91821;
    border-bottom: 1px solid #ec3d3d
}

.query-wrap {
    background-color: #eef1f6
}

.query-wrap .query-box {
    max-width: 900px
}

.price-apply-wrap .input-box {
    width: 49%;
    display: flex;
    height: 50px;
    margin-top: 20px;
    padding: 0 10px;
    line-height: 50px;
    background: #fff;
    border: 1px solid #dce0ec;
    border-radius: 4px
}

.price-apply-wrap .input-box:nth-child(n+3) {
    margin-top: 15px
}

.price-apply-wrap .input-box .tel-type {
    display: flex;
    align-items: center
}

.price-apply-wrap .input-box .tel-type i {
    color: #999;
    margin: 3px 10px 0
}

.price-apply-wrap .input-box input {
    flex: 1;
    height: 100%;
    padding-left: 10px;
    line-height: 50px;
    border: none;
    border-radius: 0
}

.price-apply-wrap .input-box input::-webkit-input-placeholder {
    color: #999
}

.price-apply-wrap .input-box input:focus {
    box-shadow: none
}

.price-apply-wrap .input-box input:-webkit-autofill {
    box-shadow: 0 0 0px 100px #fff inset !important;
    background: none !important
}

.price-apply-wrap .input-box .getcode {
    min-width: 120px;
    height: 100%;
    line-height: 50px;
    margin-left: auto;
    border: none;
    color: #999;
    background-color: rgba(0, 0, 0, 0);
    font-size: 14px;
    cursor: pointer
}

.price-apply-wrap .input-box .getcode-able {
    color: #ec3d3d
}

.price-apply-wrap .price-city-box {
    width: 30%
}

.price-apply-wrap .price-city-box .el-cascader {
    line-height: 50px;
    width: 100%
}

.price-apply-wrap .price-submit-box {
    width: 17%;
    display: flex;
    justify-content: center;
    cursor: pointer;
    border-radius: 4px;
    text-align: center;
    font-size: 16px;
    color: #fff;
    background: linear-gradient(98deg, #fb6a6a 0%, #ee4040 100%)
}

.price-apply-wrap .apply-policy {
    width: 100%;
    margin-top: 30px;
    color: #999;
    font-size: 13px;
    text-align: center
}

.price-apply-wrap .apply-policy a {
    font-size: 13px;
    color: #999
}

.use-wrap {
    background: url("../images/price_use_bg.png") no-repeat center center/cover
}

.use-wrap .custom-logo-box {
    padding: 0 75px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap
}

.use-wrap .custom-logo-box .custom-logo {
    width: 19%;
    margin-bottom: 1%;
    transition: all .3s ease-in-out
}

.use-wrap .custom-logo-box .custom-logo img {
    width: 100%
}

.use-wrap .custom-logo-box .custom-logo:hover {
    transform: translateY(-5px);
    box-shadow: 0px 10px 18px rgba(29, 63, 128, .08)
}

.advan-box {
    overflow: hidden;
    border-radius: 12px 12px 0px 0px;
    box-shadow: 0 15px 30px rgba(207, 216, 225, .45)
}

.advan-box .advan-tab-box {
    text-align: center;
    background-color: #f3f5f9
}

.advan-box .advan-tab-box .advan-tab {
    flex: 1;
    padding: 30px 20px;
    border-top: 4px solid rgba(0, 0, 0, 0);
    background-color: #f3f5f9
}

.advan-box .advan-tab-box .advan-tab h3 {
    font-size: 18px;
    margin-bottom: 10px
}

.advan-box .advan-tab-box .advan-tab p {
    font-size: 14px;
    color: #999
}

.advan-box .advan-tab-box .advan-tab-active {
    border-top: 4px solid #e84e47;
    background-color: #fff;
    border-radius: 12px 12px 0px 0px
}

.advan-con-wrap {
    padding: 20px;
    background-color: #fff
}

.advan-con-wrap .advan-con-box .advan-left {
    width: 31%;
    height: 255px;
    border-radius: 4px;
    background: #f3f5f9 url("../images/price_advan_left.png") no-repeat 80px 40px/100% auto;
    transition: all .3s ease-in-out
}

.advan-con-wrap .advan-con-box .advan-left h3 {
    font-size: 30px;
    margin-top: 60px;
    margin-left: 60px
}

.advan-con-wrap .advan-con-box .advan-left span {
    font-size: 14px
}

.advan-con-wrap .advan-con-box .advan-left:hover {
    transform: translateY(-2px);
    box-shadow: 0px 11px 13px 0px rgba(189, 199, 208, .25), 0px 0px 4px 0px rgba(215, 225, 240, .21), 0px -2px 6px 0px rgba(219, 225, 232, .25)
}

.advan-con-wrap .advan-item {
    width: 32.2%;
    height: 117.5px;
    padding-left: 40px;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #f3f5f9;
    transition: all .3s ease-in-out
}

.advan-con-wrap .advan-item h3 {
    font-size: 16px;
    margin-bottom: 5px
}

.advan-con-wrap .advan-item h3 img {
    width: 20px;
    margin-right: 10px;
    vertical-align: middle
}

.advan-con-wrap .advan-item p {
    padding-left: 30px;
    font-size: 14px;
    color: #666
}

.advan-con-wrap .advan-item .advan-item-text {
    padding-left: 30px
}

.advan-con-wrap .advan-item:nth-child(n+4) {
    margin-top: 20px
}

.advan-con-wrap .advan-item:hover {
    transform: translateY(-2px);
    box-shadow: 0px 11px 13px 0px rgba(189, 199, 208, .25), 0px 0px 4px 0px rgba(215, 225, 240, .21), 0px -2px 6px 0px rgba(219, 225, 232, .25)
}

.advan-right {
    flex: 1;
    margin-left: 20px
}

.advan-right .advan-right-top {
    width: 49%;
    height: 120px;
    padding-left: 40px;
    margin-bottom: 20px;
    display: flex;
    overflow: hidden;
    justify-content: space-between;
    align-items: center;
    border-radius: 4px;
    background-color: #f3f5f9;
    transition: all .3s ease-in-out
}

.advan-right .advan-right-top h3 {
    font-size: 36px
}

.advan-right .advan-right-top span {
    font-size: 14px
}

.advan-right .advan-right-top p {
    color: #666
}

.advan-right .advan-right-top img {
    width: 50%;
    height: auto;
    margin-right: -40px;
    margin-top: 80px
}

.advan-right .advan-right-top:hover {
    transform: translateY(-2px);
    box-shadow: 0px 11px 13px 0px rgba(189, 199, 208, .25), 0px 0px 4px 0px rgba(215, 225, 240, .21), 0px -2px 6px 0px rgba(219, 225, 232, .25)
}

.advan-right .advan-right-bot {
    width: 32%;
    height: 115px;
    padding-left: 40px;
    display: flex;
    overflow: hidden;
    justify-content: space-between;
    align-items: center;
    border-radius: 4px;
    background-color: #f3f5f9;
    transition: all .3s ease-in-out
}

.advan-right .advan-right-bot h3 {
    font-size: 30px;
    white-space: nowrap
}

.advan-right .advan-right-bot span {
    font-size: 14px
}

.advan-right .advan-right-bot p {
    color: #666
}

.advan-right .advan-right-bot img {
    width: 40%;
    height: auto;
    margin-top: 20px
}

.advan-right .advan-right-bot:hover {
    transform: translateY(-2px);
    box-shadow: 0px 11px 13px 0px rgba(189, 199, 208, .25), 0px 0px 4px 0px rgba(215, 225, 240, .21), 0px -2px 6px 0px rgba(219, 225, 232, .25)
}



@media screen and (max-width: 768px) {
	.price-wrap {
		margin-top:auto;
	}

	.price-wrap .banner-box {
		flex-wrap: wrap;
		background: none;
	}

	.price-wrap .banner-box .price-banner-img img{
		right: 5rem;
	}

	.price-wrap .banner-box h1{
		font-size: 2rem;
		text-align: center;
        margin-top: 10rem;
	}
	.price-wrap .banner-box p{
		font-size: 1.5rem;
	}


	.price-more-box .price-more{
		width: 48%;
		margin: 15px 0px;
		padding: 40px 15px 60px 15px;
	}


	.problem-box{
		min-height: auto;
	}


	.query-wrap .query-box{
		max-width: 94%;
	}

	.price-apply-wrap .price-submit-box{
		font-size: 13px;
	}


	.pl-none{
		display: none;
	}

	.use-wrap .custom-logo-box{
		padding:inherit;
	}
}



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