
	small {
		color: #888;
	}
	@media (max-width:767px) {
		small {
			font-size: 10pt;
		}
	}

	    .checkout .check-radio input[type=radio] {
	    		margin-top: -5px;
	    }
	  	 .checkout .checkbox-inline, .radio-inline {
	    		padding-left: 0;
	    		padding-right: 10px;
	    		margin-top: 0;
	    } 
		.checkout label.form-label {
			font-size: 11pt;
			margin-bottom: 3px;
		}
		.checkout .small {
			font-size: 10pt;
		}
		
		.checkout ul {
			list-style: none;
			padding: 0;
			margin: 0;
		}
		.checkout.membership .box.box-checkout .box-body .step {
			counter-reset: number 1;
		} 
		.checkout.membership .box.box-plan .box-body .step {
			counter-reset: number 0 !important;
		} 
		.checkout.membership .dt-2 .step {
			counter-reset: number 3 !important;
		}
		.checkout .box.box-checkout .box-body .step>li {
			padding: 10px 0;
			counter-increment: number;
		}
		.checkout .box.box-checkout .box-body .step>li:hover:before {
			background-color: #648420;
		}
		.checkout .box.box-checkout .box-body .step>li:before {
			content: counter(number);
		    width: 39px;
		    height: 39px;
		    text-align: center;
		    color: #FFFFFF;
		    font-size: 16px;
		    line-height: 39px;
		    font-weight: 500;
		    background-color: #999;
		    display: block;
		    position: absolute;
		    border-radius: 50%;
		    box-shadow: inset -1px -1px 1px 0px rgba(0,0,0,0.3), 0px 1px 0px 0px rgba(255,255,255,0.8);
		}
		.checkout .box.box-checkout .box-body .step>li:hover > .header {
			color: #648420;
		}
		.checkout .box.box-checkout .step >li > .header {
			margin-left: 50px;
			font-size: 16pt;
			font-weight: bold;
			line-height: 39px;
			color: #999;
			margin-bottom: 10px;
		}

		.checkout .box.box-checkout .box-body .inv-info  [class^='col-'],
		.checkout .box.box-checkout .box-body .receive-info  [class^='col-'] {
			padding: 5px;
		}

		/*********************************
		***  發票資訊
		**********************************/
		 .checkout .inv-radio-box .check-radio input[type=radio]:checked + span:before {
			content: "\f0de";
			font-family: FontAwesome;
			font-size: 14pt;
			color: #f0f0f0;
		    position: absolute;
		    top: 28px;
		    left: 50px;
		}
		.checkout .box.box-checkout .inv-info .invForm {
			margin-top: 5px;
			padding: 20px;
			background-color: #f0f0f0;
		}
		@media (max-width: 767px) {
			.checkout .box.box-checkout .inv-info .invForm {
				padding-left: 15px;
				padding-right: 15px;
			}
		}
		@media (max-width: 424px) {
			.checkout .inv-radio-box .check-radio input[type=radio]:checked + span:before {
				content: '';
			}
			.checkbox-inline+.checkbox-inline, .radio-inline+.radio-inline {
				margin-left: 0;
			}
		}
		
		/*********************************
		***  購物明細
		**********************************/
		.checkout .box.box-shop-cart {
			background-color: #f0f0f0;
		}
		.checkout .box.box-shop-cart .box-header h2 {
			font-size: 16pt;
			 line-height: 1.667em;
			 font-weight: 500;
			 margin-top: 10px;
			 margin-bottom: 0;
		}
		.checkout .box.box-shop-cart .box-header h2 i {
			padding-right: 5px;
			color: #A3C75A;
		}
		.checkout .box.box-shop-cart .box-body, .checkout .box.box-plan .box-body {
			padding-left: 15px;
			padding-right: 15px;
		}
		.checkout .box.box-shop-cart .box-body dl dt {
			padding-top: 3px;
			margin-left: 10px;
			font-weight: normal;
			font-size: 14px;
			color: #888;
		}
		.checkout .box.box-shop-cart .box-body .restrict {
			margin: 5px 0;
			color: #fff;
			background: #648420;
			padding: 5px 10px;
			box-shadow: 5px 5px 5px rgba(0,0,0,0.14);
			font-size: 14px;
		}
		.checkout .box.box-shop-cart .box-body .name {
			padding-right: 20px;
		}
		.checkout .box.box-shop-cart .box-body ul li>.name, .checkout .dt-2 .name {
			display: block;
			float: left;
			font-size: 16px;
		}
		.checkout .box.box-shop-cart .box-body ul li>.amount, .checkout .dt-2 .amount {
			display: block;
			font-size: 20px;
			text-align: right;
		}
		.checkout .box.box-shop-cart .box-body ul li .btn-box [class^='col-md-'] {
			padding: 5px;
		}
	
/******************* member ship check out *************************/

.plan-choice-way { margin-top: 15px; font-size: 16px;}

.checkout .box-plan { background: #fff !important; }
.checkout .plans {
	list-style: none;
	font-size: 16px;
}	
.checkout .plans > li {
    width: 100%;
    margin-bottom: 5px;
}
.checkout .plans > li:hover,  .checkout .plans > li.active {
	cursor: pointer;
	background: rgba(100,132,32,0.1);
	border-bottom: 3px solid rgba(100,132,32,0.4) !important;
}
.checkout .plans .plan-item {
     padding: 4px 0;
     margin-bottom: 4px;
     border-bottom: 1px solid #eee;
}
.checkout .plans .plan-item:last-child {
	border-bottom: none;
}
.checkout .plans .plan-item>.cell {
    padding: 4px;
    line-height: 20px;
    display: table-cell;
    position: relative;
}
.checkout .plans .plan-item>.cell p { margin-bottom: 5px; }
.checkout .plans .plan-item>.cell STRIKE { font-size: 12px; }
.checkout .plans .plan-item .cell-inp {
    width: 1em;
    text-align: center;
}
.checkout .plans .plan-item .cell-text .point-desc { font-size: 15px; color: #648420; }
.checkout .plans .plan-item .cell-text .hint { font-size: 13px; color: #888; }
.checkout  .box .box-body { padding: 20px 15px;}
@media (max-width: 991px) {
	.checkout .dt-1, .checkout .dt-2 { padding-left: 0; padding-right: 0}
}
@media (min-width: 768px) and (max-width: 991px) {
	.checkout .dt-1 .checkbox-inline, .radio-inline {padding-right: 0}
}

.checkout .remark {
	margin-bottom: 15px;
	border-left: 5px solid red;
	color: red;
	padding: 5px 0px 5px 10px;
	line-height: 28px;
	font-size: 85%;
}

.checkout .tutor .btn-link {color: #273900; border-bottom: 3px solid transparent;}
.checkout .tutor .btn-link:hover, .checkout .tutor .btn-link:active, .checkout .tutor .btn-link:focus { color:#648420; border-bottom-color:#eee; text-decoration: none;}
.checkout .tutor .btn-link { margin: 0 5px 5px; padding: 0 5px 5px;}
.checkout .tutor .btn-link.active {color: orange; border-bottom: 3px solid orange; }