:root {
    --size-border-radius: 8px;
    --size-border-radius-s: 4px;

    --size-width-kpart: 1600px;
    --size-width-kpart-spec: 1216px;
    --size-width-kpart-checkout: 360px;
    --size-width-kpart-gap: 24px;

    /* 颜色 */
    --color_1: #12141D;
    --color_2: #666;
    --color_3: #9CA6B9;
    --color_4: #FF5858;
    --color_5: #f7f9fc;
    --color_6: #B8C4CD;
    --color_7: rgb(54 192 146);
    --color_8: rgba(40, 120, 255, 0.10);
    --color_9: #fff;
    --color_10: rgba(184, 196, 205, 0.30);
    --color_11: #FF7C58;
    --color_12: rgba(44, 71, 146, 0.17);
    --color_13: #d9d9d9;
    
    --color-primary: var(--color_7);                    /* 主色 */
    --color-text: var(--color_1);                       /* 一级文本色 */
    --color-text-secondary: var(--color_2);             /* 二级文本色 */
    --color-text-tertiary: var(--color_3);              /* 三级文本色 */
    --color-text-active: var(--color_7);                /* 激活文本色 */
    --color-text-price: var(--color_4);                 /* 价格文本色 */
    --color-link: var(--color_7);                       /* 链接色 */
    --color-text-hightlight: var(--color_11);           /* 高亮文本色 */

    --color-border: var(--color_6);                     /* 边框色 */
    --color-border-active: var(--color_7);              /* 激活边框色 */

    --color-bg-base: var(--color_9);                    /* 基础背景色 */
    --color-bg-secondary: var(--color_5);               /* 二级背景色 */
    --color-bg-button: var(--color_7);                  /* 按钮背景色 */
    --color-bg-active: var(--color_8);                  /* 激活背景色 */
    --color-bg--disabled: var(--color_10);               /* 禁用背景色 */

    --color-divider: var(--color_5);                    /* 分割线色 */
    --color-scrollbar: var(--color_19);                 /* 滚动条颜色 */
    --color-input__placeholder: #9CA6B9;
    --color-input__shodow-focus: rgba(5, 145, 255, 0.1);
    --color-input__border-hover: #5b9bd1;
    --color-input__border-focus: #5b9bd1;
    --color-input__shodow-focus--error: rgba(255,77,79,.2);
    --color-input__background-disabled: rgba(0, 0, 0, 0.06);
    --color-input__border-disabled: #d9d9d9;
    --color-input__text-disabled: rgba(0, 0, 0, 0.25);
}
div {
    box-sizing: border-box;
}
.kpart-checkout.fixed {
	position: fixed;
	top: 0;
	right: max(calc(100% - var(--size-width-kpart)) / 2, 0.00%);
}

.kpart-checkout .wait-pay-content a {
	color: #ffffff;
}

.tab-ctainer {
	width: 100%;
	padding: 16px 32px;
	background: var(--color-bg-base);
    border-radius: var(--size-border-radius-s);
    margin: 0 0px 20px 0;
}

.kpart-item {
	display: flex;
}

.kpart-item-icon {
	width: 4px;
	height: 18px;
	background: var(--color-primary);
	border-radius: 1px;
	margin-right: 10px;
}

.kpart-item-title {
	font-size: 18px;
	line-height: 18px;
	font-weight: 500;
	color: var(--color-text);
}
#v3-content {
	height: 100%;
	background: var(--color-bg-secondary);
}
#kpart_v2 {
    width: var(--size-width-kpart);
    margin: 0 auto;
}
.kpart-body {
    display: flex;
    gap: var(--size-width-kpart-gap);
}
.kpart-spec {
    width: var(--size-width-kpart-spec);
    margin-bottom: 40px;
    /* margin-top: 40px; */
}
.kpart-spec-content, .kpart-spec-desc, .kpart-checkout-content {
    position: relative;
    box-sizing: border-box;
}
.tab-ctainer{
	width: 100%;
    padding: 16px 32px;
    background: var(--color-bg-base);
    border-radius: var(--size-border-radius-s);
    margin: 0 0px 20px 0;
}
.tab-div .div-label {
    width: 142px;
    min-height: 40px;
    flex-shrink: 0;
    font-size: 14px;
    font-weight: bold;
    color: var(--color-text-secondary);
}
.tab-div .div-label .tab-title {
    display: flex;
    align-items: center;
}
.ippool-type .group-content {
    flex: 1;
	display: flex;
}
.zdy-cardGroup-2 {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-right: 20px;
    position: relative;
	border-radius: 10px;
}
#form-ippool-type .zdy-cardbtn-object.active {
    border: 3px solid #fec667;
}
#form-ippool-type .zdy-cardbtn-object::after{
	content: '';
    background-color: rgba(0, 0, 0, 0);
    -webkit-transition: .3s;
    transition: .3s;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    border-radius: 10px;
}
#form-ippool-type .zdy-cardbtn-object.active::after{
	content: "";
    background-color: rgb(81 80 80 / 50%)
}
.zdy-cardbtn-object {
    position: relative;
    border-radius: 10px;
}
.zdy-cardGroup-2 .zdy-cardbtn {
    z-index: 1;
    width: 300px;
    height: 110px;
    padding: 20px;
	padding-top: 23px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 400;
    user-select: none;
    cursor: pointer;
}


.layui-slider-input>span{
	
	font-size: 14px;
}


.qy-title, .xc-title {
    background-color: #eaeaea;
    font-size: 13px;
    color: #a09c9c;
    text-align: center;
    border-radius: 10px;
    height: 25px;
    line-height: 25px;
    display: block;
    width: 76px;
}

.form-ippool-decc-div{
	margin-top: 20px;
}

.form-ippool-decc-div .label{
	padding: .2em .6em .3em !important;
}

.zdy-cardbtn-object .active .qy-title, .zdy-cardbtn-object .active .xc-title {
    color: #333;
	background-color: #fff;
}


#form-ippool-type .zdy-cardbtn.active .label, #form-ippool-type .zdy-cardbtn.active .desc {
    color: #fff;
}
.zdy-cardGroup-2 .zdy-cardbtn .desc {
    font-size: 13px;
    line-height: 24px;
}
.zdy-cardGroup-2::after{
	content: '';
    background-color: rgba(0, 0, 0, 0);
    -webkit-transition: .3s;
    transition: .3s;
    position: absolute;
    top: 2px;
    left: 2px;
    right: 2px;
    bottom: 2px;
    border-radius: 10px;
}



#form-ippool-type .zdy-cardbtn-object {
    border: 2px solid #fff;
}
.zdy-cardGroup-2 .zdy-cardbtn .desc {
    font-size: 13px;
    color: #d1cfcf;
    line-height: 24px;
}

.zdy-cardbtn-object .active .desc {
    color: #fff !important;
}

.zdy-tabs {
	--color-text: #12141D;
    --color-text-active: rgba(40, 120, 255, 1);
    --color-primary: rgba(40, 120, 255, 1);
}

.zdy-tabs .zdy-tabs-header {
	position: relative;
	display: flex;
	gap: 16px;
	margin-bottom: 20px
}

.zdy-tabs .zdy-tabs-header-item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 108px;
	height: 40px;
	font-size: 14px;
	color: var(--color-text);
	cursor: pointer;
	border-bottom: 2px solid transparent
}

.zdy-tabs .zdy-tabs-header-item.active {
	color: #fff;
	background-color: rgb(54 192 146);
	z-index: 1;
	transition: all .3s ease;
	border-radius: 4px 4px 0 0;
}

.zdy-tabs .zdy-tabs-header::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background: var(--color-divider);
	z-index: 0
}


.zdy-tabs .zdy-tabs-content-item {
	display: none
}

.zdy-tabs .zdy-tabs-content-item.active {
	display: block
}
.zdy-radioGroup-2,.zdy-radioGroup {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}
.zdy-radioGroup-2 .zdyradiobtn {
	z-index: 1;
	width: 100px;
	height: 40px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 400;
	user-select: none;
	cursor: pointer;
	background-color: #f7f9fc;
}

.zdy-radioGroup-2 .zdyradiobtn.active {
    background: #fff;
    border: 1px solid rgb(54 192 146);
}

.zdy-radioGroup-2 .zdyradiobtn:hover {
	border: 1px solid rgb(54 192 146);
}

.zdyradiobtn-object {
	position: relative
}

.zdy-radioGroup.hidden {
	display: none
}

.zdy-radioGroup .zdyradiobtn-object {
	box-sizing: border-box;
	width: 100px;
	height: 40px;
	background-color: #f7f9fc;
	border-radius: 4px;
}
.zdy-radioGroup .zdyradiobtn {
	position: relative;
	width: 100px;
	height: 40px;
	top: -1px;
	left: -1px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 400;
	cursor: pointer;
	user-select: none;
	z-index: 1
}

.zdy-radioGroup .zdyradiobtn.active {
	background: #fff;
    border: 1px solid rgb(54 192 146);
}

.zdy-radioGroup .zdyradiobtn:hover {
	border: 1px solid rgb(54 192 146);
}
.zdy-radioGroup-2 {
	display: flex;
	flex-wrap: wrap;
	gap: 18px
}

.zdy-radioGroup-2 .zdyradiobtn {
	z-index: 1;
	width: 100px;
	height: 40px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 400;
	user-select: none;
	cursor: pointer;
	background-color: #f7f9fc;
}

.zdy-radioGroup-2 .zdyradiobtn.active {

    background: #fff;
    border: 1px solid rgb(54 192 146);
	
}

.zdy-radioGroup-2 .zdyradiobtn:hover {
	border: 1px solid rgb(54 192 146);
}
.form-time-select-2 {
	display: flex;
	align-items: center;
	gap: 20px;
}

.zdy-select {
	--color-text: #12141D;
	--color-text-secondary: #6B6D70;
	--color-text--disabled: rgba(0, 0, 0, 0.25);
	--color-border: #B8C4CD;
	--color-border-hover: #4cc0de;
	--color-border-focus: #4cc0de;
	--color-bg-option-selected: rgba(40, 120, 255, 0.1);
	--color-bg-option-hover: rgba(0, 0, 0, 0.04)
}

.zdy-select {
	position: relative;
	height: 40px;
	width: max-content
}

.zdy-select .zdy-select-selector {
	display: flex;
	height: 100%;
	min-width: 108px;
	align-items: center;
	padding: 0 12px;
	box-sizing: border-box;
	border: 1px solid var(--color-border);
	border-radius: 4px;
	cursor: pointer;
	transition: all .2s cubic-bezier(.645, .045, .355, 1)
}

.zdy-select .zdy-select-selector:hover {
	border-color: rgb(54 192 146);
}

.zdy-select .select-value {
	color: var(--color-text);
	font-size: 14px;
	font-weight: 400
}

.zdy-select .zdy-select-arrow {
	margin-left: 12px
}

.zdy-select .zdy-select-arrow>.iconfont {
	color: var(--color-text-secondary);
	font-size: 12px;
	font-weight: 400
}

.zdy-select .select-suffix {
	margin-left: auto;
	color: var(--color-text-secondary);
	font-size: 14px;
	font-weight: 400
}

.zdy-select .zdy-select-dropdown {
	display: none;
	position: absolute;
	left: 0;
	top: calc(100% + 5px);
	min-width: 100%;
	padding: 4px;
	box-sizing: border-box;
	background-color: #fff;
	box-shadow: 0 0 10px 0 rgba(0,0,0,.1);
	border-radius: 4px;
	z-index: 9999
}

.zdy-select .zdy-select-dropdown.dropup {
	top: auto;
	bottom: calc(100% + 5px)
}

.zdy-select .select-options {
	display: flex;
	flex-direction: column;
	gap: 4px
}

.zdy-select .zdy-select-option-item {
	position: relative;
	display: flex;
	align-items: center;
	padding: 0 6px;
	border-radius: 4px;
	min-height: 32px;
	cursor: pointer;
	color: #414040;
}

.zdy-select .zdy-select-option-item.selected {
	font-weight: 700;
	background-color: var(--color-bg-option-selected)
}

.zdy-select .zdy-select-option-item:not(.selected):hover {
	background-color: var(--color-bg-option-hover)
}

.zdy-select.focus .select-value {
	color: var(--color-text--disabled)
}

.zdy-select.focus .zdy-select-selector {
	border-color: rgb(54 192 146);
}

.zdy-select.focus .zdy-select-arrow {
	transform: rotate(180deg)
}

.zdy-select.focus .zdy-select-dropdown {
	display: block
}

.zdyradiobtn-object {
	position: relative
}
.spec-attributes-object {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 32px;
	row-gap: 4px;
}
.attribute-item {
	height: 36px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	width: 400px;
}
.attribute-item-label {
    font-size: 14px;
    width: 140px;
    color: #999;
}
.attribute-item-content {
    font-size: 14px;
}
.link-icon {
	display: flex;
	align-items: center;
	color: #2878FF;
}

.link-icon>.iconfont {
	transition: all .4s cubic-bezier(.175,.885,.32,1.275)
}

.link-icon:hover>.iconfont {
	transform: translateX(4px)
}
.kpart-checkout {
    width: var(--size-width-kpart-checkout);
    position: relative;
}
.zf-title{
    font-size: 16px;
    color: #fff;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background-color: #87b5e3;
    border-radius: 4px 4px 0 0;
}
.PayInfor-item {
	padding: 7px 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

#CouponId{
	color: #FF5858;
}

.PayInfor-item .PayInfor-label {
	font-size: 14px;
	color: var(--color-text-secondary);
}

.PayInfor-item .PayInfor-content {
	font-size: 14px;
	color: var(--color-text);
}

.PayInfor-item .price-integer {
	font-size: 24px;
}

.pay-coupon-container, .pay-submit-container, .pay-method-container {
	margin-top: 16px;
}

.pay-coupon-container .coupon-name {
	color: #FFFFFF;
	margin-top: 2px;
}

.pay-method-divider {
	display: flex;
	align-items: center;
	gap: 16px;
}

.pay-method-divider .divider-line {
	flex: 1;
	height: 1px;
	background: var(--color-divider);
}

.pay-method-divider .divider-text {
	font-size: 12px;
	color: var(--color-text-tertiary);
}

.pay-submit {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 48px;
	border-radius: var(--size-border-radius-s);
	background: var(--color-primary);
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	margin-top: 30px;
    margin-bottom: 15px;
}

.label-default {
    background-color: #d1d1d1 !important;
}

.tab-div{
	margin-bottom: 5px;
}

.pay-submit.disabled {
	background: var(--color-text-tertiary);
	cursor: not-allowed;
}

.pay-method-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
}

.pay-method-title {
	font-size: 16px;
	font-weight: 500;
	color: var(--color-text);
}

.pay-method-price {
	font-size: 16px;
	font-weight: 500;
	color: var(--color-text-secondary);
}

.pay-method-object {
	margin-top: 10px;
}

.pay-channel-item {
	display: flex;
	align-items: center;
	padding: 11px;
	padding-left:16px;
	cursor: pointer;
	background: var(--color-bg-secondary);
	border-radius: var(--size-border-radius-s);
}

.pay-channel-item.pay-channel-balance {
	height: 70px;
}

.pay-channel-item .pay-channel-icon {
	margin-right: 10px;
	position: relative;
	top: 1px;
}

.pay-channel-item .pay-channel-icon > .iconfont {
	font-size: 20px;
}

.pay-channel-item .pay-channel-text {
	flex: 1;
}

.pay-channel-item .pay-channel-title {
	font-size: 14px;
	word-break: break-all;
	color: var(--color-text);
}

.pay-channel-item .pay-channel-desc {
	font-size: 12px;
	color: var(--color-text-tertiary);
}

.pay-channel-item .pay-channel-state {
	margin-left: auto;
}

.pay-channel-item .pay-channel-state-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	border: 1px solid var(--color-border);
	border-radius: 50%;
	box-sizing: border-box;
}

.pay-channel-item .pay-channel-state-icon > .iconfont {
	visibility: hidden;
	font-size: 18px;
	color: var(--color-primary);
}

.pay-channel-item.active .pay-channel-state-icon > .iconfont {
	visibility: visible;
}

.pay-channel-item.disabled {
	cursor: not-allowed;
	color: var(--color-text-tertiary);
}

.pay-channel-item.disabled .pay-channel-state-icon {
	background: var(--color-bg--disabled);
}

.pay-channel-list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.pay-channel-list .pay-channel-item {
	width: calc((100% - 10px) / 2);
	border: 1px solid var(--color-bg-secondary);
}

.pay-channel-item:is(.pay-channel-balance, .pay-channel-alipay, .pay-channel-wechat, .pay-channel-transfer, .pay-channel-card).disabled .pay-channel-icon > .iconfont {
	color: var(--color-text-tertiary);
}
.color-price {
    color: var(--color-text-price);
}



.kpart-checkout.fixed {
    position: fixed;
    top: 72px;
    
}

.pay-channel-item.active{
    border: 1px solid #e8a03b;
    background: #fff;
}

@media (max-width: 1680px) {
	:root {
		--size-width-kpart: 1390px;
		--size-width-kpart-spec: 1006px;
	}
}
/* 移动端适配 */
@media screen and (max-width: 768px) {
	#kpart_v2 {
		width: 100%;
	}

	.kpart-body {
		flex-direction: column;
		gap: 0;
	}

	.tab-ctainer {
		padding: 12px 20px;
	}

	.kpart-head {
		width: 100%;
		overflow-x: auto;
	}

	.kpart-spec {
		width: 100%;
	}

	.kpart-checkout {
		width: 100%;
	}

	.kpart-checkout.fixed {
		position: relative;
	}

	.kpart-spec-content, .kpart-spec-desc, .kpart-checkout-content {
		border-radius: 0;
	}

	.tab-div {
		flex-direction: column;
		gap: 0;
	}

	.tab-div .div-label {
		width: 100%;
		min-height: unset;
		padding-top: 0;
	}

	.tab-div .group-content {
		padding-top: 16px;
		width: 100%;
		overflow-x: auto;
	}

	.group-content-inner {
		width: max-content;
	}

	.buy-time .group-content-inner, .buy-timer .group-content-inner {
		width: inherit;
	}

	.zdy-radioGroup {
		gap: 16px;
		padding-left: 4px
	}

	.kpart-card-list {
		flex-wrap: inherit;
	}
	
	.tab-div .group-content {
		display: block;
		
	}
	
	.zdy-cardGroup-2 {
		display: block;
		margin-bottom:10px;
		
	}
}