/* order */
#order {
	margin-top: 35px;
	padding: 28px 22px;
}

/* orderWrap */
.orderWrap .list {
	padding: 10px 20px;
	border-bottom: 1px rgba(var(--info-rgb), .2) solid;
}

.orderWrap .list .img font img {
	width: 70px;
	height: 70px;
	object-fit: cover;
}

.orderWrap .list .img span {
	margin-left: 10px;
	width: calc(100% - 92px);
}

.orderWrap .list .info p.qBox a[data-action="plusBtn"] {
	margin: 0 2px;
	width: 30px;
	height: 30px;
	background: rgba(var(--secondary-rgb), .3);
	border-radius: 5px;
	line-height: 28px;
	font-weight: 600;
	font-size: 24px;
}

.orderWrap .list .info p.qBox a.limit[data-action="plusBtn"] {
	line-height: 25px;
	font-size: 28px;
}

.orderWrap .list .info p.qBox input {
	margin: 0 5px;
	width: 30px;
	border-width: 0 0 1px;
}

.orderWrap .list.title {
	padding: 15px 20px;
	border-width: 3px;
}

.orderWrap a[data-action="delI"] {
	top: calc((100% - 27px) / 2);
}

/* btns */
.orderbtns {
	margin: 40px 0 20px;
}

.orderbtns a {
	margin: 0 0 0 auto;
}

/* orderTotal */
#orderTotal {
	padding: 40px 0 20px;
}

#orderTotal p {
	margin-bottom: 10px;
}

#orderTotal p font,
#orderTotal p font>* {
	line-height: 100%;
	font-size: 15px;
	vertical-align: baseline;
}

#orderTotal p font:last-child {
	width: 200px;
}

#orderTotal p span {
	margin: 0 3px 0 15px;
}

#orderTotal p b {
	font-size: 25px;
}

@media screen and (min-width:1025px) {
	.orderWrap .list .img a {
		align-items: center;
		justify-content: space-between;
	}
}

@media screen and (max-width:1024px) {
	#order {
		padding: 18px 12px;
	}

	.orderWrap .list {
		padding: 10px 160px 10px 110px;
	}

	.orderWrap .list .img a {
		line-height: inherit;
	}

	.orderWrap .list .img font {
		left: 20px;
	}

	.orderWrap .list .img font img {
		width: 60px;
		height: 60px;
	}

	.orderWrap .list .img span {
		margin-left: 0;
		width: 100%;
	}

	.orderWrap .list .info {
		font-size: 20px;
	}

	.orderWrap .list .info p:first-child font,
	.orderWrap .list .info p:first-child b {
		font-size: 12px;
		color: #696868;
	}

	.orderWrap .list .info p.qBox {
		right: 20px;
		bottom: 10px;
	}

	.orderWrap .list .info p.tBox {
		font-weight: bold;
		font-size: 20px;
		color: var(--primary);
	}

	.orderWrap a[data-action="delI"] {
		top: 5px;
		right: 20px;
	}
}

@media screen and (max-width:550px) {
	.orderWrap .list {
		padding: 10px 0 50px;
	}

	.orderWrap .list .img font {
		margin: 10px;
		border: 0;
		left: 0;
	}

	.orderWrap .list .img font img {
		width: 150px;
		height: 150px;
	}

	.orderWrap .list .info {
		width: 100%;
	}

	.orderWrap .list .info p.qBox {
		right: calc((100% - 178px) / 2);
	}

	.orderWrap .list .info p.qBox input {
		width: 70px;
	}

	.orderWrap a[data-action="delI"] {
		right: 10px;
	}

	#orderTotal p font {
		width: 80px;
	}

	#orderTotal p font:last-child {
		width: calc(100% - 80px);
	}
}

.onlinepayclass {
	width: 10px;
	appearance: auto;
}