@charset "utf-8";
body{height:100%;
background:#FFF;
color:#666666;
padding:0;margin:0;
/* font-family:helvetica neue,微軟正黑體,Microsoft JhengHei,蘋果儷中黑,Apple LiGothic Medium,黑体,SimHei; */
font-family: Helvetica Neue,Arial,微軟正黑體,Microsoft JhengHei,蘋果儷中黑,Apple LiGothic,黑体,Heiti;
font-size:14px;
}
.align-right{text-align:right;}
.w-100{width:100%}
a{color: #00a499;text-decoration:none;}
a:hover{color: #00a499;text-decoration:underline;}
#dialog-close{position:fixed;top:10px;right:10px;}
#dialog-close:hover{}
.box-scrollable{max-height:100px;overflow-y:auto;}
.dialog-content .helper {display: inline-block; height: 100%; vertical-align: middle;}


.dialog-header, .dialog-footer,.dialog-content-container{
position:absolute;
left:0;right:0;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.dialog-header{
	top:0;
	height:30px;
	margin:0 20px;
	padding:10px 0;
	border-bottom:2px solid #EAEAEA;
	display:block;
}
.dialog-content-container{top:50px;bottom:0;margin:0 20px;	overflow:auto;}
.dialog-footer{bottom:0;}

.dialog-header .dialog-title{font-size:24px;padding:0;}
.dialog-header .user-profile{padding:0 20px;float:right;margin-right:20px;}
.user-profile>.user-pic{display:inline-block;float:left;width:30px;height:30px;overflow:hidden;border-radius:50%;}
.user-profile>.user-pic img{width:100%;height:100%;}
.user-profile>.username {margin-left:30px;padding:0 10px;line-height:30px;height: 30px;}
/*Message*/
.dialog-message{padding:50px;text-align:center;font-size:18px;}
.dialog-message .message-title{font-size:18px;}
.dialog-message .message-content{font-size:14px;}
.dialog-message .message-content a{text-decoration:underline;}
.dialog-message .message-content a:hover{color:#008a82;}
.dialog-content .dialog-message{padding:20px 50px;}
/*tips*/
.notice {background:#f5f5f5;border:2px solid #EAEAEA;border-radius:6px;padding:10px 10px 0;margin:10px 10px 20px;}
.notice .notice-item{padding:0 5px 10px ;vertical-align:middle;}
.notice .notice-item  .notice-text, .notice .notice-item  .notice-ico{
display:inline-block;vertical-align:middle;
}
.notice .notice-item  .notice-text{width:520px;height:100%;}
.notice .notice-ico{width:56px;height:100%;margin:0 0 0 0;overflow:hidden;}
.notice .notice-ico img{max-height:100%;max-width:100%;text-align:center;}
.notice .notice-item>ol{padding-left:20px;}
.notice a.tips span {
  z-index:10 ;
  display:none ;
  padding:10px ;
  margin-top:30px ;
  margin-left:-160px ;
  width:450px ;
  height:auto ; line-height:16px;}
.notice a.tips:hover span {
  display:inline ;
  position:absolute ;
  border:1px solid #AAA ;
  text-align:left ;
  font-weight:normal ;
  background:#FFF ;border-radius:6px;}
  a.tips:hover span p{color:#555;}
  a.tips:hover .arrow{
  margin-top:-20px;margin-left:50px;
}

.must-fill{color:red;}
.remark {display:block;}

.product-info{
	margin:15px;
	border-bottom:1px solid #EBEBEB;
}
.product-info .product-image{
	width:60px;
    height:60px;
	border:1px solid #ffffff;
	display:inline-block;
	float:left;
}
.product-info .product-image img{width:60px;height:40px;}
.product-info .product-details{
	color:#111111;
	display:block;
	margin-left:60px;
	padding:10px 0 10px;
}
.product-prop .product-price{line-height:20px;font-size:18px;font-weight:bold;color:#00a499;padding-bottom:10px;padding-right:0;}
.product-info .product-details .product-name{line-height:20px;font-weight:bold;}
.product-info .product-details .product-caption{display:block;margin-top:3px;}
.product-info .product-details .product-rating{padding:8px 0;display:block;}
.product-prop{display:block;padding-bottom:5px;}
.product-info .product-details .product-prop{text-align:right;}
.product-info .product-details .product-prop img {padding-left:3px; padding-top: 1px;}
.product-info .product-details .product-price{line-height:20px;font-size:20px;font-weight:bold;color:#e02152;padding-bottom:10px;padding-right:0;}
.product-info .product-details .product-price a{color: #e02152;text-decoration:none;}
.product-info .product-details .product-price a:hover{color: #c91547;text-decoration:none;}
.product-info .product-details .product-label img{padding-right:5px;margin-top:-8px;}
/**
.label-hot .text{background:#f44336;font-size:15px;color:#FFF;padding:0 5px;font-weight:bold;border-radius:4px 4px 0 4px;}
.label-hot:after{
	width:5px;
	background:url('../images/product-label-arrow-hot.png') bottom left no-repeat;
	padding-right:5px;
	content:"";
}**/

.dialog-form .row{
	margin:0 15px;
	padding:10px 10px 20px;
	border-bottom:1px solid #EBEBEB;
}
.dialog-form-notice{
	padding:20px;
	font-size:11px;
	width:560px;
	margin:0 auto;
}
.dialog-form .from-text{color:#333;font-weight:bold;}

.rating-class,.rating-respond,.rating-mark{height:20px;padding:5px 0;}
.rating-container,.rating-header{;margin:0 auto;}
.rating-class{display:inline-block;width:30%;text-align:right;}
.rating-respond{width:46%;text-align:center;padding:0 2%;display:inline-block;font-size: 12px;}
.rating-header .rating-respond .col-xs-3{padding:0;}
.rating-mark {display:inline-block;width:20%;}

.dialog-footer>.btn-block, .dialog-content .btn-block{width:330px;margin:30px auto;}
.dialog-footer>.btn-block:hover,.dialog-content .btn-block:hover{color:#FFF;}
.btn.disable, .btn.disable:active{background:#d5d5d5;border:#d5d5d5;cursor:normal;color:#FFF;}
/**********PRODUCT INFO*********/

#dialog-product-info .product-info{border-bottom:0;}
#dialog-product-info .product-image{width:320px;height:auto;}
#dialog-product-info .product-image img{width:100%;height:auto;}
#dialog-product-info .product-details{margin-left:340px;font-size:13px;}
#dialog-product-info .product-caption{font-size:14px;}
#dialog-product-info .product-label{height:20px;}
#dialog-product-info .product-name{font-size:20px;}
#dialog-product-info .product-prop{font-size:20px;text-align:left;padding-bottom:0}
#dialog-product-info .product-prop img {padding-left: 3px;  padding-top: 1px;}
#dialog-product-info .product-price{float:left;}
#dialog-product-info .product-details>div{margin-bottom:25px;}
#dialog-product-info .product-details>table{margin-bottom:25px;}
#dialog-product-info .product-details>div:last-child{margin-bottom:auto;}

.product-detail-function .list-01, .product-detail-function .list-02 {
	display:block;
	width:100%;
	height:45px;
	padding-bottom:10px;
}


#dialog-product-info .attr-label{
	padding-right:15px;

}

.product-detail-function ul li {
	margin:0;
	display:block;
	padding-right:10px;
	float:left;
	padding-left:0;
}

.product-detail-function .btn{
	background:#fff;
	font-size:12px;
	border: 1px solid #bbbbbb;
	color:#888888;
	display:block;
	padding: 3px 10px 3px 30px;
	height:34px;
	line-height:25px;
}

.product-detail-function .active .btn, .product-detail-function .btn:hover {
	background:#fff;
	color:#00a499!important;
	border: 1px solid #00a499;}

.product-detail-function .function-bookmark .btn{
	background: url("../images/icon/item_function_02.png") no-repeat 6px 6px;
}

.product-detail-function .function-bookmark .btn:hover, .product-detail-function .function-bookmark.active .btn {
	background: url("../images/icon/item_function_02_hover.png") no-repeat 6px 6px;
}

.product-detail-function .function-website .btn{
	background: url("../images/icon/item_function_website.png") no-repeat 6px 6px;
}

.product-detail-function .function-website .btn:hover, .product-detail-function .function-website.active .btn {
	background: url("../images/icon/item_function_website_hover.png") no-repeat 6px 6px;
}

.product-detail-function .function-quote .btn{
	background: url("../images/icon/item_function_01.png?v=2") no-repeat 6px 6px;
}

.product-detail-function .function-quote .btn:hover, .product-detail-function .function-quote.active .btn {
	background: url("../images/icon/item_function_01_hover.png") no-repeat 6px 6px;
}

.product-detail-function .function-comment .btn{
	background: url("../images/icon/item_function_03.png") no-repeat 6px 6px;
}

.product-detail-function .function-comment .btn:hover, .product-detail-function .function-comment.active .btn {
	background: url("../images/icon/item_function_03_hover.png") no-repeat 6px 6px;
}

.product-detail-function .function-rating .btn{
	background: url("../images/icon/item_function_04.png") no-repeat 6px 6px;
}

.product-detail-function .function-rating .btn:hover, .product-detail-function .function-rating.active .btn {
	background: url("../images/icon/item_function_04_hover.png") no-repeat 6px 6px;
}

.product-detail-function .function-more-info .btn{
	background: url("../images/icon/item_function_more_info.png") no-repeat 6px 6px;
}

.product-detail-function .function-more-info .btn:hover,.product-detail-function .function-more-info.active .btn {
	background: url("../images/icon/item_function_more_info_hover.png") no-repeat 6px 6px;
}

/**********PRODUCT PREVIEW*********/
.image-slider{position:relative;}
.image-slider .image-screen{
padding:20px;
display:block;
height:380px;
margin:0 auto;
text-align:center;
}
.image-slider .image-screen img{max-height:100%;}

.image-slider .arrow-next, .image-slider .arrow-prev{position:absolute;top:0;height:420px;width:50%;border:none;}
.image-slider .arrow-next:active, .image-slider .arrow-prev:active,
.image-slider .arrow-next:focus, .image-slider .arrow-prev:focus{outline:0}
.image-slider .arrow-prev{left:0;width:50%; background:url('../images/icon/slider-prev.png') 30% center no-repeat;}
.image-slider .arrow-next{right:0;width:50%; background:url('../images/icon/slider-next.png') 70% center no-repeat;}
.image-slider .arrow-prev:hover{background-image:url('../images/icon/slider-prev-hover.png');}
.image-slider .arrow-next:hover{background-image:url('../images/icon/slider-next-hover.png');}
.image-slider .name{	font-size:18px;font-weight:bold;color:#444;text-align:center;}
.image-slider .desc{	color:#666;text-align:center;}
.image-slider .thumbnail-list{display:block;margin:10px auto;text-align:center;}
.image-slider .thumbnail-list .thumb-img {cursor:pointer;display:inline-block;width:70px;height:70px;border:1px solid #eaeaef;margin:5px;overflow:hidden;vertical-align:middle;}

.image-slider .thumbnail-list .thumb-img img{max-height:100%;max-width:100%;text-align:center;}
.image-slider .thumbnail-list .thumb-img.active{	border-color:#888888;}


/**referral-buy**/




.checkbox-outer {white-space:nowrap;}
.checkbox-outer input[type=radio]:checked +label {color:#00a499;}
.checkbox-outer label{vertical-align:middle;display:inline-block;white-space:nowrap;}
.checkbox-outer label span{display:inline-block;height:100%;vertical-align:middle;}
.checkbox-outer label span.type-ico img{text-align:center;vertical-align:baseline;}

.form-error-msg{position:absolute;right:0;vertical-align:middle;margin-top:-5px;}
.form-error-msg span{display:inline-block;width:150px;border-radius:5px;background:#ffdd87;padding:10px;font-size:12px;color:#8a6d3b;}
.form-error-msg .arrow{
	display:inline-block;width: 0;
	height: 0;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	border-right:8px solid #ffdd87;
	border-left:none;
	padding:0;margin:0;
	vertical-align: middle;
	}

.disc-price {/*vertical-align:middle;display:inline-block;*/white-space:nowrap;}
.disc-price  span{display:inline-block;height:100%;vertical-align:middle;}
.disc-price span.type-ico img{text-align:center;vertical-align:baseline;}

.msg-alert {color:#df2d3e;}
.msg-done{color:#00a499;}
.msg-alert, .msg-done{display:inline-block;}
.msg-alert>img, .msg-done>img{vertical-align:text-bottom;}

#dialog-referral-buy .progress-box{vertical-align:middle;}
#dialog-referral-buy .progress-box .msg-progress {vertical-align:middle;display:inline-block;margin:0 auto;text-align:center;width:99%;}
#dialog-referral-buy .progress-box .msg-progress p{padding:10px;}
#dialog-referral-buy .dialog-form .progress-box  div:last-child{border:none;}
#dialog-referral-buy .dialog-form .progress-box  div.notice{border:2px solid #EAEAEA}
#dialog-referral-buy .dialog-form .progress-box  div.notice h4{font-size:1.1em;}
#dialog-referral-buy .dialog-footer .btn.btn-block{margin:20px auto;}
/**********CUSTOM PAGE LAYOUT SETTING*********/
/* old version
#dialog-user-feedback>.dialog-footer{}
#dialog-user-feedback .dialog-content,
#dialog-referral-buy .dialog-content,
#dialog-quotation .dialog-content{width:640px;margin:20px auto;}
#dialog-user-feedback>.dialog-content-container{bottom:100px;}
#dialog-quotation>.dialog-content-container{bottom:100px;}
#dialog-referral-buy .dialog-content-container{bottom:120px;}
#dialog-product-preview>.dialog-header{border:none;}
#dialog-quotation-feedback >.dialog-content-container{bottom:100px;}
#dialog-quotation-feedback .dialog-content{width:640px;margin:20px auto;}
.dialog-content-container.no-footer{bottom:0px;}
*/

.clearfloat {/* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the overflow:hidden on the .container is removed */
	clear: both;
	height: 0;
	font-size: 1px;
	line-height: 0px;
}


#dialog-profile-image >.dialog-content-container{overflow:inherit;}
#dialog-profile-image .dialog-content{ padding-top: 20px;}
.dialog-profile-edit-wrapper{height:auto; min-height:300px;}
#dialog-profile-image .dialog-content .btn-block{margin: 20px auto;}
.dialog-title-small {display:inline;padding-left:15px; font-size:15px}
.dialog-profile-edit-inner{text-align:center;}
.dialog-profile-edit-inner a {color: #0062d0; text-decoration:underline; font-size: 16px;}
.dialog-profile-edit-inner a:hover, .dialog-profile-edit-inner a:focus {color: #0078ff;}
.dialog-profile-edit-01{padding-top: 70px;}
.dialog-profile-edit-01 img {margin-bottom: 10px;}
.dialog-profile-edit-02{padding-top: 122px;}



#contactus .typeitem .radio {position: relative; display: block; min-height: 0;  margin-top: 0;  margin-bottom: 0; }
#contactus .subitem .radio{position: relative; display: block; min-height: 0;  margin-top: 0;  margin-bottom: 0;
}
#contactus .typecurrent {color:#00a499!important;}
#contactus .titlebar {box-shadow:0 1px 0px #ccc; }
#contactus .titlebar .dialog-title {font-size: 18px; line-height: 22px;}
#contactus .sub, #contactus .type, #contactus .subitemcontent {background-color: #ffffff!important; margin-top: 8px!important;}
#contactus .typeitem, #contactus .subitem {color: #444;!important; font-size: 15px;!important;}
#contactus .sub{ margin-top:0!important; padding:0!important; }
#contactus .typetitle{ background-color: #f6f6f6!important;}
#contactus .typetitle.active{ background-color: #eee!important;}
#contactus .typetitle.active:hover{ background-color: #e9e9e9!important;}
#contactus input{width:100%;}
#contactus .main tr td {padding-bottom:5px;}
#contactus .main input.btn {color: #fff; width: 120px; margin: 0 auto; display: block;}


.text-price-unit {

}

.text-price-number {
	font-size: 1.2em;
}

.contact-us-message{
	margin-top:30px;
}

.contact-us-btn{
	margin-top:10px;
}

.btn:hover{
	color:white;
}

#contactus .progress-box{
	margin:30px auto;
}

#contactus .msg-progress{
	text-align:center;
}





#dialog-product-info .attr-label {
	width: 70px;
	vertical-align: top;
	white-space:nowrap;
}

#dialog-product-info .attr-info {
	vertical-align:top;
}

#dialog-product-info .product-details>div {
	margin-bottom: 20px;
}

.product-info .product-details{
	padding: 0 0 10px;
}

#dialog-product-info .dialog-content-container{
	overflow:hidden;
}


.rating-respond img:hover{
	cursor: pointer;
}


::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
    border-radius: 4px;
	background-color: #efefef;
}

::-webkit-scrollbar-thumb {
    border-radius: 4px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);
	background-color: #aaaaaa;
}

/* 0512 - edit profile pic fancy box headling style - ENG */

#dialog-profile-image.en_US .dialog-header .dialog-title {
  width: 100%;
  overflow: hidden;
}

#dialog-profile-image.en_US .dialog-title-small {
  display: block;
  float: right;
  width: 540px;
  line-height: 16px;
}


/* 0513 - referral buy fancy box error style */

#dialog-referral-buy #tel_error.form-error-msg {
  right: 35px;
  margin-top: -6px;
}


#dialog-referral-buy #tel_error.form-error-msg span {
width: 160px;
}



#dialog-referral-buy.en_US #tel_error.form-error-msg {
  right: -54px;
  margin-top: -22px;
}

#dialog-referral-buy.en_US #tel_error.form-error-msg span {
width: 150px;
}



#dialog-referral-buy #type_error.form-error-msg {
  right: -30px;
  margin-top: -12px;
}


#dialog-referral-buy #type_error.form-error-msg span {
width: 316px;
}



#dialog-quotation.en_US input[name="hong_price"],
#dialog-quotation.en_US input[name="water_price"]{
	width:26%!important;
}




.product-price-original {
  color: #e02152;
  font-weight: bold;
  font-size:17px;
}

#dialog-referral-buy .checkbox-outer img.icon-up{
	  margin-bottom: 0px;
}

#dialog-referral-buy.en_US .checkbox-outer img.icon-up{
	  margin-bottom: -6px;
	  padding-right:3px;
}


.product-info .product-details .product-prop img.icon-up {
  padding-top: 0px;
  margin-bottom: 6px;
}




#dialog-quotation .product-info .product-prop img,
#dialog-quotation-feedback .product-info .product-prop img{
	  padding-bottom: 10px;
}


.product-info .product-prop {
	float:right;
}



#dialog-product-info .product-prop{
	float:left;
}

#dialog-product-info .product-prop img.hong_20,
#dialog-product-info .product-prop img.water_20 {
  padding-bottom: 6px;
}





/* error dialog on price selection */

#dialog-referral-buy #type_error.form-error-msg .arrow{
  border-left: 8px solid #ffdd87;
  border-right: none;
  float: right;
  margin-top: 10px;
  padding-right: 428px;
}

#dialog-referral-buy #type_error.form-error-msg {
  left: -160px;
  margin-top: 22px;
  right:0;
  z-index: -10;
}

#dialog-referral-buy #type_error.form-error-msg span {
  width: 166px;
}



/* error dialog on name (eng) */
#dialog-referral-buy.en_US #name_error .form-error-msg span{
	  width: 160px;
}





/* price  label fix */

.product-info .product-details .product-price, .product-info .product-details .product-prop {
	float:left;
}

/* hong water label fix on referral buy page */

#dialog-referral-buy .product-price-original .hong_20, #dialog-referral-buy .product-price-original .water_20 {
	margin-left: 3px;
	vertical-align: text-top;
}

/* 0604 13:00 end */

.ms-product-original-price { text-decoration: line-through; color: #999; font-size: 0.9em; font-weight: bold; }
.ms-product-original-price .product-price { color: #999; }
.ms-product-price { font-size: 1.2em; font-weight: bold; color: #C91547; }



.dialog-message .message-content a.btn {
  text-decoration: none;
}


#dialog-referral-buy .dialog-form .ms-product-price .icon-up {
margin-bottom:6px;
}

#dialog-referral-buy .dialog-form .ms-product-price .hong_20,
#dialog-referral-buy .dialog-form .ms-product-price .water_20 {
margin-bottom:4px;
}

#dialog-referral-buy .dialog-form .disc-price .ms-product-price .icon-up {
margin-bottom:0px;
margin-left: 3px;
}

#dialog-referral-buy .dialog-form .disc-price .ms-product-price .hong_20,
#dialog-referral-buy .dialog-form .disc-price .ms-product-price .water_20 {
margin-bottom:-2px;
margin-left: 4px;
}
/* 0707 17:20 end */


/* 20151216 */
.col-xs-5 {
  width: auto;
  float: right;
  font-size: 14px;
  margin-top: 10px;
}


.dialog-form .row{
	margin:0 15px;
	padding: 5px 10px 5px;
	border-bottom:1px solid #EBEBEB;
}

.product-info{
	margin: 0px 15px;
	border-bottom:1px solid #EBEBEB;
}

.notice {background:#f5f5f5;border:2px solid #EAEAEA;border-radius:6px;padding:5px 10px 0;margin: 10px 10px 10px;}

.dialog-footer>.btn-block, .dialog-content .btn-block{width:330px;margin:30px auto;}

#dialog-referral-buy .dialog-footer .btn.btn-block{margin: 10px auto;}


/**********CUSTOM PAGE LAYOUT SETTING*********/
#dialog-user-feedback>.dialog-footer{}
#dialog-user-feedback .dialog-content,
#dialog-referral-buy .dialog-content,
#dialog-quotation .dialog-content{width:640px;margin: 10px auto;}
#dialog-user-feedback>.dialog-content-container{bottom:100px;}
#dialog-quotation>.dialog-content-container{bottom:100px;}
#dialog-referral-buy .dialog-content-container{bottom:120px;}
#dialog-product-preview>.dialog-header{border:none;}
#dialog-quotation-feedback >.dialog-content-container{bottom:100px;}
#dialog-quotation-feedback .dialog-content{width:640px;margin:20px auto;}
.dialog-content-container.no-footer{bottom:0px;}

/* 20151217, stroy #6756 */
.product-detail-function { margin-top: 20px; }
.product-info .product-details .product-price { padding: 0; }
.thumb_area {padding-top:10px;}
.thumb_area a .thumb40 {width:40px; height:40px; overflow:hidden; float:left; display:inline-block; margin-bottom: 10px; margin-right:10px; border:1px solid #DDDDDD; background-size:cover; background-position:center; background-repeat:no-repeat;}
.thumb_area a .thumb60 {width:60px; height:60px; overflow:hidden; float:left; display:inline-block; margin-bottom: 10px; margin-right:10px; border:1px solid #DDDDDD; background-size:cover; background-position:center; background-repeat:no-repeat;}
.img280box {width:282px; height:100%; display:table-cell; vertical-align:middle; text-align:center;border:1px solid #DDD;}


/* update complete referral buy transaction id 20160106*/
.transaction_id{
    margin: 10px 0px;
    font-weight: bold;
    font-size: 1.3em;
}
/* #8799 referral guest, 20160225  */
.non-member-referral .dialog-referral-title{
    width: auto;
    font-size: 24px;
    font-weight: bold;
    margin-left: 10px;
    padding-left: 100px;
}

.non-member-referral .referral-notice{padding-left: 110px;}


.non-member-referral .referral-header-logo{
	float:left;
	height: 50px;
}

.non-member-referral .notice-key-text{
	color:#00a499;
	font-weight: bold;
}

.clear-right{
	clear:right;
}

.clear-left{
	clear:left;
}

.non-member-referral #dialog-referral-buy .dialog-content-container {
    bottom: 120px;
    position: relative;
    top: 0px;
}

.non-member-referral .dialog-processbar{
	text-align:center;
	position: relative;
	margin: 10px 0;
}

.non-member-referral .confirming-buy{
	font-weight:bold;
	margin-right: 5px;
}

.non-member-referral .finish-buy{
	/*font-weight:bold;*/
	margin-left: 5px;
}

.non-member-referral .dialog-header {
	position:relative;
	height: auto;
}

.non-member-referral .product-details .col-xs-5 {
    width: auto;
    float: none;
    font-size: 14px;
    margin-top: 0px;
    padding-right: 0px;
    padding-left: 15px;
}
.non-member-referral .product-details .col-xs-4 {
    width: auto;
    padding-right: 0px;
    padding-left: 0px;
}
.non-member-referral .product-details .col-xs-8{
	float:none;
}

.non-member-referral .dialog-form .row {
    margin: 0 50px;
}

.non-member-referral .text-original-price-unit{

font-size: 14px;

color: #222;

text-decoration: line-through;
}

.non-member-referral .text-original-price-number{

font-size: 14px;

color: #222;

margin-right: 5px;

text-decoration: line-through;
}

.non-member-referral .dialog-login-form{
	margin: 10px 40px;
}

.non-member-referral .product-info .product-details .product-name {
    line-height: 20px;
    font-weight: bold;
}


.non-member-referral .dialog-login-form>.btn-block, .dialog-content .btn-block {
    width: 100%;
    margin: 10px 0px;
    position: relative;
    padding: 5px;
}

.non-member-referral .dialog-login-form .col-xs-9{

width: 100%;

float: none;

position: relative;

padding: 2px 0px;
}

.non-member-referral .dialog-nonmember-login{
	float:left;
	width: 45%;
}

.non-member-referral .dialog-nonmember-login-title{

font-weight: bold;
}

.non-member-referral .resend-ver-code{

color: #00a499;

font-size: 12px;
}

.non-member-referral .dialog-login-form .ver_no_form{
	position: relative;
	padding: 0px;
}

.verti-line{

/* border-left: 1px solid #999; */

float: left;

height: 100%;

width: 10%;

text-align: center;

vertical-align: middle;

padding-top: 10%;
}

.dialog-member-login{

float: right;

width: 45%;
}

.non-member-referral .dialog-member-login-title{
font-weight: bold;
}

.non-member-referral .fb-login{
	text-align:right;
	color: #4c69ba;
	margin:5px 0;
}

.non-member-referral .dialog-form .remark-row {
    margin: 0 50px 0 0;
    padding: 5px 50px 5px 10px;
}


.non-member-referral .ver_loading{
	color:#FF0000;
	font-weight:bold;
	margin: 5px 0;
}

.non-member-referral .ver_loading span{
	color:#FF0000;
	font-weight:bold;
	margin-left:5px;
}

.non-member-referral .login_loading{
	text-align:center;
	margin: 5px 0;
}

.non-member-referral .login_loading span{
	color:#FF0000;
	font-weight:bold;
	margin-left:5px;
}

/* end of #8799 referral guest, 20160225  */

.dialog-nonmember-login-title { margin: 5px 0; display: block;}
.non-member-referral .dialog-login-form .col-xs-9 {padding: 2px 0;}
.non-member-referral .dialog-login-form .fb-login {font-size: 13px; text-align: center;}
.non-member-referral .product-info .product-image img {width: 60px; height: 60px; border: 1px solid #ccc;}
.non-member-referral .product-info {padding: 10px 0; margin: 0px 50px;}
.non-member-referral .dialog-login-form {margin: 0 30px;}
.verti-line{ width:7%;}
.non-member-referral .product-details .col-xs-5 {color: #666666;}
.non-member-referral .product-details .col-xs-5 .from-text {color: #111;}
.non-member-referral.row { border: 1px solid #ddd; background: rgba(220,220,220,0.2); margin: 5px 20px 10px;}
.non-member-referral .dialog-form .row.non-member-referral-price {border-bottom:0;}

/* #8799 thanks page, 20160226  */

.non-member-referral .dialog-header{
	height:auto;
	position:relative;
}

.non-member-referral .dialog-referral-title{
    width: auto;
    font-size: 24px;
    font-weight: bold;
    margin-left: 10px;
    padding-left: 100px;
}

.non-member-referral .referral-notice{padding-left: 110px;}


.non-member-referral .referral-header-logo{
	float:left;
	height: 50px;
}

.non-member-referral .notice-key-text{
	color:#00a499;
	font-weight: bold;
}

.clear-right{
	clear:right;
}

.clear-left{
	clear:left;
}

.clear-both{
	clear:both;
}

.non-member-referral .thanks-message{
	text-align:center;
	margin: 25px 0;
}

.non-member-referral .dialog-processbar{
	text-align:center;
	position: relative;
	margin: 10px 0;
}

.non-member-referral .confirming-buy{

}

.non-member-referral .finish-buy{
	font-weight:bold;
}


.non-member-referral .thanks-message-content{
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-right: 35px;
	color: #111;
	}

.non-member-referral .dialog-thankspage-content-container .dialog-content .dialog-message{padding:0;position: relative;margin-left: 80px;}

.non-member-referral .thanks-message-content span{

float: none;

font-weight: bold;
}

.non-member-referral .thanks-message-content .transaction_id{

float: none;

margin: 0 5px 0 5px;

font-size: 20px;
}

.non-member-referral .thanks-message-content .btn-block{
	width:auto;
}

.non-member-referral .thanks-message-content a.btn {
  text-decoration: none;
  padding: 3px 20px 3px;
  text-align: center;
  font-size: 16px;
  width: 146px;
  display: inline;
  vertical-align: baseline;
}

.non-member-referral .dialog-thankspage-content-container{
	position:relative;
	margin: 0 20px;
    overflow: auto;
}

.non-member-referral .thanks-product-details{
	position:relative;
	border-top: 1px solid #ddd;
	padding: 10px 0 10px 0px;
}

.non-member-referral .dialog-thankspage-content-container .dialog-footer{
	position:relative;
}

.non-member-referral .thanks-product-details .col-xs-8{
	width: 100%;
	text-align: left;
	font-weight: bold;
}

.non-member-referral .thanks-product-details .col-xs-5{
	float:none;
	text-align: left;
	margin-top: 0;
}

.non-member-referral .thanks-product-details .col-xs-3{
	width:auto;
	/* margin-top: 14px; */
	font-size: 14px;
	line-height: 22px;
}

.non-member-referral .text-original-price-unit{
font-size: 14px;
color: #222;
text-decoration: line-through;
}

.non-member-referral .text-original-price-number{
font-size: 14px;
color: #222;
margin-right: 5px;
text-decoration: line-through;
}

.non-member-referral .thanks-left{
	float:left;
	width: 70px;
	height: 100%;
}

.non-member-referral .thanks-content{
	width: 100%;
}

.non-member-referral .thanks-nonmember-content{

padding: 20px 60px;

position: relative;

font-size: 14px;

}

.non-member-referral .thanks-nonmember-content-left{
	float: left;
	width: 55%;
	padding: 2px;
	}

.non-member-referral .thanks-nonmember-message{
	font-size: 14px;
	margin: auto;
	display: table;
	vertical-align: middle;
}


.non-member-referral .thanks-nonmember-content-right{

float: right;

width: 45%;

padding: 5px;
}

.non-member-referral .thanks-nonmember-reg-title{

font-weight: bold;

font-size: 16px;
}

.non-member-referral .dialog-membership-reg{

}


.non-member-referral .dialog-membership-reg .col-xs-9 {
    width: 100%;
    float: none;
    position: relative;
    padding: 0px;
    margin: 5px 0;
}

.non-member-referral .dialog-membership-reg .fb-reg{

text-align: right;

color: #4c69ba;

margin: 10px 0;
}

.non-member-referral .reg_loading{

text-align: center;

color: #FF0000;

font-weight: bold;

margin-left: 5px;
}

.non-member-referral .dialog-membership-reg .btn-block{

width: 100%;

margin: 5px 0;
}

/*End of #8799 thanks page, 20160226  */

/*Update for #8799 thanks page 20160229*/
.thanks-product-image img {border: 1px solid #ccc;}
.dialog-thankspage-content-container .dialog-content .dialog-message {
	margin-left: 65px;
    border: 1px solid #ddd;
    background: rgba(220,220,220,0.2);
}
.non-member-referral .product-price-original {line-height: 15px;margin-top: 15px;margin-bottom: 5px;}
.non-member-referral .thanks-product-details .col-xs-8 .product-name {color: #111;}
.thanks-product-details .col-xs-5 .from-text{color:#333;font-weight:bold;}
.thanks-product-details .col-xs-5 {
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
}
.non-member-referral .text-original-price-unit {color: #aaa;font-weight: normal;}
.non-member-referral .text-original-price-number {color: #aaa;font-weight: normal;}
.non-member-referral .thanks-product-details .product-price-original .hong_20, .non-member-referral .thanks-product-details .product-price-original .water_20 {margin-top: -6px;}
.thanks-nonmember-message {text-align: center;line-height: 12px;}
.thanks-nonmember-content .btn-block {margin:10px auto; width: 40%;margin-top: 20px;}


.dialog-member-login.member-registered {float: none; width: 60%;margin: auto;}

#member-login-referral, #nonmember-login-referral {
  -webkit-transition: 0.4s; /* Safari */
  transition: 0.4s;
}

.logedin-verified .non-member-referral #contact_name, .logedin-verified .non-member-referral #contact_no, .logedin-verified .dialog-login-form .col-xs-9 {width: 100%;}
.logedin-not-verify .non-member-referral #contact_name, .logedin-not-verify .non-member-referral #contact_no, .logedin-not-verify .dialog-login-form .col-xs-9 {width: 100%;}
.no-login-member .non-member-referral .dialog-login-form .col-xs-9, .no-login-member .non-member-referral #contact_name, .no-login-member .non-member-referral #contact_no {width: 100%;}

.logedin-not-verify .ver_loading, .logedin-not-verify .ver_no_form {display: none;}
.no-login-member .ver_loading, .no-login-member .ver_no_form, .no-login-member .login_loading {display: none;}
.non-member-referral #dialog-referral-buy #type_error.form-error-msg .arrow {padding-right: 385px;}
.non-member-referral #dialog-referral-buy #type_error.form-error-msg {left: -169px;}

.no-login-member .dialog-form .member-registered {display:none;}
#member_verify_mobile {display:none;}
/*End of Update for #8799 thanks page 20160229*/

/*referral-flow-original-price*/
.product-price-original.member-referral-flow .text-price-unit{font-weight: normal;color: #aaa;font-size:14px;text-decoration:line-through;}
.product-price-original.member-referral-flow .text-price-number{font-weight: normal;color: #aaa;font-size:14px;text-decoration:line-through;margin-right:5px;}
.product-discounted-price.member-referral-flow .text-price-unit{color: #e02152;font-weight: bold;font-size: 17px;margin-right:2px;}
.product-discounted-price.member-referral-flow .text-price-number{color: #e02152;font-weight: bold;font-size: 22px;}
.product-discounted-price.member-referral-flow .discounted-product-price{vertical-align: middle; display: inline-flex; align-items: baseline;}
.product-discounted-price.member-referral-flow .discounted-product-prop{vertical-align: middle; display: inline-flex; margin-left: 3px;}
/*20160301 fix referral flow*/
.non-member-referral .product-price-original {margin-top: 5px;}
.non-member-referral #contact_name, .non-member-referral #contact_no, .dialog-login-form .col-xs-9, .non-member-referral #tel, .non-member-referral #member_contact_name {width: 100%;}
.non-member-referral .product-info .product-details .product-name {margin-bottom:5px; display:block;}
.non-member-referral .col-xs-3.text-original-price-unit {padding-right:0;}
.non-member-referral .col-xs-3.product-price-original{padding-right:6px;margin-top:14px;padding-left:7px;}
.non-member-referral .col-xs-3.product-price-original .text-price-unit {font-size: 19px;}
.non-member-referral .col-xs-3.product-price-original .text-price-number {font-size: 23px;}
.thanks-message {margin: 18px 0;}
.verti-line {width: 10%;}
.col-xs-3.align-right.new-referral-flow{margin-top:7px;}
.member-referral-flow .text-price-unit, .member-referral-flow .text-price-number  {vertical-align:-30%;}
.non-member-referral .product-price-original  {/*vertical-align:middle;*/}
/*End of 20160301 fix referral flow*/

/*20160302 Referral flow reg button*/
.non-member-referral .btn-block{
    width: 100%;
    margin: 10px 0px;
    position: relative;
    padding: 5px;
}

.non-member-referral .btn-ty-reg.btn-lg {
	width: 230px;
	margin: 20px auto;
	padding: 7px 16px;
}

.thanks-message { margin: 40px 0 20px;}
/*End of 20160302 Referral flow reg button*/


/*////////////////20160307 Referral flow revise/////////////////////*/

input {
    background: white;
}

input:-webkit-autofill {
    -webkit-box-shadow: inset 0 0 0px 9999px white;
}

/*t&c bubble*/
.non-member-referral .notice-text .notice-bubble .bubble-content {
	background: #fff;
    border: 1px solid #aaa;
    margin-top: -1px;
    margin-left: -20px;
    padding: 5px 10px;
    border-radius: 5px;
    color: #333;
}

.non-member-referral .notice-text .notice-bubble .bubble-content h4 {
	color: #00a499;
}

.non-member-referral .notice-text .notice-key-text {
	cursor: pointer;
}

.non-member-referral .notice-text .notice-key-text:hover ~ .notice-bubble {
	display: block;
}
/*End of t&c bubble*/

.tips.ui-link {color:#00a499;}

/*fb login btn -->delete btn-fb, add btn-fb-lg*/
.dialog-member-login .btn-fb-lg{background:#3b5998;}
.dialog-member-login .btn-fb-lg:visited{color: #fff;border:1px solid #2f4779;}
.dialog-member-login .btn-fb-lg:hover{background:#2f4779;border:1px solid #2f4779;}
.dialog-member-login .btn-fb-lg:active{color: #fff;border:1px solid #2f4779;}

.checkbox-outer label span{vertical-align:bottom;}
.product-discounted-price img {vertical-align: text-bottom;}

.ver_loading span {color:#f13200;}
.resend-ver-code:hover {color: #00a499;}

/*20160302 Referral flow reg button*/
.non-member-referral .btn-block{
    width: 100%;
    margin: 10px 0px;
    position: relative;
    padding: 5px;
}

.non-member-referral .btn-ty-reg.btn-lg {
	width: 230px;
	margin: 20px auto;
	padding: 7px 16px;
}

.thanks-message { margin: 40px 0 20px;}
/*End of 20160302 Referral flow reg button*/

.non-member-referral #contact_name, .non-member-referral #contact_no, .dialog-login-form .col-xs-9, .non-member-referral #tel, .non-member-referral #member_contact_name {
	padding: 2px 5px;
}

/*////////////////End of 20160307 Referral flow revise/////////////////////*/

/*t&c bubble update*/
.non-member-referral .notice-text .notice-bubble {
	z-index: 10;
    display: none;
    padding: 10px;
    margin-top: 30px;
    margin-left: -160px;
    width: 450px;
    height: auto;
    line-height: 16px;
	position: absolute;
    left: 480px;
    top: 24px;
}

/*20160310 Referral flow re revisement*/
a .dialog-fb-login:hover {
    color: #1F2D4C;
}
a .dialog-fb-login {
    color: #3b5999;
    text-align: center;
}

.non-member-referral #dialog-referral-buy #type_error.form-error-msg{
    left: -69px;
}

.non-member-referral #dialog-referral-buy #type_error span,
.row.non-member-referral-price #type_error span{
    width: 66px;
}

.non-member-referral #dialog-referral-buy #name_error span {
    width: 80px;
}

.non-member-referral .dialog-thankspage-content-container .dialog-message .thanks-product-details .col-xs-3.align-right,
.non-member-referral .dialog-thankspage-content-container .dialog-message .thanks-product-details .col-xs-3.text-original-price-unit{
	margin-top: 14px!important;
}

.thank-header.dialog-header .referral-header-logo{
	margin-top: 0px;
}

/* .non-member-referral .thank-header .dialog-referral-title {
    padding-top: 12px;
    padding-left: 49px;
} */

.non-member-referral .thank-header .dialog-referral-title {
	padding-top: 23px;
    padding-left: 105px;
    font-size: 19px;
    margin-bottom: -5px;
    color: #111;
    margin-top: 2px;
}

.non-member-referral .dialog-thankspage-content-container .dialog-content .dialog-message {
	margin-left: 65px;
}

.row.remark {
	color: #7a7a7a;
}

.non-member-referral #name_error {
	width:90px;
}
/*End of 20160310 Referral flow re revisement*/

/*referral-im-button*/
a.btn.btn-lg.btn-block.ui-link.im {
    width: auto;
    margin: 10px auto;
    display: inline-block;
    padding: 7px 19px;
	margin-top: 20px;
}

a.btn.btn-lg.btn-block.ui-link.im img {
	max-height: 24px;
}

/*20160316 Referral flow*/
.non-member-referral.row {
	margin: 5px 10px 10px;
}

.dialog-form .row {
	margin: 0 10px;
}

.thanks-message span a{
	color:#00a499;
}
/*End of 20160316 Referral flow*/

/*20160428 #9659 referral display button logic*/
.popup-price-alert-msg{ margin:4px 0px 6px; color: #F99D26; font-size: 12px;}
.non-member-referral .notice-text .notice-bubble {margin-left: -270px;}
/*end of 20160428 #9659 referral display button logic*/

/*20160429 popup login btn, hotfix, kenny*/
.dialog-content .dialog-btn-wrapper .btn-block{padding:10px 16px;}
.dialog-content .dialog-btn-wrapper{width:330px; margin:0 auto;}
/*end of 20160429 popup login btn, hotfix, kenny*/

/*bug#8873*/
.row .col-xs-5 {width: 50%;float: left;margin-top:0;}

/*bug#7484*/
#dialog-quotation-feedback .product-details .col-xs-5{margin-top:0;}
#dialog-quotation-feedback .product-info .product-image img {height:60px;}
#dialog-quotation-feedback .product-info .product-details{padding-bottom:3px;}
#dialog-quotation-feedback .product-details .col-xs-7 {font-size: 17px;}
#dialog-quotation-feedback .dialog-form .row {margin-bottom: 10px;}

/*20160429 popup login btn, hotfix, kenny*/
.dialog-content .dialog-btn-wrapper .btn-block{padding:10px 16px;}
.dialog-content .dialog-btn-wrapper{width:330px; margin:0 auto;}
.nav-tabs > li{margin-bottom: -2px;}
.nav-tabs > li > a{border:none;}
/*end of 20160429 popup login btn, hotfix, kenny*/


/* fix image scroll bar #8687 */
#dialog-product-info .dialog-content-container.dialog-content-container-scroll {overflow-y:auto;}

/*20160614 popup quotation remarks, feature, tim*/
#dialog-quotation textarea.invalid {border-color: red;}

/*20160615 warranty referral order page*/
.warranty-bar {
	background-color: #ed2a5b;
	border-radius: 16px;
	/*height: 32px;*/
	width: 420px;
	color: #ffffff;
	font-size: 15px;
	text-align: center;
	line-height: 32px;
	display: block;
	margin: auto;
}
.thanks-message img {
    width: 25px;
    height: auto;
    vertical-align: bottom;
}

.warranty-remark {
	font-size: 14px;
	color: #aaa;
	font-weight: normal;
	padding-left: 122px;
	clear: both;
	text-align: left;
	padding-right: 15px;
}

.warranty-bubble .bubble-content h4 {color: #00a499;}
.warranty-bubble .bubble-content{
	background: #fff;
	border: 1px solid #aaa;
	margin: auto;
	margin-top: -1px;
	padding: 5px 10px;
	border-radius: 5px;
	color: #333;
	width: 320px;
}

.warranty-wrapper {position: relative; cursor: pointer; margin-top: -25px;}
.warranty-bubble {
	display: none;
	position:absolute;
	top: -105px;
    right: 0;
}

.warranty-bubble .arrow {margin: auto; display: block; margin-top: -1px;transform: rotate(180deg);}
.warranty-bar:hover + .warranty-bubble {display: block;}
.warranty-bubble:hover {display: block;}
.warranty-bar:hover {background-color: #ce174c;}

.bubble-content p{margin:0;}
.non-member-referral #dialog-referral-buy .dialog-content-container{overflow:visible;}

/* 20160901 updated charity bar */
.warranty-bar{border-radius: 25px;    line-height: 20px;    padding: 5px;}
.warranty-bubble{    top: -85px;}

/*20161130 #13033 repeated RB*/
.warranty-bubble{top:top: -115px;right:30px;}/*warranty*/
.dialog-referralbuy-error{width: 540px;margin: 90px auto;}
.dialog-referralbuy-error-text{float: right;padding-top: 15px;width: 335px;margin-top: 20px;}
.dialog-referralbuy-error-text p{margin: 0; line-height: 28px;}
.dialog-referralbuy-error .dialog-referralbuy-error-header{font-size:22px; color:#00a499;font-weight: bold; text-align: left;margin-bottom: 10px;}
.dialog-referralbuy-error-text a{color:#00a499;}
.dialog-referralbuy-error-text a:hover{color:#00a499;text-decoration: underline;}

/*20170620 referral buy form test a */
.thanks-message-content a {font-size: 15px; font-weight: bold; color: #00a499;}
.thanks-message-content a:hover { color: #08867d;}
.non-member-referral .thanks-message {margin: 20px 0 10px;}

/*20170620 referral buy form test b */
.non-member-referral { }
.referral-b { padding: 10px 15px;}
.referral-b .dialog-header {
    padding: 0;
    margin: 0;
    border-bottom-width: 1px;
}
.referral-b.non-member-referral .referral-header-logo {
    height: 45px;
    float: none;
}
.referral-b .referral-header-logo img {height: 44px;}
.referral-b.non-member-referral .dialog-referral-title {
    font-size: 16px;
    font-weight: normal;
    display: inline-block;
    padding: 0;
    vertical-align: bottom;
    padding-bottom: 5px;
    
}
.referral-b.non-member-referral .dialog-referral-explanation-icon {
	display: inline-block;
  position: relative;
 	overflow: visible;
}
.referral-b.non-member-referral .dialog-referral-explanation-icon img {
	width: 17px;
	height: 17px;
 	margin: 8px 0 0 0;
}
.referral-b.non-member-referral #tooltip-explanation{
	top: 0px;
  left: 180px;
  width: 380px;
  max-width: 380px;
  background: rgb(250, 243, 157);
}
.referral-b.non-member-referral #tooltip-explanation.right .arrow:after{
	border-right-color: rgb(250, 243, 157);
}
.referral-b.non-member-referral #tooltip-explanation #tooltip-explanation-content {
	color: rgb(130, 130, 130);
	font-size: 12px;
}

.referral-b.non-member-referral .referral-notice {
    display: inline-block;
    padding: 0;
    vertical-align: bottom;
    padding-bottom: 5px;
    padding-left: 10px;
    color: #aaaaaa;
	padding-left: 115px;
    margin-bottom: -5px;
}

.referral-wrapper {margin-top: 10px;position: relative;}
.referral-wrapper {margin-top: 20px;position: relative;}
.referral-b .row {margin: 0;}

.referral-b .rf-product {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin: 10px 0;
    font-size: 14px;
    color: #8e8e93;
}

.rf-product .pd-title {color: #111;}
.rf-product .pd-title:first-child {width: 60px;}
.rf-product .title_warp_text:nth-child(2) {width: calc(50% - 60px); padding-right: 10px;}
.rf-product .pd-title:last-child {width: 32px;}
.rf-product .title_warp_text:nth-child(4) {width: calc(50% - 32px);}


.referral-b.non-member-referral .product-name {
    font-weight: bold;
    font-size: 16px;
    color: #333;
}

.referral-b.non-member-referral .product-info {
    width: auto;
    padding: 0;
    margin: 0 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 0;
}

.referral-b .warranty-wrapper {
    margin-top: 0;
    width: 505px;
}

.referral-b .warranty-bar {
    height: 50px;
    padding: 15px 0;
    width: 485px;
    margin-top: 5px;
}

.referral-wrapper .title {
    font-size: 14px;
    /*color: #111;*/
    margin: 10px 0 5px;
    text-align: center;
}

.rf-confirm-table .row-02 .title {
    font-size: 12px;

}

.rf-confirm-table .row-01 .product-name {
    font-size: 14px;
    font-weight: bold;
}

.rf-confirm-table .row-01 .merchant-name {
    color: #8e8e93;
}

.rf-confirm-table .product-discounted-price.member-referral-flow {margin-left: 5px;}
.rf-confirm-table .product-price-original.member-referral-flow {margin-left: 5px;}

.rf-price-checkbox { display: none;}
.rf-price-select {
    border: 1px solid #eaeaea;
    border-radius: 6px;
    padding: 10px;
    width: 265px;
    cursor: pointer;
    background: url(../images/icon-tick.png) no-repeat 95% center;
    background-color: #f3f3f3;
    background-size: 23px;
    text-align: left;
	margin: 0 2px 5px;
}

.rf-price-select:hover {
    background-color: #ebf7f7;
    border-color: #8ed8d0;
}

.rf-price-select img {
    vertical-align: middle;
    /* margin-top: -2px; */
}

.rf-price-checkbox:checked + .rf-price-select {
    border-color: #18cec1;
    box-shadow: 0 0 3px rgba(0, 164, 153, 0.4);
    background: url(../images/icon-ticked.png) no-repeat 95% center #f1faf9;
    background-size: 23px;
    transition: 0.2s;
}

.rf-remark-wrapper {
    word-break: break-all;
    color: #8e8e93;
    font-size: 13px;
    line-height: 17px;
}
.rf-info {
    width: 100%;
    min-height: 200px;
    padding: 15px 5px 20px;
    position: relative;
}

.rf-info .title {
    color: #8e8e93;
    margin-top: 0;
}

.rf-guest, .rf-member {
    width: 49%;
    display: inline-block;
    vertical-align: top;
    padding: 0 20px;
    opacity: 1;
    transition: 0.2s;
}

.rf-guest {
    border-right: 1px solid #dadada;
    
}

.rf-member .rf-form {
    padding: 0px;
}

.rf-member.logedin .rf-form {
    padding: 0;
}

.rf-form {
    width: 100%;
    text-align: center;
}
.rf-form-control {
    background-color: #fff;
}

.rf-form-control, .rf-form-btn {
    border: 1px solid #bbb;
    border-radius: 4px;
    padding: 10px !important;
    font-size: 14px;
    margin-bottom: 5px;
    width: 100%;
}

.rf-form-control-upper {
	border-radius: 4px 4px 0 0;
	margin-bottom: 0px;
	border-bottom: 1px solid #eaeaea;
}
.rf-form-control-lower {
	border-radius: 0 0 4px 4px;
	margin-top: -1px;
	padding: 7px 0px !important;
	border-top: 1px solid #eaeaea;
}
.rf-form-control-lower label {
	margin-bottom: 0px;
	cursor: pointer;
    border: 1px solid #eaeaea;
    border-radius: 4px;
	color: #aaa;
    padding: 4px 16px;
    margin: 0 4px;
	background-color: #f3f3f3;
	width: 28%;
	font-weight: normal;
}
.rf-form-control-lower label:hover{
	background-color: #ebf7f7;
    border-color: #8ed8d0;
    color: #00a499;

}
.rf-form-control-lower label.selected {
	border-color: #18cec1;
    box-shadow: 0 0 3px rgba(0, 164, 153, 0.4);
    background-color: #ebf7f7;
	transition: 0.2s;
	color: #1c9d92;
}

.rf-form-btn {
    background-color: #00a499;
    border-color: #00a499;
    color: #fff;
    margin-bottom: 0;
    margin-top: 0px;
    -webkit-appearance: none;
    outline: none;
    opacity: 1;
}

.rf-form-btn.outline {
    border-color: #00a499;
    color: #00a499;
    background-color: #FFFFFF;
    margin-bottom: 10px;
}

.rf-form-btn.outline:hover, .rf-form-btn.outline:focus {
    background-color: #08867d;
    color: #fff;
}

.rf-fb-btn {
    color: #3b5998;
    cursor:pointer;
}

:focus {
  outline-color: transparent;
  outline-style: none;
    outline: none;
}

.fb-btn {
    background-color: #3b5998;
    border-color: #3b5998;
}

input::placeholder {color: #bbb;}
input::placeholder-shown {color: #bbb;}
input::-webkit-input-placeholder { color: #bbb;}
input::-moz-placeholder { color: #bbb;}
input:-ms-input-placeholder { color: #bbb;}
input:-moz-placeholder { color: #bbb;}

.referral-wrapper .remark {
    color: #8e8e93;
    font-size: 13px;
    padding: 0 5px;
}

.rf-info + .remark {
    position: absolute;
    bottom: 5px;
}

.rf-guest .rf-form-btn, .rf-member.logedin .rf-form-btn {
    /* pointer-events: none; */
}

.rf-guest:not(.verify) .rf-form-btn, .rf-member.logedin .rf-form-btn, .rf-guest.verify .rf-form-btn {
    opacity: 0.4;
}

.rf-guest .rf-form-control:focus ~ .rf-form-btn, .rf-guest .rf-form-control:valid ~ .rf-form-btn, .rf-form-btn:focus,
.rf-member.logedin .rf-form-control:focus ~ .rf-form-btn, .rf-member.logedin .rf-form-control:valid ~ .rf-form-btn,
.rf-guest.verify .rf-form-control:focus ~ .rf-form-btn, .rf-guest.verify .rf-form-control:valid ~ .rf-form-btn{
    background-color: #00a499;
    border-color: #00a499;
    transition: 0.2s;
    pointer-events: auto;
    opacity: 1;
}

.rf-form-btn:hover,
.rf-guest .rf-form-control:focus ~ .rf-form-btn:hover,
.rf-guest .rf-form-control:valid ~ .rf-form-btn:hover,
.rf-member .rf-form-control:focus ~ .rf-form-btn:hover,
.rf-member .rf-form-control:valid ~ .rf-form-btn:hover {
    background-color: #08867d;
    border-color: #08867d;
    transition: 0.2s;
}

.rf-form-btn.fb-btn:hover {background-color: #294175; border-color: #294175;}

.img-loading {
    width: 20px;
    vertical-align: text-bottom;
}

.rf-guest.verify, .rf-member.logedin {
    width: 100%;
    border: 0;
}

.rf-guest.verify .title,
.rf-member.logedin .title,
.rf-guest.verify .rf-form,
.rf-member.logedin .rf-form {
    max-width: 260px;
    margin: auto;
}

.rf-guest.verify .title, .rf-member.logedin .title {
    margin-bottom: 5px;
}

.rf-guest.verify .title {text-align: left;}

.rf-member.verify {display: none;}

@keyframes gradientBtn {
  from {
    background-color: #00a499;
    border-color: #00a499;
  }
  to {
    background-color: #72dad3;
    border-color: #72dad3;
  }
}

input.disabled, input.disabled:-webkit-autofill{
    border: 1px solid #efefef;
    background-color: #efefef;
    -webkit-box-shadow: inset 0 0 0px 9999px #efefef;
}

.rf-member.logedin .rf-form input.disabled {
    width: 100%;
}

.rf-guest.verify input.disabled, .rf-member.logedin input.disabled:nth-child(2) {
    width: 110px !important;
}

.rf-member.logedin input.disabled + input.disabled {
    width: 100%;
}

.rf-guest.verify input:nth-child(3), .rf-member.logedin input:nth-child(3) {
    width: 145px;
    float: right;
    transition: 0.2s;
}

.referral-wrapper .rf-info .title a {float: none; font-size: 13px; margin-left: 5px;}
.referral-wrapper .rf-info .title a:hover {color: #08867d; text-decoration: none;}
.error-msg {color: #f13200;}
.rf-form-control.error {
    border-color: #f13200;
    background-color: rgba(241, 50, 0, 0.03);
}

@keyframes bgReflash {
  from {
    background-color: rgba(241, 250, 249, 0.7);
  }
  to {
    background-color: #fff;
  }
}

.rf-confirm-table {
    background-color: #f2faf9;
    border: 1px solid #c6e1df;
    border-radius: 6px;
    width: 100%;
    min-height: auto;
    margin: 0;
    padding: 15px 0px 20px;
}

.rf-confirm-table .column-01 {
    display: inline-block;
    display: inline-flex;
    justify-content: center;
    flex-direction: column;
    vertical-align: top;
    width: 100%;
    border: 0px solid #c6e1df;
    min-height: auto;
}

.rf-confirm-table .column-01 .row-02 * {vertical-align: baseline;}
.rf-confirm-table .column-01 .row-02 img {
    /* vertical-align: sub; */
    position: relative;
    top: 2px;
    margin-left: 3px;
}

.rf-thk-wrapper .row-01, .rf-confirm-table .row-01 {
    margin: 0;
    display: flex;
    padding: 0 20px;
}

.rf-confirm-table .product-image {display: flex; justify-content: center; align-items: flex-start; margin-top: 5px;}

.rf-confirm-table .column-02 {
    display: inline-flex;
    justify-content: center;
    flex-direction: column;
    padding: 10px 10px 20px;
    margin: 0 20px;
    border-bottom: 1px solid #c6e1df;
    margin-bottom: 20px;
    width: calc(100% - 40px);
}

.rf-confirm-table .column-02 a, .rf-confirm-table .column-02 a strong {
    color: #00a499;
}

.remark-wrapper {
    padding: 15px;
}

.remark-wrapper .header {
    color: #aaaaaa;
}

.remark-wrapper table {
    margin: 20px 10px 0;
    color: #aaaaaa;
}

.remark-wrapper table .icon {
    width: 15px;
    margin-right: 10px;
}

.remark-wrapper table tr td {
    padding-bottom: 10px;
}

.remark-wrapper table tr td:first-child {
    width: 180px;
    font-weight: bold;
    color: #777;
    vertical-align: top;
}

.remark-wrapper table tr td:first-child img {
    vertical-align: sub;
}

.rf-confirm-table p strong {color: #333;}
.rf-confirm-table p {margin-bottom: 5px;}

.referral-b .notice-text .notice-bubble {top:0;}
.referral-b .bubble-content {box-shadow: 3px 3px 10px -2px rgba(0,0,0,0.4);}
.referral-b .bubble-content h4 { font-size: 14px;font-weight: bold;margin-bottom: 5px;color: #555;}
.referral-b .notice-text .notice-bubble .bubble-content h4 {color: #555;}
.referral-b .bubble-content p { font-size: 13px;color: #8e8e93;margin-bottom: 5px;}
.referral-b .warranty-bubble { top: 50px;right: 0;left: 0;}
.referral-b .warranty-bubble .arrow{ transform: rotate(0);}
.referral-b .warranty-bubble .bubble-content { width: 94 %;}
.referral-b .warranty-bubble .bubble-content p { margin: 0; padding: 5px;}

.form-field {
    border: 1px solid #bbb;
    border-radius: 4px;
    padding: 10px;
    font-size: 14px;
    margin-bottom: 5px;
    width: 100%;
    display: block;
}
.form-field.disabled {
    border: 1px solid #efefef;
    background-color: #efefef;
}

.referral-b .rf-product, .referral-b form .rf-bottom {padding: 0 20px;}
form .rf-order > .row-01, form .rf-order > .row-02 {width: 100%;display: block;}
form .rf-order > .row-01 {
    text-align: center;
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
    width: calc(100% - 40px);
    margin: 18px auto 0px;
    padding-bottom: 20px;
}

.referral-b form .rf-order {
    margin: 20px 20px 0px;
    padding: 0;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.rf-price-wrapper .title {
    position: absolute;
    background-color: #fff;
    top: 20px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 150px;
    text-align: center;
    
}

.referral-b form .rf-bottom .title, .referral-b form .rf-order.title {
    text-align: center;
    display: block;
}

.referral-b form .rf-bottom .title {margin-top: 0px;}

.desc-01 {margin-top:4px; width: 40%; display: flex;}
.desc-01 img {position: absolute; width: 25px;height: 25px;}
.desc-01 .desc-title {display:block;font-size: 14px;font-weight: 500;color: #121212;}
.desc-01 .content {color: #8e8e93; font-size: 13px;width: 200px;margin-left: 10px;display: block;}
.desc-01 span{margin-left: 0px;font-size: 12px;}

.desc-02 {margin-top:4px; width: 40%; display: flex;}
.desc-02 img {position: absolute; width: 25px;height: 25px;}
.desc-02 .desc-title {display:block;font-size: 14px;font-weight: 500;color: #121212;}
.desc-02 .content {color: #8e8e93; font-size: 13px;width: 199px;margin-left: 10px;display: block;}
.desc-02 span{margin-left: 0px;font-size: 12px;}

.desc-04 {margin-top:4px; width: 20%; display: flex;}
.desc-04 img {position: absolute; width: 25px;height: 25px;}
.desc-04 .desc-title {display:block;font-size: 14px;font-weight: 500;color: #121212;}
.desc-04 .content {color: #8e8e93; font-size: 13px;width: 100px;margin-left: 10px;display: block;}
.desc-04 span{margin-left: 0px;font-size: 12px;}

.title.or {
    position: absolute;
    background-color: #fff;
    width: 20px;
    height: 30px;
    left: 0;
    right: 0;
    bottom: 120px;
    margin-left: auto;
    margin-right: auto;
    padding-right: 26px;
    padding-top: 5px;
    color: #ccc;
}

.non-member-referral .btn-block.order-login-btn {
    background-color: #F8F8F8;
    border: 1px solid #008A82;
    color: #008A82;
}
.pd-name {width: 55%;}

.title_warp_text {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 5px;
}

.error_input {border-color: #F04141;background-color: #FFF2F2;-webkit-box-shadow: inset 0 0 0px 9999px #FFF2F2 !important;}
.rf-guest , .rf-member {/*opacity: 0.3;*/}
.clearfix {clear:both;}
.member_login_form .title, .pre_order_form .title {text-align: center;}
.member_login_form .rf-info {padding-top: 0;}
.member_login_form .blank {width: 20%; float:left;}
.member_login_form .rf-member {width: 80%; float:left;}
.member_login_form .rf-member.submit {width:80%; float:left;}
.member_login_form .rf-member.submit .rf-form {width:70%; padding:0;}
.member_login_form .rf-member.submit .rf-form button {margin-top: 0;}
.member_login_form .rf-form {width:70%; padding-bottom:10px;}
.member_login_form .back {width:20%; float:left; text-align:center; line-height:42px; cursor:pointer;}
.member_login_form .back img {vertical-align: middle;}
.member_login_form .back span {color: #8e8e93; font-size: 14px;line-height: 20px;vertical-align: middle;}
.pre_order_form .rf-info {padding-top: 0px; min-height: 200px;}
.pre_order_form .rf-member {width:100%; text-align:center; padding-top:0px;}
.pre_order_form .rf-form {width:56%; padding-bottom:10px; margin: 0 auto;}
.pre_order_form .prefill {text-align:left; padding-top:10px; padding-bottom:10px;}
.member_login_form .error-msg, .pre_order_form .error-msg {
    /* margin-top: -5px; */
    padding-bottom: 10px;
    /*text-align: left;*/
}

.icon-save {height: 15px; vertical-align: text-bottom;}

.referral-b .dialog-header {
    position: fixed !important;
    height: 45px;
    top: 0;
    z-index: 100;
	background-color: white;
}

.dialog-content-container {
    top: 80px;
}

.referral-b #dialog-referral-buy {
    margin-top: 50px;
    height: 640px;
    /*overflow-y: auto;*/
}

.referral-b {
	overflow-y: hidden;
}
a.referral-header-logo {pointer-events: none;}

.non-member-referral .referral-notice {
    padding-left: 115px;
    margin-bottom: -5px;
}

.non-member-referral .thank-header .dialog-referral-title {
    padding-top: 23px;
    padding-left: 105px;
    font-size: 19px;
    margin-bottom: -5px;
    color: #111;
    margin-top: 2px;
}
.non-member-referral .dialog-referral-title {
    width: auto;
    font-size: 19px;
    font-weight: bold;
    margin-left: 10px;
    padding-left: 105px;
    margin-top: 5px;
}

.modal-content {
	border: 1px solid rgba(0, 0, 0, .2);
	border-radius: 3px;
	-webkit-box-shadow: 2px 4px 7px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 2px 4px 7px 0px rgba(0, 0, 0, 0.2);
	width: 86%;
	margin: 5px auto 0;
}
.modal-body p {
	margin-bottom: 0;
}
.cancel_repeatBuy {cursor:pointer;}
.cancel_repeatBuy:hover {color: #6f6f73;}




/** 20181205 liquor message **/
.label-checkbox-liquor {
	overflow: hidden;
	margin-left: -10px;
}
.label-checkbox-liquor input {
	float: left;
}
.label-checkbox-liquor span {
	width: 220px;
	text-align: left;
	float: left;
	font-weight: normal;
	color: #8e8e93;
	padding-left: 6px;
}
.label-checkbox-liquor.error_input {
	background: none;
	border-color: transparent;
	box-shadow: none !important;
}
.label-checkbox-liquor.error_input span {
	color: #f04141;
}

.rb-alert-icon{
    max-height: 16px;
    margin-right: 3px;
}

/* web oauth login revamp, 2020-03-11 */
.btn-lg--form-login {
    border-radius: 4px;
}


/*google login */
.google-container, .facebook-container, .apple-container, .member-container{
	height: 45px;
	border-radius: 4px;
	border: solid 1px #999;
	background-color: #fff;
    margin: 8px 0;
    cursor: pointer;
}
.facebook-container {
	border: solid 1px #1877f2;
}
#facebook-signin.signin-btn--invert {
    background-color: #fff;
    border: 1px solid #1877f2;
}

#facebook-signin.signin-btn--invert:before {
    background-image: url(../../images/fb/login-icon-facebook.png);
    border-radius: 50%;
}
.member-container{
    border: solid 1px #00a499;
}
.google-text-box, .apple-text-box, .facebook-text-box, .member-text-box {
	display: -webkit-box;
    display: -webkit-flex;
    display: flex; 
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-direction: row;
    flex-direction: row;
    justify-content: center;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 100%;
    /* position: relative; */
    width: 100%
}
.google-text, .facebook-text, .apple-text, .member-text{
	position: relative;
	display: flex;
	-webkit-flex-wrap: nowrap;
	-webkit-flex-direction: row;
    flex-direction: row;
	-webkit-align-items: center;
    align-items: center;
    flex-wrap: nowrap;
	/* font-family: Roboto; */
    font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	font-stretch: normal;
	font-style: normal;
	line-height: normal;
	letter-spacing: 0.22px;
}
.member-text{
    color:#00a499;
}
.google-text {
	color: rgba(0, 0, 0, 0.54);
}
.facebook-text {
	color: #1877f2;
}
.apple-text{
	color: #121212;
}
.google-text-box:before, .facebook-text-box:before, .apple-text-box:before{
	height: 22px;
	width: 22px;
	content: '';
	margin-right:10px;
}

.google-text-box:before {
	background: url(../images/google/login-icon-google.png) no-repeat center;
}

.facebook-text-box:before{
	background: url(../images/fb/fb_btn_icon.png) no-repeat center;
}
.apple-text-box:before{
    background: url(../images/apple/apple_btn_icon_white.png) no-repeat center;
}

#appleid-signin {
    display: none;
}

#appleid-custom-signin.signin-btn--invert {
    background: transparent;
    border: 1px solid #bbbbbb;
}

#appleid-custom-signin.signin-btn--invert:before {
    background-image: url(../../images/fb/login-icon-apple.png);
    border-radius: 50%;
}

#appleid-custom-signin.signin-btn--invert span {
    color: #111;
}

#appleid-custom-signin.signin-btn--in-rb-form {
    width: 100%;
    height: 42px;
}

#appleid-custom-signin.signin-btn--in-rb-form:before {
    width: 22px;
    height: 22px;
}

#appleid-custom-signin.signin-btn--in-rb-form span {
    font-size: 14px;
}

#appleid-custom-signin.signin-btn--in-form-login {
    margin-top: 8px;
}

#facebook-signin.signin-btn, .rf-form .signin-btn {
    margin-bottom: 8px;
}