
/*=============================Ru edit ↓=============================*/
.btn_basic.btn_radius_100{border-radius: 100px;}
/*
common
  共用模組==== lightbox
  共用模組==== btn

layout
  

*/


/* ====共用模組==== lightbox (預設垂直置中)*/

.lightbox-basic{

    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    display: none;

}
.lightbox-basic-box{
    width: 580px;
    height: auto;
    background: #FFF;
    border: solid 7px #dbdbdb;
    position: absolute;
 /*   top: 0;
    bottom: 0;*/
    left: 0;
    right: 0;
    overflow-y: auto;
    padding: 1.5%;
    top:50%;
  left: 50%;
  max-height: 72vh;
  transform: translate(-50%, -50%);
}
.lightbox-basic-box .title{
    font-size: 22px;
    line-height: 22px;
    letter-spacing: 2px;
    font-weight: bold;
    color: #000;
    text-align: center
}
.lightbox-basic-close {
    position: absolute;
    top: 2%;
    right: 2%;
    cursor: pointer;
}

/* 會員註冊-電子簽名用 */
.lightbox-signature{
    display: block;
    visibility: hidden;
}

@media (max-width: 1200px){
    .lightbox-basic-box {
        width: 75%;
        
        padding: 6%;
        text-align: left;
    }
}


/* ====共用模組==== btn */

.lightbox-basic-box .btn_box{
    display: flex;
    justify-content: center;
    align-items: center;
}

.lightbox-basic-box .btn_box .btn_basic{
    min-width: 180px;
}

@media (max-width: 1200px){
    .lightbox-basic-box .btn_box .btn_basic{
    min-width: 30%;
}
}









@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700&display=swap');

body {
	font-family: sans-serif ,'Roboto Condensed', 'Noto Sans TC',"微軟正黑體", Microsoft JhengHei;
}

body.navHeight{   padding-top:64px; /*  扣掉nav 高度 */ }
body.navSortHeight{   padding-top:calc(64px + 42px); /*  扣掉nav 高度 */ }


@media only screen and (max-width: 1200px) {
    body.navHeight{padding-top:60px;} 
    body.navSortHeight{   padding-top:calc(60px + 42px); /*  扣掉nav 高度 */ }
   

}

.ps{color:#ccc; font-weight: normal; padding-left: 3px;}

/* QA */
.fcsl_arrow{
    background: url(../images/faq_contact_arrow_right.png) 50% 0 no-repeat;
    width: 7px;
    height:22px;
}
.fcsl_title.active .fcsl_arrow{
    background: url(../images/faq_contact_arrow_active.png) 0% 0 no-repeat;
     width: 13px;
    color: #ae8f72;
 }
 .fcsl_ul li.current{color: #ae8f72;}



.product_detail {    margin-bottom: 0;}
.product_detail_text_shop{ text-align: right; margin-bottom: 40px; }
.product_detail_text_shop ul {    width: 48%;    margin: 0 0 0 auto;    }
.product_detail_guess{ margin-bottom: 40px; }

.product_detail_guess .select_box{ margin-bottom: 20px; }

.product_detail_guess .select_box select{margin:2px 5px;}

.fu1000_con .li_4:hover ul.icon_box {    display: block;}
.fu1000_con .li_4:hover .p_pic_hover {    background-color: rgba(126,224,225,0.75); display: block;
    width: 100%;
    height: 100%;
    padding-bottom: 71%;
    margin-bottom: 20px;
    position: relative;}

.product_detail_guess_list .select_box{margin-bottom: 15px; margin-top: 15px;}
.product_detail_guess_list .select_box li{padding-bottom:5px;}    
.product_detail_guess_list .select_box li select{ height: 30px; margin: 0 3px; min-height: 30px;}

/* 購物車 明細 */
    

.p_commodity_con_info_conbox{ display: block; }
    .p_ccic_eye{ display: inline-block; width: 77%; float: left; }
    .p_ccic_num{display: inline-block;  float: right;}
    .p_ccic_num div, .p_ccic_eye div{ line-height: 28px; color: #959595; font-size: 16px; }
    .p_ccic_num span, .p_ccic_eye span{ color:#5f727f ; padding:0 2px; font-size: 16px;}
    .p_ccic_num div select{ width: 60px; min-height: 28px; margin-bottom: 4px; text-align: center;}


/* 購物車地址 */

.popaddr{ position: relative; }
.popaddr input{padding-right: 24px; }
.popaddr button{
    background: transparent url(../images/ic_addr_select.png) 100% 50% no-repeat;
    background-size: contain;
    border:0; 
    position: absolute; 
    top: 12px; right: 7px;
    width: 12px;
    height: 23px;
    cursor: pointer;
  }


.popaddr .detail2_con_div3_ul{
    display: none;
    width: 100%;
    position: absolute;
    top: 45px;
    left: 0;
    background-color: #FFF;
    box-shadow: 1px 1px 20px 1px rgba(0,0,0,0.2);
    border-radius: 8px;
}

.popaddr .detail2_con_div3_ul  ul{ width: 100%; }
.popaddr .detail2_con_div3_ul li{
    font-size: 15px;
    letter-spacing: 1px;
    color: #939393;
    padding: 0 5%;
    width: 90%;
    display: block;
    margin: 15px 0;
    cursor: pointer;
}

.popaddr .detail2_con_div3_ul li:after{
    content: '';
    display: block;
    background-color: #bcbcbc;
    width: 100%;
    height: 1px;
    margin: 14px auto 0 auto;
}
.popaddr .detail2_con_div3_ul li:last-of-type:after{ display: none; }









/* light box */
.lightbox_outbox{ width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    display: none; 
}
.lightbox_wrapper_red{
	width: 600px;
    height: 500px;
    max-width: 86%;
    padding: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    background-color: #FFF;
    border: solid 5px #f8736d;
    border-top-left-radius: 0px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;

     display: flex;
    flex-direction: column;
    overflow-y: hidden;

}
.lightbox_wrapper_red .product_detail_text_title {
    width: auto;
    font-size:24px;
    color: rgb(60, 57, 80);
    line-height: 1;
    flex: 1 1 auto;
    padding:20px 20px 10px;
    margin-bottom: 0px;

}
.lightbox_outbox .lightbox_close {
    position: absolute;
    top: 2%;
    right:2%  ;
    cursor: pointer;
}
.lightbox_outbox .lightbox_close img{ width: 20px; height: 20px;}
.lightbox_wrapper_red .lightbox_btn_wrapper_con {
    /*overflow-y: auto;
    min-height: 345px;
    */
    padding: 0  20px 0px;
    flex: 1 1 auto;
}

.lightbox_outbox .product_detail_text_price {
    margin-bottom: 15px;
}
.lightbox_outbox .product_detail_text_myopia {
    margin-bottom: 0px;
}

.lightbox_outbox .btn_box{ 
    display: block; 
    text-align: center; 
    padding: 10px 0 15px 0;
    flex: none;  
    height: 56px;
}

.lightbox_outbox .product_detail_pic {
    width: auto;
    height: 224px;
    text-align: center;
    margin: 0 auto  10px auto;
}

.lightbox_outbox .friend_price_num{ font-size: 30px; line-height: 1; }
.normal_price_title, .friend_price_title{margin-bottom: 0px;}




.lastconfirm_order_con{font-size: 14px;
    font-weight: bold;
    color: rgb(95, 114, 127);}
    .lastconfirm_wrap .lastconfirm_order_con{padding: 25px 5%; margin-bottom: 0;}

/*.leftline{ background: url('../images/line_gray.jpg') 50% 0 repeat-y; }*/
/* 聯絡我們 */
.contact_main .name_box  .title{color: rgb(95, 114, 127); font-size:16px; margin-bottom: 0; font-weight: bold;}
.eyeinfo_box_list .eye {	text-align: center;}

/* 產品總攬 */
.product_classification_list div a{  padding: 15px;white-space:nowrap; display: inline-block;}
.product_classification_list div:hover{
    color: #fff;
    border-radius: 30px;
     background-color: #ae8f72;
  display: inline-block;
   
}
.product_classification .owl-theme .owl-nav .owl-prev, .product_classification .owl-theme .owl-nav .owl-next{ top: 18%; }


.storehold_class_form{padding-top: 6px;}
.product_main .storehold_class_form select {  margin-right: 15px;}
.product_main .storehold_class_form .btn_basic {
    padding: 7px 10px;
    margin-top: -6px;
    border-radius: 4px;

}

.product_main .product_select_class{ float: left; width: 60%; }
.product_main .product_sorting{ float: right; width: 38%; line-height: 38px;}

.product_main .product_box .ul_3{ clear: both; }



.p_ccic_pic img{ width: 66px; }
.p_ccic_pic .p_ccic_close  img{width: auto;}



/* 購物車 */
.commodity_info_con_num div span input {
    width: 40px;
    margin-bottom: 4px;
}
.commodity_con_info_btn{ width: 95%; margin: 0 auto; }
.shop_cart_offer_add, .shop_cart_offer_btn{ width: 44%; }
.shop_cart_offer_btn{ text-align: right; }
.fu1000_con .li_4 {
    width: calc(100% - 20px);
    padding: 20px 10px;
}
.method_detail_info_list .info_list_con{padding: 8px 4.5%;}
.shop_delivery_method_detail_box input[disabled] , .shop_delivery_method_detail2_box input[disabled]{background-color: #f2f2f2;}

.storehold_class{ padding: 20px 0; }
.method_detail2_con_div2 select{ width: 44%; margin: 0 2% 0 0%; line-height: 1; font-size:16px; }
.method_detail2_con_div2 select.select2{padding-top: 2%; padding-bottom: 2%; }
.method_detail2_con_div2 input{ width: 100%; margin-top: 4px; }


.wid_m .shop_cart_points_info li.scpi_list_last{
    width: 70%;
}

@media only screen and (max-width: 1200px) {
    .wid_m .shop_cart_points_info li.scpi_list_last{
        width: 100%;
    }
    .wid_m li.scpi_list_last div input{ width: calc(100% - 110px); }
}


/*我的收藏 */
.mcpc_con_num .mcpc_con_eye span{ background-color: #fff; }
.mcpc_con_name a{ border-bottom: 1px solid #ae8f72; display: inline-block; }
.mcpc_con_list {
    border-bottom: solid 0px #dfe5e8;
}
.mcpc_con_ul{border-bottom: solid 1px #dfe5e8;}
.mcnc_list.current, .news_class_list.current{ background-color:#ae8f72 ;color: #FFF; }

/* 歷史訂單 */

.search_order_list_list.soll_list6 {
    background-color: #851b24;
    color: #FFF;
    border: solid 1px #851b24;
}

.soll_list1 {
    width: 100%;
    display: block;
    color: #851b24;
    font-size: 14px;
    font-weight: bolder;
}
.soll_list1 span{ font-size: 16px; color: #45484b; padding-left: 5px; }
.search_order_list_box{ display: none; }
.search_order_list_con{ display: block; }

.order_status_box {
    width: auto;
    height:55px;
    left: 0;
    right: 0;
    margin: 10px auto;
    background:none;
    display: block;
	position: relative;
}
.order_status_img .order_status_text{ font-size: 16px; font-weight: bolder; color: #585755; text-align: right; margin-right: -25px;}
.order_status_list2 .order_status_img .order_status_text , .order_status_list3 .order_status_img .order_status_text {    margin: 22px -8px 0 0px;}
.order_status_list4 .order_status_img .order_status_text , .order_status_list5 .order_status_img .order_status_text {    margin: 22px -16px 0 0px;}


.order_status_ul:after{ content: ''; display: block; clear: both; }
.order_status_ul{ width: 90%;border: none;margin-left: 30px; }
.order_status_img .order_status_circle {
    width: 20px;
    height: 20px;
    box-shadow: 0 0 0px 1px #fff;
    background-color: #dbe3e6;
    margin: -13px 0 0 auto;

}
.order_status_img .order_status_line {
    height: 6px;
    margin-top: 0;
    background-color: #dbe3e6;

}

.order_status_ul li{	width: 25%;position: absolute;}
.order_status_ul .order_status_list1 .order_status_circle{  margin-top: -7px;    margin-right: 1px;}

.order_status_ul .order_status_list1{       top: -5px;  left: -25%;}
.order_status_ul .order_status_list2{		top: -5px;	left: 0%;}
.order_status_ul .order_status_list3{		top: -5px;	left: 25%;}
.order_status_ul .order_status_list4{		top: -5px;	left: 50%;}
.order_status_ul .order_status_list5{		top: -5px;	left: 75%;}
.order_status_ul li.gohere .order_status_circle, .order_status_ul li.gohere  .order_status_line{background-color:#ae8f72}




/* 新制定訂單表格 */
.order_item{border-bottom: 1px solid #c8c9c9; padding-bottom: 30px; margin-bottom: 30px;}
.order_box{font-size: 14px; }
	.order_box .order_left{ color: #45484b;font-size: 20px; float: left; width: 64.5%; margin-bottom: 10px; }
		.order_box .order_left .title{ color: #851b24; font-weight: bolder; font-size: 16px; padding-right: 10px; }
	.order_box .order_right{ color: #ae8f72;font-size: 16px; font-weight: bolder;  float: right; width: 34.5%; text-align: right;margin-bottom: 10px; }
		.order_box .order_right img{vertical-align: middle; margin-right: 5px;}

		

	.order_box ul{   display: flex; width: 100%; border: 1px solid #eeeeee; margin-bottom: 4px; font-size: 0;}

	.order_box li{ color: #595757; border: 1px solid #eeeeee; background-color: #fff;  vertical-align: top; 
	 display: inline-flex; align-items: stretch; text-align: center; vertical-align: top;
	 line-height: 1.3;
	 -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;  
	}
	.order_box li:before {    		content: attr(data-title); 		
		background-color: #eeeeee;
		padding: 6px;
		font-size: 14px; 
		-webkit-flex-basis: 100px; /* Safari 6.1+ */
    	flex-basis: 100px;

	}
.order_box li span{background-color: #fff;  padding: 6px; flex: 2;font-size: 14px; }

.order_box li{width: 20%;}

.order_box ul:nth-of-type(3) li:nth-of-type(1){width: 40%;}
.order_box ul:nth-of-type(3) li:nth-of-type(2){width: 60%;}


.order_box .btn_box{ text-align: center; padding:20px 0 0px 0;}
.order_box .btn_basic{ margin-top: 5px; margin-bottom:5px; }

@media only screen and (max-width: 1200px){
    .order_box li, 
    .order_box ul:nth-of-type(2) li,
    .order_box ul:nth-of-type(2) li:nth-of-type(4),
    .order_box ul:nth-of-type(3) li:nth-of-type(1),
    .order_box ul:nth-of-type(3) li:nth-of-type(2),
    .order_box ul:nth-of-type(3) li:nth-of-type(3){width: 50%;}
}

@media only screen and (max-width: 640px) {
    .order_box ul:nth-of-type(3) li:nth-of-type(3){width: 100%;}
}

@media only screen and (max-width: 480px){
    .order_box .btn_basic{width:100%}
}

.btn_basic{    	
    background-color: #ececec;
    border: solid 1px #c9c9c9;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    vertical-align: middle;
    margin-right: 1%;
    margin-left: 1%;
    padding: 8px 10px;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.4;
    color:#4f5255;
    white-space:nowrap;
}
.btn_basic:hover,
.btn_basic:focus  {    color: #4f5255;    background-color: #FFF;}


.btn_shop{
	min-width: 200px;
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 1px;
    border-radius: 1000px;
    border: solid 2px #6d7982;
    color: #6d7982;
    padding: 15px 0;
    text-align: center;
    cursor: pointer;
    background-color: #fff;
}
.btn_shop:hover{border: solid 2px #851b24;    background-color: #851b24;    color: #fff;}
.btn_shop .ic_shop{
	width: 22px;
    height: 22px;
    background-image: url(../images/pd_icon_cart_off.png);
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
}
.btn_shop:hover .ic_shop{    background-image: url(../images/pd_icon_cart_on.png);}



.btn_cyan,.lightbox_btn.btn_cyan{background-color: #851b24;    color: #FFF;    border: solid 1px #851b24;}
.btn_cyan:hover{color: #851b24;  border-color:#851b24; }

.lightbox_btn.btn_cyan:hover, .lightbox_btn.btn_cyan:focus{background-color: #fff;}

.lightbox_btn.btn_cyan{margin-top: 0;}


.btn_gray{background-color: #959595;    color: #FFF;    border: solid 1px #959595;}
.btn_gray:hover{color: #959595;  border-color:#959595;  }

.btn_warm{background-color:rgb(255,51,74);    color: #FFF;    border: solid 1px rgb(255,51,74)}
.btn_warm:hover{color: rgb(255,51,74);  border-color:rgb(255,51,74); }


.shop_cart_btn .btn_cyan:hover { opacity: 0.8;  color: #FFF; background-color: #851b24;  }
.shop_cart_btn .btn_gray:hover { opacity: 0.8;  color: #FFF; background-color: #959595;  }
.shop_cart_btn{ text-align: center; }

.shop_cart_btn ul li{ display: inline-block; padding:0 2%;}


	/* 詳細內容 */
.search_order_list_con{ border: 1px solid #45484b; background-color: #f6f7f7;  border-radius:5px; margin-top: 20px;}
ul.solc_detail_title {
    background-color:transparent;
    color: #45484b;
    border-bottom: 1px solid #45484b;
    width: 88%;
    margin: 0 auto;
}
ul.solc_detail_content {
    width: 88%;
    border-left: solid 0px #e1e7e9;
    border-right: solid 0px #e1e7e9;
    border-bottom: solid 0px #e1e7e9;
    box-sizing: border-box;
    margin: 0 auto 0px auto;
}

ul.solc_detail_content li {
    display: inline-block;
    vertical-align: middle;
    padding: 5px 0;}
.solc_detail_name_con a{font-weight: bolder; font-size: 18px;}
.solc_detail_name_con span{ color: #45484b; padding: 0 8px; display: inline-block; }
.solc_detail_price, .solc_detail_price_con{ width: 10.5%; }
.solc_detail_name, .solc_detail_name_con{width: 63.5%;}
.solc_detail_price_con{ color:#851b24; font-size: 18px; font-weight: bolder; }
.solc_detail_num_con{font-size: 18px; font-weight: bolder;}


/* 門市據點 */
.storehold_class_form select{padding: 0 24px 0 8px;}
.storehold_class .search_box{padding: 0px 13px;}
.search_box button{margin: 7px -2px;}




/* 會員中心 */

.process_box{
	background:url(../images/bar_eye_pic.png) 0 0 no-repeat;
	background-size: contain;
	width:284px;
	height:284px;
	position:relative;
	text-align:center;
	margin: 0 auto;
}

.process_box #canvas{
  display: block;
  margin: 0 auto;
}
.process_box .text{  position:absolute; top:31%; left:50%; text-align:center; width:48%; margin-left:-24%; line-height:1.3; font-weight:bold;color:#3f3939; font-size:16px;}
.process_box .text .name{ display:block;}
.process_box .hello{ color:#3c3d42; font-size:16px; margin-bottom:10px; font-weight:bolder; line-height:1.5;}
.process_box .red{color: #d12643;  padding:0 0px;}

.member_center_info_up {
     height: auto; 
    padding-bottom: 20px;
}
.btn-disable{ background-color: #202126; }
.btn-disable .info_down_list_con, .btn-disable.member_center_good_list1, .btn-disable .member_center_good_list_center{cursor: not-allowed;}
.btn-disable img, .btn-disable p{ opacity: 0.2; }
.btn-disable.info_down_list:hover{ opacity: 1; }

.btn-disable .member_center_good_list_title{opacity: 0.2;}
.btn-disable.member_center_good_list1:hover {
    background-image: none;cursor: not-allowed;
}



.member_center_good_title p{    white-space: nowrap;} /* 標題強制不換行 */

.sidebar_first{position: relative;}
.sidebar_hover_text {    text-align: left; }
.sidebar_hover{  top: -10px; }

.sidebar_hover:before{ 
	
	content: '';
	display: block;
	height: 6px;
	background-color: #ae8f72; 
	position: relative;
	left: 63%;
	top: 0;
	right: -100px;
	z-index: 50000;

}

.point_box{
	width: 45px;
    height: 70px;
    padding: 13px 28px 15px 15px;
	color: #fff;
	font-size: 16px;
	background: url('../images/ic_bg_point.png') 0 0 no-repeat;
	background-size: contain;
	text-align: right;
	position: absolute;
	right: 0;
    top: 0;
}
.point_box span{ font-size: 32px; display: block; font-weight: bolder; }


.field_row{margin-bottom: 15px;}
.field_row .title{
    width: 100%;
    font-size: 16px;
    line-height: 16px;
    font-weight: bold;
    color: rgb(95, 114, 127);
    margin-bottom: 12px;
    margin-top: 5px;
}
.field_row .disc{
    font-size: 14px;
    font-weight: bold;
    color: rgb(95, 114, 127);
    margin: 5px 0 10px 2%;
}

.field_row.inline_row .title{  padding-right: 20px;position: absolute; width: 84px; vertical-align: middle; }
.field_row.inline_row .radio_inner{position: relative; left:90px;}
.field_row.inline_row .radio_inner li{ display: inline-block; padding-right: 30px; }

@media screen and (max-width: 1200px) {
    .point_box span{font-size: 20px;}
    .point_box{font-size: 12px;}
    .point_box{
        width: 30px;
        height: 41px;
        right: -19px;
        top: -20px;
        padding: 13px 22px 15px 15px;
    }
}


/* ====Modul==== checkbox */
.check_center{ text-align: center; }
input.checkbox[type="checkbox"] {    display:none;}

input.checkbox[type="checkbox"] + label {    padding-right:15px; line-height:20px; width:100%; }

input.checkbox[type="checkbox"] + label span {
    display:inline-block;
    width:19px;
    height:19px;
    margin:-2px 5px 0 0;
    vertical-align:middle;
    background:url(../images/form_check.png) left top no-repeat;
    cursor:pointer;
}

input.checkbox[type="checkbox"]:checked + label span {
    background:url(../images/form_check.png) left bottom no-repeat;
}


/* ====Modul==== radio */
input[type="radio"] {
    display:none;
}
input::placeholder{ color:#bfbfbf;}

input[type="radio"] + label {
    color:#5f728a;
    font-family:Arial, sans-serif;
  padding-right:5px; line-height:30px; 
  font-family: Arial, Helvetica,"微軟正黑體", Microsoft JhengHei, sans-serif;
}

input[type="radio"] + label span {
    display:inline-block;
    width:14px;
    height:14px;
    margin:-2px 5px 0 0;
    vertical-align:middle;
    cursor:pointer;
   background:url(../images/form_radio.png) left top no-repeat;
  
}

input[type="radio"]:checked + label span {
    background:url(../images/form_radio.png) left bottom no-repeat;
    
}

input[type="radio"]:disabled + label span {
   background:url(../images/form_radio_disabled.png) left top no-repeat;
   cursor: not-allowed;
  
}

input[type="radio"]:checked:disabled + label span {
    background:url(../images/form_radio_disabled.png) left bottom no-repeat;
    cursor: not-allowed;
}
/* .====Modul==== radio */

input, textarea, select{border:1px solid #dfe5e8; border-radius: 4px ; font-size: 16px; min-height: 35px;}

input::placeholder, textarea::placeholder {
  color: #a7a7a7;  font-size: 16px;
}

.addr_box{font-size: 0;}
.addr_box select{border: 1px solid #dfe5e8; width: 100%;}
.addr_box div[data-role="county"], .addr_box div[data-role="district"]{ width:33%; margin-right: 1%; display: inline-block; }
.addr_box div[data-role="zipcode"]{width: 32%; display: inline-block; }
.addr_box div[data-role="zipcode"] input{ width: 100%;  margin-top: 0px;}
.addr_box input{width: 100%; margin-top: 5px;}



.must{ color: #ff0000; }
.info_list_title .must,
.method_detail2_con_div1 .must{ 
    font-size: 24px; 
    font-weight: bold; 
    display: inline-block;
    vertical-align: middle;
    padding-left: 5px;
    margin-bottom: -6px;
}
.phone_box .phone{ display: block; }

.owl-carousel .owl-stage {
    margin-bottom: 1px;
}

.product_detail_text_shop ul li:hover, .product_detail_text_shop ul li:focus, .product_detail_text_shop_cart.active , .product_detail_text_shop_cart.active:hover, .product_detail_text_shop_cart.active:focus{
    border: solid 2px #851b24;
    background-color: #851b24;
    color: #fff;
}
.product_detail_guess_list .phone_p_pic_hover{ padding: 10px 0; text-align: center; }

select{
	border: 1px solid #dfe5e8;
	border-radius: 4px;	
 padding:0 24px 0 8px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #3c3950;
  cursor: pointer;
	height: 39px; 
  background:#fff url(../images/ic_select_down.png) 100% 50% no-repeat;


}


.index_menu{ display: none;}
.index_main .index_menu{display: block;}



.equity_list_img_block{ display: block; }

.equity_list_img_block{
	position: relative;
	height: 350px;
	margin-bottom: -350px;
	margin-left: -200px;
}



.equity_list_img_block .p_img_block img{
	position: absolute;
}


.p_img_block img:nth-child(1){
	bottom:-45%;
	left: 5%;
	
   
}
.p_img_block img:nth-child(1){
    bottom:-45%;
    left: 5%;
    z-index: 999;
 
   
}



.equity_list:nth-child(1) .equity_list_text, .equity_list:nth-child(2) .equity_list_tex{float: right; text-align: right ; margin-right: 5px; margin-top: 20px;}
.equity_list:nth-child(1) .equity_list_pic, .equity_list:nth-child(2) .equity_list_pic{ float: right; }


.product_detail_text_myopia {    display: flex;}
.left_eye {    flex: 1;}
.left_eye select {    width: 96px;}

/* 晶幣換購 */
.product_detail_text_point {margin-bottom: 30px;}
.product_detail_text_point  .friend_price {    margin-left: 0px;}
.product_detail_text_point .friend_price_title{display: inline;}
.product_detail_text_point .friend_price_num{ font-size: 14px; display: inline; }
.product_detail_text_point .friend_price_num span{font-size: 42px; padding: 0 5px;  }

@media only screen and (max-width: 1200px) {
    .lightbox_outbox .product_detail_pic {
        height: 184px;
    }

}




/*  ==================640 px=========================  */
@media only screen and (max-width: 640px) {


.product_detail_text_shop ul {
    width: 100%;
    margin: 0 0 0 0;
}




.field_row.inline_row .title{  width: auto; position: relative;}
.field_row.inline_row .radio_inner{position: relative; left:0;}


.order_box li, .order_box ul:nth-of-type(2) li:nth-of-type(3), .order_box ul:nth-of-type(2) li:nth-of-type(4){ width: 100%;  }

.order_box ul:nth-of-type(2) li:nth-of-type(3){ width: 100%; }
.order_box ul:nth-of-type(2) li:nth-of-type(4), .order_box ul:nth-of-type(2) li, .order_box ul:nth-of-type(3) li:nth-of-type(1), .order_box ul:nth-of-type(3) li:nth-of-type(2){ width: 100%; }
.order_box ul{  border: 0px solid #eeeeee; margin-bottom: 0px;}
.order_box ul li{ border: 2px solid #eeeeee;}


/* 詳細內容 */
.search_order_list_con{ border: 1px solid #cdcdcd; background-color: #f6f8f7; margin-top: 20px;}
.solc_detail_title{ display: none; }
.solc_detail_content{ padding: 15px 0; }
.solc_detail_content li{ display: block; width: 100%; }

.solc_detail_num_con:before, .solc_detail_price_con:before { 
	content: attr(data-title) " : "; 
	padding-right: 5px; color: #45484b; font-size: 14px; font-weight: normal;}

.solc_detail_name_con a{ display: block;  }
.solc_detail_name_con span{ font-size: 12px; }

/* 我的訊息 */
.mcml_con {
    width: 100%;
    display: inline-block;
    vertical-align: middle;
    margin-left: 0%;
    border: solid 1px #BFBFBF;
    border-radius: 3px;
}
.mcml_con_pic {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    margin: 0px;
}
.mcml_con_text{ padding-left: 25px; width: 100%;}
.mcml_collection .special_list_act_imgbox{ background-color: transparent;position: absolute;
    top: 4%;
    left: 2%;
  }
  .envelope_open {
    position: absolute;
    top: 0%;
    right: 0%;}

.scpi_list_last .scl_fre:nth-child(1){ float: none; margin-bottom: 10px; display: block; position: static; width: 100%;}
.scpi_list_last .scl_fre:nth-child(2){ width: 100%; display: flex;  }
.scpi_list_last .scl_fre:nth-child(2) input{flex: 1; height: 37px; }
.scpi_list_last .scl_fre:nth-child(2) input::placeholder {font-size: 12px;}
.scpi_list_last .scl_fre:nth-child(2) .btn_basic{width: 124px; margin-right: 0;}
    
    .p_ccic_num div, .p_ccic_eye div{  font-size: 12px; }
    .p_ccic_num span, .p_ccic_eye span{  font-size: 12px;}
    .p_ccic_num div, .p_ccic_eye div{ line-height: 40px;}
    .shop_cart_points_info li.scpi_list{width: 100%; }
.info_list_con input{ width: 100%; }
}

/*=============================Ru edit ↑=============================*/

/* just for 1201 up 購物車 =================*/
@media only screen and (min-width: 1201px) {
	.p_ccic_close{ cursor: pointer; }
	.p_commodity_con_info_conbox{ display: block; }
	.special_list_act_imgbox .special_list_act_img, .p_ccic_close{ display: none; }
	.pc_show.special_list_act_imgbox .special_list_act_img, .p_ccic_close.pc_show{ display: block; }

	.commodity_con_info_title, .p_commodity_con_info_conbox{ font-size: 0; width: 93%; margin:0 auto;}
	.commodity_con_info_title li {    margin:0; text-align: left; padding-left:20px;}
	.commodity_con_info_title:after{ width: 100%; }
	.commodity_con_info_pic{width: 16%;}
	.commodity_con_info_name{ width: 47.5%;}
	.commodity_con_info_price{ width: 12%; }
	.commodity_con_info_addcollect{ width: 12%; }

	.p_commodity_con_info_con{ font-size: 0; padding-top: 15px; }
	.p_commodity_con_info_con:hover {    background-color: #f0f3f2;}
	.p_ccic_pic{ display: inline-block; width: 16%;font-size: 16px;     vertical-align: top; }
	.p_ccic_pic img{vertical-align: middle;}
	.p_ccic_text{display: inline-block; width: 84%;font-size:16px;  }
	.p_ccic_text div{ vertical-align: top; }
	.p_ccic_close.pc_show{ display: inline-block; margin-right:40px; }

	.commodity_con_info_title li, .p_ccic_text div{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
	.p_ccic_text div{ font-size: 0; }
	.colspan{ display: inline-block;width: 71%;}
	.p_ccic_text_name{ margin-bottom: 15px;	}
	.p_ccic_text_num{ }
	.p_ccic_text_price{display: inline-block; text-align: center; color: #851b24;}
	.p_ccic_text_price span{padding:0 10px;}



	.p_ccic_text .p_ccic_text_price{ font-size: 16px; }
	.special_list_act_imgbox.pc_show{display: inline-block; text-align: center;}
	.p_ccic_line {
    width: 90%;
    height: 1px;
    background-color: #E0E5E8;
    display: block;
    margin: 0 auto 25px;}
    .p_ccic_text_price, .special_list_act_imgbox{ width: 12%; }
    div.special_list_act_imgbox{ width: 9%; }
    .p_ccic_text .p_ccic_text_name,  .p_ccic_text span{ font-size: 16px; }

    .p_ccic_text .special_list_act_imgbox .special_list_act_img{ margin: 0 auto; }



    .method_detail2_con_ul li.method_detail2_con_list{ width: 100%; }
    .method_detail2_con_ul li.method_detail2_con_list .method_detail2_con_div1{width: 8%;}
    .method_detail2_con_ul li.method_detail2_con_list .method_detail2_con_div2{    width: 82%;}
    .shop_cart_btn ul li button{ min-width: 200px; }
	

	.lastconfirm_wrap{border: solid 1px #b8bfc3; display: flex; margin-bottom: 50px;}
	.lastconfirm_wrap .lastconfirm_order_con{border:0; padding: 25px 50px; margin-bottom: 0;}
	.lastconfirm_wrap .lastconfirm_box{ flex: 1; }
	.lastconfirm_wrap .lastconfirm_box:last-of-type{ border-left: 1px solid #b8bfc3; }

    .p_ccic_eye{ display: inline-block; width: 77%; float: left; }
    .p_ccic_num{display: inline-block; margin-top: -36px; float: right;}
    .p_ccic_num div, .p_ccic_eye div{ line-height: 28px; color: #959595; font-size: 16px; }
    .p_ccic_num span, .p_ccic_eye span{ color:#5f727f ; padding:0 10px; font-size: 16px;}
    .p_ccic_num div input{ width: 40px; min-height: 28px; margin-bottom: 4px; text-align: center;}
    .shop_cart_points_info li.scpi_list_last input{margin: 0% 10px;}

    .scpi_list_last div { display: inline;  vertical-align: middle;}

}

/* .just for 1201 up 購物車 =================*/

.li_3_pic{
    padding-bottom: 100%;
    background-color: #e2e2e2;
    background-repeat: no-repeat;
     background-size: cover;
     background-position: center!important;
}


.ul_9 {
/*    margin-left: -1.7%;
    margin-right: -1.7%;
        width: calc( 100% + 2.6%);*/
        font-size: 0;
}

@media screen and (max-width: 1200px) and (min-width: 750px){
.ul_9 {
    text-align: center;
/*     margin-left: -2.4%;
    width: calc( 100% + 4.7%);*/
}
}

@media screen and (max-width: 749px) {
.ul_9 {
/*
     margin-left: 1.5%;
    margin-right: 0%;
    width: calc( 100% - 3% );*/
    font-size: 0;
}
}


.news_class_ul {
    margin: 0 0 30px 0px;
}


/* ====Modul==== ...*/
/* 行數 */


.ellipsis-effect{
 line-height: 24px; /* h */
  overflow: hidden;
}

.ellipsis-effect .text { 
  float: right;
  margin-left: -5px;
  width: 100%;
}

.ellipsis-effect::before {
  float: left;
  width: 5px; /* 與 .wrap .text 屬性 margin-left 一樣  */
  content: '';
}
.ellipsis-effect::after{
  float: right;
  content: "...";
  height: 24px;
  line-height: 17px;
  padding-right: 5px;
  text-align: right;
  width: 2em;  /* 为三个省略号的宽度 */
  margin-left: -2em; /* 使盒子不占位置 */
  position: relative; /* 移动省略号位置 */
  left: 100%;
  top: -24px;
  padding-right: 5px;

  /* 显示更好的效果 */
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(white), color-stop(50%, white));
  background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
  background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
  background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
  background: linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);

    /* 重要 讓...不要失效 */
    -moz-box-sizing:content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;

}

/* 1行 */
.ellipsis-effect, .ellipsis-effect::before {
  height: 24px; /* 目前為兩行 h x 2 */
  
}

/* 2行 */
.ellipsis-effect.rows2, .ellipsis-effect.rows2::before  {
  height: 48px; /* 目前為兩行 h x 2 */
  
}

/* 3行 */
.ellipsis-effect.rows3, .ellipsis-effect.rows3::before {
  height: 72px; /* 目前為兩行 h x 2 */
}

/* 4行 */
.ellipsis-effect.rows4, .ellipsis-effect.rows4::before {
  height: 96px; /* 目前為兩行 h x 2 */
}

/* 5行 */
.ellipsis-effect.rows5, .ellipsis-effect.rows5::before {
  height: 120px; /* 目前為兩行 h x 2 */
}

/* 6行 */
.ellipsis-effect.rows6, .ellipsis-effect.rows6::before {
  height: 144px; /* 目前為兩行 h x 2 */
}

/* 7行 */
.ellipsis-effect.rows7, .ellipsis-effect.rows7::before {
  height: 168px; /* 目前為兩行 h x 2 */
}


.index_product_con_list .ellipsis-effect .text{ line-height: 1.38;}
/* 1行 */
.index_product_con_list .ellipsis-effect, .index_product_con_list .ellipsis-effect::before {
  height: calc(18px * 1.38); /* 目前為兩行 h x 1 */  
}
/* 2行 */
.index_product_con_list .ellipsis-effect.rows2, .index_product_con_list .ellipsis-effect.rows2::before  {
  height: calc(18px * 1.38 * 2); /* 目前為兩行 h x 2 */
  
}
/* 3行 */
.index_product_con_list .ellipsis-effect.rows3, .index_product_con_list .ellipsis-effect.rows3::before  {
   height: calc(18px * 1.38 * 3);  /* 目前為兩行 h x 3 */
  
}
/* 4行 */
.index_product_con_list .ellipsis-effect.rows4, .index_product_con_list .ellipsis-effect.rows4::before  {
   height: calc(18px * 1.38 * 4); /* 目前為兩行 h x 4 */
  
}

@media screen and (max-width: 1200px) {
    /* 1行 */
    .index_product_con_list .ellipsis-effect, .index_product_con_list .ellipsis-effect::before {
      height: calc(13px * 1.38); /* 目前為兩行 h x 1 */  
    }
    /* 2行 */
    .index_product_con_list .ellipsis-effect.rows2,.index_product_con_list .ellipsis-effect.rows2::before  {
      height: calc(13px * 1.38 * 2); /* 目前為兩行 h x 2 */
      
    }
    /* 3行 */
    .index_product_con_list .ellipsis-effect.rows3, .index_product_con_list .ellipsis-effect.rows3::before  {
       height: calc(13px * 1.38 * 3);  /* 目前為兩行 h x 3 */
      
    }
    /* 4行 */
    .index_product_con_list .ellipsis-effect.rows4, .index_product_con_list .ellipsis-effect.rows4::before  {
       height: calc(13px * 1.38 * 4); /* 目前為兩行 h x 4 */
      
    }
}


#storehold_main .li_3_title::after{height: 30px;}

/*
.my_collection_message_ul, .my_collection_product_con , .my_collection_news_box .ul_9, .my_collection_good_box .ul_9, .member_center_special_box  .ul_9,
 .member_center_special_box .ul_9, .member_center_coupon_box  .ul_9, .member_brand_offer_box .ul_9, .member_center_feedback_box  .ul_9, .member_center_active_box  .ul_9{
    padding: 0 0 0 1.5%;
}
*/
.mcml_con {
    width: 100%;
    margin-left: 0%; 
}


.mcmdb_con_text {
    padding-left: 1.5%;
}
.mcml_con_text {
    height: auto;
    min-height: 180px;
    overflow: inherit;
}
.mcml_con_pic{ width: 200px;  padding-bottom: 200px;}

.product_main .li_3_title{ font-size: 16px; }


@media screen and (max-width: 749px) {
    .mcml_con_pic {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    }
    .mcml_collection {
        width: 2.5%;
        display: inline-block;
        vertical-align: middle;
    }
     .mcml_con {
        width:100%;
        margin-left: 0px;
    }
    .mcml_collection .special_list_act_imgbox {
        margin-left: 0;
        width: 30px;
        height: 30px;
        border-radius: 99em;
        position: absolute;
        top: 6%;
        left: 6%;
        background: #FFF;
        z-index: 5000;
    }
    .mcml_con_pic{margin:0}
    .envelope_open {    top: 0%; }
}


.mcpc_title_box .mcpc_title_name , .mcpc_con_name{
    width: 48%;
}

.storehold_list_text_class{min-height: 32px;}


#menu-toggle{
    background: url('../images/humber_menu.png') 50% 50% no-repeat;
    width: 24px;
    height: 36px;
    display: inline-block;
    position: absolute;
    top:13px;
    right:10px;
    background-size: contain;
    cursor: pointer;
}


.menu-toggle #menu-toggle{
    background-image: url('../images/index_close.png');
    background-size: 80%;
    top:13px;
    
}
.menu-toggle .ic_shop, .menu-toggle  .ic_member, .menu-toggle  .ic_search{ display: none; }

.header_box_phone .ic_shop, .header_box_phone  .ic_member , .header_box_phone  .ic_search{
    display: inline-block;
    width: 24px;
    height: 36px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top:13px;
}

.header_box_phone  .ic_shop{ background-image: url('../images/hum_menu3-w.png'); right:51px;}
.header_box_phone  .ic_member{ background-image: url('../images/hum_menu2-w.png'); right: 91px;}
.header_box_phone  .ic_search{ background-image: url('../images/hum_menu-search-w.png'); right: 91px; z-index: 3;}

.header_box_phone.search-toggle .ic_search{background-image: url('../images/hum_menu-search-close.png'); right: 89px; z-index: 3;}

.guess_list_pic{
     background-position: center!important; 
}


/* ====Modul==== switch */

.member_center_try_box .form-switch{
    position: absolute;
    top: 44px;
    right: 0;
}
.try_good_product_list{ position: relative; }

.form-switch{ 
    font-size: 1.5rem; 
    color: #221e1f;  
    display: inline;
}
.form-switch:after{content: ''; display: block; clear: both;}
/*.form-switch .text{ float: left; margin-left: 8px;  }*/

.onoffswitch {
    position: relative; 
    width: 58px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;

}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    border-radius:30px;
    padding-right:0px; 
}
.side_box .item .onoffswitch-label{ padding:0;}
.selectAll .onoffswitch-label{ width:100%; display:block;}

.onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
  
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
    font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    box-sizing: border-box;
    text-align: left;
}
.onoffswitch-inner:before {
    content: " ";/* 是 */
    padding-right: 10px;
    padding-left: 10px;
    background-color: #851b24; color: #FFFFFF;border: 1px solid #851b24;
   font-family: Arial, Helvetica,"微軟正黑體", Microsoft JhengHei, sans-serif;
}
.onoffswitch-inner:after {
    content: " "; /* 否 */
    padding-right: 10px;
    background-color: #c9c9c9; color: #FFFFFF; border: 1px solid #cbcbcb;
    text-align: right;
   font-family: Arial, Helvetica,"微軟正黑體", Microsoft JhengHei, sans-serif;
}
.onoffswitch-switch {
    display: block; width: 22px; height: 22px; 
    background: #fff;
    position: absolute; top: 0; bottom: 0;
    right: 24px;
     border-radius: 22px;
    transition: all 0.3s ease-in 0s; 
    margin: 4px;
  
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px; 
    background-color: #fff;
}


.index_product_con_list .list_pic{ 
    background-position: center!important; 
    background-size: cover!important;
    background-repeat: no-repeat!important;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}


.index_product_con_list .list_pic .pro-img, 
.index_product_con_list .list_pic .pro-img img,
.index_product_con_list:hover .p_pic_hover{
     border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.index_product_con_list .list_pic img.product-PC, .product-PC{display: block;}
.index_product_con_list .list_pic img.product-M, .product-M{display: none;}


.li_3 .list_pic{padding-bottom: 70%;}

.index_product_con_list .list_pic .pro-img,
.li_3 .list_pic  .pro-img{
   overflow: hidden; 
}
.index_product_con_list .list_pic img,
.li_3 .list_pic img{
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    object-fit: cover;
    height: 100%;
    transform: translate(-50%, -50%);
    object-position: center;
}

@media (max-width: 1200px){
    .li_3 .list_pic{padding-bottom: 100%;}
    .index_product_con_list .list_pic img.product-PC, .product-PC{display: none;}
    .index_product_con_list .list_pic img.product-M, .product-M{display: block;}

    .member_center_active_main .li_3 .list_pic,
    .member_center_feedback_main .li_3 .list_pic{padding-bottom: 70%;}

}


/* 控制iframe RWD */
.rwd_iframe{ position: relative; padding-bottom: 56.25%; width: 100%; overflow: hidden; height: 0; }
.rwd_iframe iframe{ position: absolute; top: 0;   left: 0;    width: 100%;    height: 100%;}


.product_classification_box ul {    width: calc(100% - 90px);}





/* 修改banner 高度 */

.banner_fixed .banner_fixed_pic .item_img {    padding-bottom: 25%;}
.page_title_box {    padding-bottom: 115px; background-position: 50% 100%;}
.page_title{    margin-top: 26px;}
.page_title_bread_ul{ margin-top: 35px; }
.header_box_down .nav {
    margin-left: 196px;

}

/* 修改footer item 寬度 */
.box_up_right_list, .box_up_right_list:last-child{ width: 20%; }

/* 產品價格 平均分寬 */
.product_detail_text_price{ display: flex; }
.normal_price{ flex: 2; }
.friend_price{ flex: 3; }


/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand { display: none; }


@media only screen and (max-width: 1200px) {
.left_eye select{width: 90%;}
}

/* 產品詳細介紹 default reset */
.product_detail_text_con table, .product_detail_text_con td, .product_detail_text_con th{
    vertical-align: top;
}

.product_detail_text_con table{   
width: 100%;

    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    -webkit-border-horizontal-spacing: 0px;
    -webkit-border-vertical-spacing: 0px;

    display: table;
    
    border-spacing: 2px;
    border-color: grey;
    
 }

 .product_detail_text_con td, 
 .product_detail_text_con th{   


    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
}

 .product_detail_text_con td:first-of-type, 
 .product_detail_text_con th:first-of-type{   

    width:20%;
    min-width:20%;
    max-width:20%;
    white-space: nowrap;
    padding-right:10px;
    }




.index_product_box .filter_box{ width: 97%; margin-left: auto; margin-right: auto;  margin-bottom: 0; }
.product_detail_text_con table{ width: 100%; }






/* 增加Badge Icon*/
.badge_add{}
.badge_add .num{
    width: 20px;
    height: 20px;
    background-color: #f8736d;
    border-radius: 100%;
    position: absolute;
    top: -6px;
    right: -9px;
    color: #FFF;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    line-height: 20px;
    margin-left: -12px;
}

.ic_phone{ display: inline-block; width: 22px; height: 22px; background: url('../images/ic_phone.png') 0 0 no-repeat; background-size: cover; margin-right: 8px; vertical-align: middle;}


/* 客製化wording樣式 */
.costomized_wording_824 h5, p{font-weight: normal; font-size: 16px;line-height: 1.4;}
.costomized_wording_824 h5{ color: #851b24;  padding:0 0 5px 0; }
.costomized_wording_824 p{color: #000002; padding:0 0 12px 0;}


/* 調整phone_menu上下距離 */
.header_phone_first {
    padding:7px 0 15px 0;
    
}
.header_phone_list {
    margin-bottom: 30px;}


/* 對齊購物車input+btn 高度 */
.shop_cart_points_info li.scpi_list_last input, .scl_fre .btn_basic, .shop_cart_points_info li.scpi_list_last div input, .scpi_list_last .scl_fre:nth-child(2) input{height:39px; box-sizing: border-box;}


/* 更改banner */


.banner_fixed .banner_fixed_pic .item_img {
    padding-bottom: 25.62%;
    background-size: cover;
}

.header_box_down .nav_ul .nav_list {
    padding: 13px 20px;
}


/* 修改入徑高度 */
.page_title_tw{ font-size: 26px; line-height: 24px;     margin-bottom: 10px;}
.page_title_en{ font-size: 16px; line-height: 14px; }


.shop_delivery_method_con{ display: flex; justify-content: center;flex-wrap: wrap; }


/* 修改 shipping 項數 */
.shop_delivery_method_con .method_con_merchandise, .shop_delivery_method_con .method_con_home{
    display: inline-block;
    vertical-align: top;
    border-radius: 20px;
    padding: 20px 20px;
    margin:15px;
   width: 290px;   

}
.shop_delivery_method_con .method_con_merchandise a, .shop_delivery_method_con .method_con_home a{
    height: 380px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

@media screen and (max-width: 1200px){
   .shop_delivery_method_con{flex-direction: column; justify-content: center;}
.shop_delivery_method_con .method_con_merchandise, .shop_delivery_method_con .method_con_home{  width: 40%; align-self: center; }
.shop_delivery_method_con .method_con_merchandise a, .shop_delivery_method_con .method_con_home a{height: auto;}
.shop_delivery_method_con a > div{padding:0; margin:0;}
.shop_delivery_method_con .merchandise_pic, .shop_delivery_method_con .home_pic{padding-bottom: 10px;}
.shop_delivery_method_con .merchandise_text, .shop_delivery_method_con .home_text{ width: 100%; }
 

}


.shop_delivery_method_con .merchandise_text{ line-height: 1.3; }
.shop_delivery_method_con  .exp{ color: rgba(255,255,255,.8); font-size: 1rem;}


.special-btn-box{ border-radius: 70px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); display: inline-flex; justify-content: space-between; align-items: stretch; height: 70px; margin:0 auto}
.special-btn-box .wording{ white-space: nowrap; line-height: 70px; padding: 0 25px; font-size: 18px; color: #2c2c2c}
.special-btn-box .btn_basic{ border-radius: 0px; border-top-right-radius: 70px; border-bottom-right-radius: 70px;  padding: 0 25px;background-color: #851b24;    color: #FFF; font-size: 18px;}

.special-btn-box:hover, .special-btn-box:focus{ opacity: 0.8; }
.ic_success_cyan{background: url('../images/icon_success_cyan.png') 0 0 no-repeat; width: 25px; height: 25px; background-size: cover; display: inline-block; vertical-align: middle; margin-right: 15px;
}
.register_box .btn_box {
    text-align: center;
    padding: 60px 0 0px 0;
}

.addchoise{ color: #929ba4; text-indent: -20px;padding-left: 20px; margin-bottom: 10px;}
.addchoise label{ display: block; color: #000; }


/*===================================*/
/*========= 信用卡交易及綁卡 ========*/
/*===================================*/


/* 信用卡管理 */

.creditcard-list{
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
}
.creditcard-list .item{
    background: url('../images/creditcard-bg.png') 0 0 no-repeat;
    width: 300px;
    height: 190px;
    margin-right: 20px;
    margin-bottom: 20px;
    position: relative;
}

.creditcard-list .add{
     background: url('../images/creditcard-add.png') 0 0 no-repeat;
    width: 300px;
    height: 190px;


}
.creditcard-list .add:after{
    content: attr(data-title);
    display: block;
    color: #c0c0c0;
    font-size: 18px;
    text-align: center;
    padding-top: 110px;
    padding-right: 10px;
    padding-left: 10px;
}

.creditcard-list .add:only-child{ align-self: center; margin-right: 0px;    margin-bottom: 0px;}

.creditcard-list .add:hover, .creditcard-list .add:focus{
    background-color: #ededed;
    border-radius: 10px;
    cursor: pointer;
}

.creditcard-list .item ul{margin:86px 20px 0;}
.creditcard-list .item li{ color: #fff; font-size: 16px; }
.creditcard-list .item li:before{
    content: attr(data-title);
    display: block;
    color: #eff2f1;
    font-size: 11px;
    margin-bottom:5px;

}


.creditcard-list .item li.maskepan{ font-size: 20px; font-weight: bold; color: #fff; clear: both;  margin-bottom: 35px; letter-spacing: 2px;}
.creditcard-list .item li.maskepan span{padding-right: 15px;}
.creditcard-list .item li.maskepan span:last-of-type{ padding-right: 0; }
.creditcard-list .item li.issuername{ float: left;  width: calc(100% - 55px);}
.creditcard-list .item li.expirydate{ float: right; width: 55px; letter-spacing: 2px;}
.creditcard-list .item li.del{
    background: url('../images/index_close.png') 0 0 no-repeat;
    width: 18px;
    height: 18px;
    background-size: cover;
    display: inline-block;
    position: absolute;
    top: 10px;
    right: 10px;
}
.creditcard-list .item li.del:hover, .creditcard-list .item li.del:focus{ opacity: 0.8; cursor: pointer;}

/* 信用卡付款-交易密碼 */
.binding_credit_card_password{ width: 600px;  margin:0 auto;width: 600px;    max-width: calc(100% - 4%);
    padding: 0 2%;}

.field-tb li{
    width: 100%;
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
}
.field-tb li .title{
     width: 18%;
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    line-height: 16px;
    font-weight: bold;
    color: rgb(7, 32, 42);
    text-align: left;
    padding: 10px 0;
}
.field-tb li .cont{
    width: calc(100% - 18%);
}
.field-tb li .code{ display: flex; }
.field-tb li input{ margin-right: 5px; flex: 1; width: 40px; text-align: center; }
.field-tb li select{ width: 100%; }

@media only screen and (max-width: 768px) {
    .creditcard-list{flex-direction: column; align-items: center;}
    .creditcard-list .item{ margin-right: 0; order: 2; }
    .creditcard-list .item + .add{
        order: 1; 
        margin-bottom: 20px;
        width: 150px;
        height: 95px;
        background-size: cover;
    }
    .creditcard-list .item + .add:after{
        font-size: 16px;
        padding-top: 50px;
    }
    .field-tb li{ flex-direction: column; }
    .field-tb li .title, .field-tb li .cont{ width: 100%;}

}

.signin_forgot_main .signin_phone_box{
    margin-bottom: 25px;
}

.signin_forgot_main .signin_content_list{
    width: 100%;
}

.signin_forgot_box .signin_phone_box .phone{
    width: 58%;
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 0px;
}

div.laststep_text {
    width: 56%;
    display: inline-flex;
    align-items: flex-start;
}

div.laststep_text ul{
    display: inline-block;
    vertical-align: middle;
    font-size: 18px;
    font-weight: bold;
    color: #ae8f72;
    letter-spacing: 0px;
    margin-left: 10px;
}
div.laststep_text ul li{margin-bottom: 15px;}
div.laststep_text ul li:last-of-type{margin-bottom: 0;}




ul.icon_box li .icon-store-open{
    background: url('../images/b_icon_store.png') 0 0 no-repeat;
    background-size: contain;
    height: 30px;
    width: 30px;
    display: block;
}

ul.icon_box li .icon-store-open .on_2_remind_text{ text-indent: -9999px; }

.product_detail_text_shop ul li .icon-store-open{
    background: url('../images/b_icon_store_gray.png') 0 0 no-repeat;
    background-size: contain;
    height: 18px;
    width: 22px;
}

.header_phone_list div img{width:80px;}


.special_detail_act_list, .special_detail_list_title, .special_detail_act_list{font-size: 18px;}

@media only screen and (max-width: 1200px) {

div.laststep_text {
        float: none;
    width: 100%;
    display: inline-flex;
    align-items: flex-start;
}
div.laststep_text img {
    width: 60px;
}
.index_product_con_list ul.icon_box li .icon-store-open{width: 24px; height: 22px; margin:0 auto;}


.header_phone_list div img,
.phone_first_img ,
.header_phone_list div.phone_list_img{  width: 36px;    }
.phone_list_circle{width: 16px; height: 16px;}

}
    


/* 品牌專區 */
.brand_detail_con{
    display: flex;
    justify-content: stretch;
    flex-wrap: wrap;
}
.brand_detail_con_text{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/****************************
        給html編輯器使用 
****************************/

.html ul{
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 30px;
}

.html  ol {
    display: block;
    list-style-type: decimal;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 30px;
}

.html li {
    display: list-item;
    text-align: -webkit-match-parent;
}

.html table, .html td, .html th {
    border: 1px solid black;

}

.html  td {
    display: table-cell;
    vertical-align: inherit;
}

.html  tr {
    display: table-row;
    vertical-align: inherit;
    border-color: inherit;
}
.html th {
display: table-cell;
    vertical-align: inherit;
    font-weight: bolder;
    text-align: center;

}

.html  thead {
    display: table-header-group;
    vertical-align: middle;
    border-color: inherit;
}

.html tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
}

.html p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

.html  b , .html strong{
    font-weight: bold;
}

.html h1 {
    display: block;
    font-size: 2em;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

.html h2 {
    display: block;
    font-size: 1.5em;
    margin-block-start: 0.83em;
    margin-block-end: 0.83em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

.html h3 {
    display: block;
    font-size: 1.17em;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

.html h4 {
    display: block;
    margin-block-start: 1.33em;
    margin-block-end: 1.33em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}
.html h5 {
    display: block;
    font-size: 0.83em;
    margin-block-start: 1.67em;
    margin-block-end: 1.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}
.html h6 {
    display: block;
    font-size: 0.67em;
    margin-block-start: 2.33em;
    margin-block-end: 2.33em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}



/* 首頁 header */

.header_box_up .wrapper{
    display: flex;
    justify-content: space-between;
}
.header_box_up .wrapper .logo_box{ height: 40px; margin-left: 8px;}
.header_box_up .wrapper .header_box_up_link{ 
    flex: 1 1 auto; 
    display: inline-flex;
    justify-content: flex-end;
    align-items: center;
}
.header_box_up_link li a, .search-box{
    font-size: 18px;
    margin: 0 10px;
    display: inline-block;
}
.header_box_up_link li a:hover, .header_box_up_link li a:focus{
    color: #ae8f72!important;
}
.header_box_up_link li a:hover .icn, .header_box_up_link li a:focus .icn{ 
    background-position: 0 100%;
}

.header_box_up_link li a{position: relative;}
.header_box_up_link li a .num{
    position: absolute;
    top: -10px;
    right: -10px;
    height: 20px;
    border-radius: 20px;
    background-color: #f8736d;
    display: inline-block;
    font-size: 12px;
    line-height: 20px;
    padding:0 3px;
    color: #FFF;
}


.icn{
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    display: inline-block;
}
.icn-message{background-image: url(../images/icn-message.png); background-size: cover;}
.icn-cart{background-image: url(../images/icn-cart.png); background-size: cover;}
.icn-member{background-image: url(../images/icn-people.png); background-size: cover;}
.icn-loved{background-image: url(../images/b_icon_wish_on_35_white.png); background-size: contain; background-position:0 100%;}

.icn-EyeInstitut{background-image: url(../images/icn-EyeInstitute.png); background-size: cover; margin-right:-10px; margin-left: -5px;}
.header_box_up_link li a:hover .icn-loved, .header_box_up_link li a:focus .icn-loved{ 
   background-image: url(../images/b_icon_wish_on_35.png); 
}


.login-text{line-height: 1.5;    vertical-align: bottom; padding-left: 2px;font-weight: 400;}

.search-box input, .header_phone_search_con input{
    background:#333333 url(../images/icn-search.png) 5px 50% no-repeat;
    height: 36px;
    min-height: 36px;
    border-radius: 5px;
    padding-left: 25px;
    color: #fff;
    border:1px solid rgba(255,255,255,0);
    width: 150px;
    
}
.search-box input:focus,  .header_phone_search_con input:focus{outline: none; border:1px solid rgba(255,255,255,.3); }

.header_phone_search_con{

    position: absolute;
    top: 10px;
    bottom: 0;
    left: 8px;
    right: 112px;
    width: auto;
}
.header_phone_search_con input{width: 100%;}



@media (max-width: 1276px){ /* 1200px + 35px + 35px next. prev 寬度*/
.header_box_down .tabcontent .wrapper{
    width: auto;
}
.index_product_box .wrapper{
    width: calc(100% - 35px - 35px); 
}
.wrapper, .footer_box_down .wrapper{
   width: 100%; 
}

}

@media (max-width: 1200px){ /* 1200px + 35px + 35px next. prev 寬度*/

.index_product_box .wrapper{
    width: calc(100% - 16px); 
}
}

/* === swiper === */
:root {
    --swiper-theme-color: rgba(169,134,107);
}
.brand-box .swiper-grid-column{padding-bottom:10px;}
.swiper {
        width: 100%;
        height: 100%;
      }

      .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }

      .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }


.swiper-horizontal>.swiper-pagination-bullets, 
.swiper-pagination-bullets.swiper-pagination-horizontal, 
.swiper-pagination-custom, .swiper-pagination-fraction{
    bottom:-10px;
    padding: 0 0 1% 0;
}
.swiper-pagination{ position: relative; }

.index_banner{ position: relative; }
.index_banner .swiper-pagination{ position:absolute; bottom:0; padding-bottom: 0!important ;}
.index_banner .index-banner{padding-bottom: 26px;}
.index_banner .index-banner .swiper-wrapper{ }




.swiper-pagination-bullet{
    width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,10px));
    height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,10px)); 
    background: var(--swiper-pagination-bullet-inactive-color,rgb(169,134,107)); 
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .5);  
}
.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--swiper-pagination-color,var(--swiper-theme-color)); 
}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, 
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap,5px);
    border: 1px solid #fff;
}

.swiper .swiper-button-prev{
    left: 0;
    background:transparent url('../images/index_product_left.png') no-repeat 0% 50%;
    width: 5%;
    height:100%;
    bottom: 0;
    top: 0;
    margin-top: 0;
}

.swiper .swiper-button-next {
    right: 0;
    background:transparent url('../images/index_product_right.png') no-repeat 100% 50%;
   width: 5%;
    height:100%;
    bottom: 0;
    top: 0;
    margin-top: 0;
}
.swiper .swiper-button-prev:after, .swiper .swiper-button-next:after{ display: none; }

.swiper .swiper-button-prev:before,  .swiper .swiper-button-next:before{
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -30px;
    width: 34px;
    height: 59px;
    left: 0;
}

.swiper .swiper-button-next:before{
    right: 0;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    opacity: 1;
}
.swiper-button-next.swiper-button-disabled:before, .swiper-button-prev.swiper-button-disabled:before {
    opacity: .35;
}


.swiper-next,
.swiper-prev{
    position: absolute;
    top: 50%;
    width: 20px;
    height: 35px;
    margin-top: calc(-35px / 2 );
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color,var(--swiper-theme-color));
    z-index: 2;
}
.swiper-next{
    background:  url(../images/index_product_right.png) no-repeat 100% 50% / 20px;
    right: calc(-20px - 10px);
}

 .swiper-prev{
    background:  url(../images/index_product_left.png) no-repeat 0% 50% / 20px;
    left:calc(-20px - 10px);
}

#brand-item3 + .swiper-next,
#brand-item3 + .swiper-next + .swiper-prev{margin-top: -32px;}

#brand-item4 + .swiper-next,
#brand-item4  + .swiper-next + .swiper-prev,
#brand-item-combo + .swiper-next,
#brand-item-combo + .swiper-next + .swiper-prev{margin-top: calc((-35px / 2) + 5px);}



.index_banner .swiper-next{ right: 20px; margin-top: -20px; top:calc((100% - 26px) / 2)}
.index_banner .swiper-prev{left: 20px; margin-top: -20px;top:calc((100% - 26px) / 2)}

.index_banner .swiper-next,
.index_banner .swiper-prev{display: none;}


/* === 首頁 類別 === */


.header_box_down{
    background: #c3aa97; padding: 0; 
    position: static;
    top: 0px;
    right: 0;
    left: 0;
     z-index: 3;
}

.navSortHeight .header_box_down{ position: fixed;top: 64px;}

@media only screen and (max-width: 1200px) {
    .navSortHeight .header_box_down{ top: 60px;}
}

.sortSwiper .swiper-slide {
        width:auto;
        background-color: transparent;
        color: #fff;
        font-size: 16px;
      }
.sortSwiper .swiper-slide a{
    padding: 13px 10px;
    position: relative;
    font-weight: 300;
}
.sortSwiper .swiper-slide a:hover, .sortSwiper .swiper-slide a:focus, .sortSwiper .swiper-slide a.active{
    color: #851b24!important;
}

.sortSwiper .swiper-slide a:hover:after, .sortSwiper .swiper-slide a:focus:after,.sortSwiper .swiper-slide a.active:after{
    content: '';
    height: 4px;
    background-color: #851b24;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;

}

.sortSwiper .swiper-button-next, .sortSwiper .swiper-button-prev {
    color: #fff;
    background-color: #c3aa97; 
    width: 50px;
}      

.sortSwiper .swiper-wrapper{

 
}
.sortSwiper .swiper-wrapper .swiper-slide:first-of-type{margin-left: 50px;}
.sortSwiper .swiper-wrapper .swiper-slide:last-of-type{margin-right: 70px!important;}

.sortSwiper .swiper-button-prev{left: 0px;}
.sortSwiper .swiper-button-next {    right: 0;}

.sortSwiper .swiper-button-next.swiper-button-disabled, .sortSwiper .swiper-button-prev.swiper-button-disabled {
    opacity: 0.35;
}
.sortSwiper .swiper-button-next.swiper-button-disabled:before, .sortSwiper .swiper-button-prev.swiper-button-disabled:before {
    opacity: 1;
}


.sortSwiper .swiper-button-next{  background:#c3aa97  url(../images/index_product_right-w.png) no-repeat 50% 50% / 10px;}
.sortSwiper .swiper-button-prev{  background:#c3aa97 url(../images/index_product_left-w.png) no-repeat 50% 50% / 10px;}

.header_box_down .tabcontent {
  display: none;

  position: static;
    top: 0px;
    left: 0;
    right: 0;
    background-color: rgba(255,255,255,.8);
}
.header_box_down .tabcontent .wrapper{
    display: flex;
    flex-wrap: wrap;
    padding: 20px 10px;
    
}
.header_box_down .tabcontent .wrapper .tab-item{width: 25%; padding:10px 0;}
.header_box_down .tabcontent .wrapper .tab-item a{font-size: 16px; color:#000;}
.header_box_down .tabcontent .wrapper .tab-item a:hover{ color:#ae8f72!important;}

.toggle-more{width: 100%; display: flex;flex-wrap: wrap;}
.toggle-more .tab-item, 
.toggle-more .close,
.toggle-more.toggle-close .more{display: none;}

.toggle-more.toggle-close .tab-item, .toggle-more.toggle-close .close{display: block;}

.toggle-more .close,
.toggle-more .more{color:#ae8f72;width: 100%; text-align: center; cursor: pointer;}

.toggle-more{margin-top:30px;}
.toggle-more.toggle-close{margin-top: 0;}

.toggle-more .close:after, .toggle-more .more:after{
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none!important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: initial;
    line-height: 1;
     content: 'prev'; font-size: 16px;display: inline-block;
     margin-left: 5px;

}
.toggle-more .close:after{
   transform:rotate(90deg);
}
.toggle-more .more:after{

   transform:rotate(-90deg);
}


/* === 首頁 品牌專區 === */

.brand-box{
    position: relative;
}



.brand-Swiper .swiper-button-next,
.sixSwiper .swiper-button-next{
    right: -5%;
}

.brand-Swiper .swiper-button-prev,
.sixSwiper .swiper-button-prev{
    left: -5%;
}



.brand-box .swiper-button-disabled,
.index_product_con .swiper-button-disabled{ opacity: 0; }



.index_product_con{position: relative;}

.brand-Swiper .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
}
.brand-Swiper .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
}


.brand-item-box, .brand-item-box a{
    display: flex;
    flex-wrap: wrap;
    width: 100%;

}

.brand-item-box .brand-img{
        background: no-repeat 50% 50% / cover;
        width: 100%;
        position: relative;
        border-radius: 7px;
} 
.brand-item-box .brand-img:before{
        content: '';
        display: block;
        padding-top: 318px;

} 
.brand-item-box .brand-title{
        padding:15px; 
        line-height: 1.38;
        width: 100%;
        height: 48px;
}     

#brand-item4 .swiper-slide,
#brand-item-combo .swiper-slide
{
height: calc((100% - 20px) / 2)!important;
align-items: flex-start;

}



.brand-Swiper .swiper-button-lock {
    display: block;
}

#brand-item4.swiper-grid-column>.swiper-wrapper,
#brand-item-combo.swiper-grid-column>.swiper-wrapper {
    flex-wrap: wrap;
   height:calc(318px * 2 + 20px)!important;
   /* 含圖說 height:calc((318px + 78px) * 2)!important; */
   width: 100%!important;
   margin-top: 0!important;

   
}


@media screen and (min-width: 1201px)  {
#brand-item-combo .swiper-pagination, #brand-item4 .swiper-pagination, .brand-item3 .swiper-pagination{display: none;}

}


/* 首頁 - 熱銷商品 */
.sixSwiper .swiper-slide{display: inline-block;}
.sixSwiper .swiper-slide .index_product_con_list:first-of-type{margin-left: 0;}


.index_product_con_list{
    width: calc(100% - 10px);
    margin:0 5px;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    position: relative;
    border: 1px solid #eee;
    border-radius: 7px;


}



.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #ae8f72;
    opacity: 1;
}
.owl-theme .owl-dots .owl-dot span {

    background: #ae8f72;
    opacity: .5;

}


@media only screen and (max-width: 1200px) {


/* === 首頁 SWIPER=== */

.header_box_down{
    top: 60px;
}

.index_product_con .swiper-next,
.index_product_con .swiper-prev,
.brand-box .swiper-next,
.brand-box .swiper-prev{
    display: none;

}

.brand-item-box .brand-img:before{padding-top: 200px;}
#brand-item4.swiper-grid-column>.swiper-wrapper, 
#brand-item-combo.swiper-grid-column>.swiper-wrapper{
    height: calc(200px  * 2 + 20px)!important;
    /* 含圖說 height:calc((200px + 78px) * 2)!important; */
}

#brand-item1 .brand-item-box .brand-img:before{padding-top: 26.5%;}
#brand-item2 .brand-item-box .brand-img:before{padding-top: 58.98%;}


}


@media only screen and (max-width: 798px) {
    .brand-item-box .brand-img:before{padding-top: 83px;}
    #brand-item4.swiper-grid-column>.swiper-wrapper, 
    #brand-item-combo.swiper-grid-column>.swiper-wrapper{
        height: calc(83px * 2 + 20px)!important;
        /* 含圖說 height:calc((100px + 78px) * 2)!important; */
    }

    .header_box_down .tabcontent .wrapper .tab-item{width: calc(100% / 3);}
}




/* color- 注意 */

.modify_mail span,
.situation_1 p,
.member_center_right_text_con span,
.lightbox_btn_text,
.recommend_remind_list_con span,
.member_center_search_title span,
.special_list_act_descript span,
.shop_cart_points_info li.scpi_list span,
.lastconfirm_total_remind,
.blcon_con span,
.info_up_con_list .lightbox_btn_wrapper_con_title span,
.situation_2 p{
    color: #f8736d;
}

.lightbox_btn,
.mcnc_list .mcnc_list_number{
    background-color: #f8736d;
   

}


/* datepicker */

.ui-widget-header {
        border: 0px solid #aaa; 
        background: none;
}

.ui-datepicker .ui-datepicker-title select{
    font-size: 14px;
    height: 18px;
    padding: 2px 4px;
    line-height: 1;
    min-height: 30px;
}


.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    
    background-image:none;
    background-color: rgba(0,0,0,.05);
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    border: 1px solid #851b24;
    background: rgba(133,27,36,.2) none 50% 50% repeat-x;
    color: #851b24;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active ,
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover {
    border: 1px solid #ae8f72;
    background: rgba(169,134,107,1) none 50% 50% repeat-x;
    color: #fff!important;
}

.accoubt-del_btn{
    text-align: center;
    margin: 60px 0 0px 0;
}
.accoubt-del_btn img{
     margin-right: 5px;
     vertical-align: sub;
}

.accoubt-del_btn > a{
    border: 2px solid #851b24;
    min-width: 120px;
    display: inline-block;
    
    margin-left: auto;
    margin-right: auto;
    padding: 7px 12px 7px 12px;
    font-size: 16px;
    font-weight: bold;
    line-height: 16px;
    letter-spacing: 1px;
    border-radius: 5px;
    color: #851b24!important;
    background-color: #fff;

    transition: ease-in-out 0s;
    -moz-transition: ease-in-out 0s;
    -webkit-transition: ease-in-out 0s;
    -o-transition: ease-in-out 0s;

}

.accoubt-del_btn > a:hover,.accoubt-del_btn > a:focus{
    background-color: #851b24;
    color: #fff!important;
   
}

.accoubt-del_btn > a:before{
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 5px;
    vertical-align: sub;
    background: url('../images/ic_deleteAccount.png') no-repeat 0 0% ;
}

.accoubt-del_btn > a:hover:before, .accoubt-del_btn > a:focus:before{
   background-image: url('../images/ic_deleteAccount_w.png');
}

.accoubt-del_btn .lightbox_btn{box-shadow: 0 0 0 ;}

.delete_account_box_main  .lightbox_btn_wrapper{height: 200px; }
.delete_account_box_main .lightbox_btn_wrapper_con{padding-top: 30px; padding-bottom: 30px;}

@media (max-width: 1200px){ 

    .accoubt-del_btn > a{
        border-radius: 10000px;
    }
}


/* modal new */
.lightbox_btn_wrapper{
    border: solid 5px #851b24;
    border-top-left-radius: 0px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
   
}

@media only screen and (min-width: 1201px){
    .scpi_list_last .lightbox_btn_wrapper_con{ display: block;}
}


.lightbox_btn_close, .coupon_lightbox_btn_close {
    position: absolute;
    top: 5%;
    right: 2%;
    cursor: pointer;
    width: 20px;
}
.lightbox_btn_wrapper_con_con{
    padding:3%;
    font-size: 18px;
    line-height: 1.4;
    letter-spacing: 1px;
    font-weight: bold;
    color: #595757;
}



/* 商品總覽 > 產品內容 - 商品圖 */

.product_item_swiper{ padding-bottom: 30px; }
.product_item_swiper .swiper-pagination{bottom: 30px;}
.product_item_swiper .swiper-pagination {
    position: absolute;
}

.live_section_box .li_3:hover .p_pic_hover,
.live_section_box .li_3:hover ul.icon_box{ display:block;}

@media (max-width: 1200px){
.live_section_box .li_3:hover .p_pic_hover,
.live_section_box .li_3:hover ul.icon_box{ display:none;}

}

@media screen and (min-width: 750px) and (max-width: 1200px){

/*product detail*/
    .product_detail_picbox{
        width: 48%;
        display: inline-block;
        vertical-align: top;
        position: relative;
    }

    .product_detail_text{
        width: 48%;
        display: inline-block;
        vertical-align: top;
        margin-left: 3%;
    }


}    

/* 購物車 - 加購價 */
.cart-add-on-swiper { position: relative; }
.cart-add-on-swiper .swiper{
    margin: 50px; 
    width: calc(100% - 100px);


}
.cart-add-on-swiper .swiper-next{ right: 16px; }
.cart-add-on-swiper .swiper-prev{ left: 16px; }



/* live_section_box 直播 */

.full-live-tab .my_collection_class_ul{ display: flex; }
.full-live-tab .my_collection_class_ul > a{ flex: 1; display: inline-flex; }
.full-live-tab .mboc_list_aim{ display: block; }

.full-live-tab  .mboc_list {
    vertical-align: middle;
    margin-right: 0px!important;
    font-size: 16px;
    line-height: 16px;
    padding: 12px 18px;
    letter-spacing: 1px;
    border: solid 1px #ae8f72;
    color: #ae8f72;
    display: block; 
    text-align: center;
    width: 100%!important;
    border-left-width:  0;

}

.full-live-tab .mboc_list_aim{
    color: #fff;
    border: solid 1px #ae8f72;
    border-left: 0;
    background-color: #ae8f72;
    border-radius: 0px;
    
}

.full-live-tab .my_collection_class_ul > a:first-of-type .mboc_list{ border-top-left-radius: 30px; border-bottom-left-radius: 30px;border-left-width: 1px;}
.full-live-tab .my_collection_class_ul > a:last-of-type .mboc_list{ border-top-right-radius: 30px; border-bottom-right-radius: 30px; }



.live_section_box{}
.live_section_box .li_3{
    margin-bottom:20px;
    width: calc(100% / 2 - 2%);

    display: inline-flex;
    align-items: start;
}

.tag-time{
    padding:5px 5px;
    color: #fff;
    font-size: 14px;
    border-radius: 5px;
    position: absolute;
    left: 15px;
    top: 15px;

}
.tag-time-red{ background-color: #fe0000; }
.tag-time-yellow{ background-color: #ff7f00; }
.tag-time-green{ background-color: #009900; }



.live_section_box .li_3_pic{
   padding-bottom:72.68%; 
    width: 100%;
    border-radius: 5px;
}
.live_section_box .li_3 a{flex:1; padding:15px 0 15px 15px;}
.live_section_box .li_3_text{flex:2;}



.live_section_box .phone_p_pic_hover{
  width: 100%;
  display: block;
}

.live_section_box .phone_p_pic_hover ul{
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.live_section_box .phone_p_pic_hover ul li{
  width: 42%;
  display: inline-block;
  vertical-align: middle;
  margin: 0 2%;
  padding: 4px 0;
  border-radius: 1000px;
  cursor: pointer;
}

.live_section_box .phone_p_pic_hover ul li.bg_3AD0D1{
  background-color: #851b24;
}

.live_section_box .phone_p_pic_hover ul li.bg_7C868E{
  background-color: #7C868E;
}

.phone_p_pic_hover ul li .icon-store-open{
   display: block;
    background-image: url(../images/b_icon_store.png);
    background-repeat: no-repeat;
    background-size: contain !important;
    width: 24px;
    height: 22px;
    text-align: center;
    margin: 0 auto;
}


.live_section_box .phone_p_pic_hover{margin-top:10px;}
.live_section_box ul.icon_box{top:34%;}

.ic-live, .ic-link{
    display:inline-block;
    width: 24px;
    height: 24px;
    
    background-size:cover;
    background-position:center;
    background-repeat: no-repeat;
}


.golive_box .badge_add .num {

    right: -4px;}



.ic-live{
    background-image:url('../images/ic_live@2x.png');
 }   
.ic-link{
    background-image:url('../images/ic_btn-link-w@2x.png')
}

@media (max-width: 1200px){
    .live_section_box .li_3{
        margin-bottom:20px;
        width: calc(100% / 2 - 4%);
    }
    .live_section_box .li_3 a{flex:1;}
    .live_section_box .li_3_text{flex:2;}

  


}

@media (max-width: 767px){
    .live_section_box .li_3{
        margin-bottom:20px;
        width: calc(100% - 4%);
    }
    .live_section_box .li_3 a{padding:10px 0 10px 10px}
    .live_section_box .li_3_text{ }
    .live_section_box .li_3_pic {  }
   .tag-time{left: 10px; top: 10px;}

}


/* 帳號刪除 */

.delete_account_box_main .member_center_personal_form{
    text-align: left;
}
.delete_account_box_main .signin_btnbox{ text-align: center;      }
.lightbox_btn{box-shadow: 0 0 0px 0px rgb(0 0 0 / 0%);margin-top: 40px;}
.delete_account_box_main .code{height:auto;}

.delete_account_box_main .note_box{
    background-color: rgba(255,51,74,.08);
    color: rgb(255,51,74);
    font-size: 18px;
    line-height: 1.7;
    letter-spacing: 1px;
    display: block;
    padding: 20px 30px;
    margin-bottom: 20px;
}


.btn-box{ text-align: center;}

.delete_account_box_main .btn-box{  margin-top: 40px;}
.delete_account_box_main .btn-box .btn_basic{min-width: 200px;}
.delete_account_box_main .btn-box .btn_cyan{}



/* status-box */
.status-box{
    text-align: center;
}
.status-box .status-kv{
    width: 200px;
    text-align: center;
    margin: 0 auto 15px;

}

.status-box .status-wording{
    font-size: 35px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 1.4;
    color: rgb(68,68,68);
    margin-bottom: 30px;
}
@media (max-width: 1200px){
        .status-box .status-kv{    width:100px;}
        .status-box .status-wording{ font-size: 22px; }

}

.modal_warm img{}
.modal_warm .stitle{color:#ff334a; font-size: 28px; font-weight: bold; margin:10px 0;}
.member_center_personal_main .accoubt-del_btn .lightbox_btn_wrapper {
    height:auto;
    bottom: auto;
}

@media (max-width: 767px){
    .modal_warm img{ width: 74px; }
    .modal_warm .stitle{ font-size:24px;}
}




/*產品圖大小修改 */
.index_product_con_list .list_pic,
.product_main .list_pic,
.my_collection_good_main  .list_pic,
.member_brand_offer_main .list_pic{
    padding-bottom: 100%;
}

.news_main .li_3_pic,
.storehold_main  .list_pic,
.product_main_combo .list_pic,
.my_collection_news_main  .li_3_pic{
    padding-bottom: 70%;
}

.storehold_main  .li_3 {
    width: calc( 100% / 4 - 2%);
}


.index_product_con_list ul.icon_box:before,
.product_main ul.icon_box:before {
    padding-top: calc(50% - 15px);
}

.pay_lastconfirm_main .cart_con_list1 img{max-width: 80px;    max-height:  80px; height: 80px;}

@media (max-width: 1200px){
    .storehold_main .list_pic,
    .member_center_special_main  .list_pic,
    .member_center_coupon_main  .list_pic,
    .member_center_mycoupon_main  .list_pic,
    .my_collection_news_main  .li_3_pic{
        padding-bottom: 75%;
    }

    .pay_lastconfirm_main .cart_con_list1 img{max-height:  initial; height: initial; height: auto;  }
    .pay_lastconfirm_main .cart_con_list1 .coupon-empty-img{ width: 80px; padding-top: 80px;}
    .storehold_main  .li_3 {
        width: calc( 100% / 2 - 4%);
    }
    .index_product_con_list ul.icon_box:before, .product_main ul.icon_box:before {
        padding-top: 0;
    }
    .index_product_con_list .list_title{  margin-bottom: 5px;}


}


.storehold_main .li_3_title{ font-size: 20px; }



/* 選擇取貨門市 */
.shop_storePickup_box{
    min-height: 610px;
}
.storehold_class{margin-bottom: 20px;}

.shop_storePickup_box .title{
    width: 100%;
    font-size: 30px;
    font-weight: bold;
    color: rgb(60, 57, 80);
    line-height: 1.4;
    margin-bottom: 10px;
}


.storePickup_list{ margin-left:-10px; margin-right: -10px;display:flex; flex-wrap: wrap;}
.storePickup_list .li_3{
    
    width: calc(100% / 2 - 20px);

    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 10px 20px;
    padding: 15px;

    position: relative
}

.storePickup_list .li_3:hover .p_pic_hover,
.storePickup_list .li_3:focus .p_pic_hover{
   position: absolute;
   top: 0; right: 0; left: 0;bottom: 0;
   display: block;
}


.storePickup_list .li_3 .cont{  }
.storePickup_list .li_3 .cont .name{ font-size: 20px; line-height: 1.2; font-weight: 500; }
.storePickup_list .li_3 .cont .li_3_con{}
.storePickup_list .li_3 .btn-box{margin-left: 15px; position: relative;}
.storePickup_list .li_3 .btn-box .btn_basic{
    color: #fff!important;
    border-radius: 16px;
    height: 32px;
    line-height: 32px;
    padding: 0 15px;
}
.storePickup_list .li_3 .btn-box .btn_basic:hover,
.storePickup_list .li_3 .btn-box .btn_basic:focus{
     color: #851b24!important;
}
@media screen and (max-width: 1199px) {    
    .shop_storePickup_box{  min-height: 850px;    }
    .storePickup_list .li_3{  display: block;} 
    .storePickup_list .li_3 .btn-box{margin:10px 0 0 0;} 
}
@media screen and (max-width: 1024px) {    
    .shop_storePickup_box{  min-height: 1140px;    }
    
}
@media screen and (max-width: 820px) {    
    .shop_storePickup_box{  min-height: 950px;    }
}
@media screen and (max-width: 768px) {    
    .shop_storePickup_box{  min-height: 800px;    }
    .storePickup_list .li_3{ width: calc(100%  - 20px) ; } 
}
@media screen and (max-width: 480px) {    
    .shop_storePickup_box{  min-height: 640px;    }
}
@media screen and (max-width: 375px) {
    .shop_storePickup_box{       min-height: 400px;}
    .storePickup_list{margin:0;}
    .storePickup_list .li_3{
        width:  calc(100%  - 20px);
    }
}

/* shop_delivery_method_detail.php */
.method_detail_info_list.editView{ display: flex ;justify-content: space-between;}
.method_detail_info_list .info_list_con .ps{
    margin: 5px;
    display: inline-block;
    color: rgb(168, 168, 168);
}
.method_detail_info_list.editView .info_list_con {
    padding: 22px 4.5%;
    width: calc(100% - 24%);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;

}

.method_detail_info_list.editView .info_list_con.edit-field {
padding: 11px 4.5%;
position: relative;

}

.method_detail_info_list.editView .info_list_con .btn-box {
    float: right;
    position: absolute;
    right: 10px;
}
.method_detail_info_list.editView .info_list_con .btn-box .btn_basic {
    color: #fff!important;
    border-radius: 16px;
    height: 32px;
    line-height: 32px;
    padding: 0 15px;
}
.method_detail_info_list.editView .info_list_con .btn-box .btn_basic:hover,
.method_detail_info_list.editView .info_list_con .btn-box .btn_basic:focus{
     color: #851b24!important;
}

.method_detail_info_list .info_list_con .ps:has( + .btn-box){padding-right: 120px; margin-left: 0;}

/* 註冊 */
.signature_box{
    margin-bottom: 60px;
    display: flex;
    flex-wrap: wrap
}
.signature_box > p{
    width: 100%;
    font-size: 16px;
    line-height: 16px;
    font-weight: bold;
    color: rgb(95, 114, 127);
    margin-bottom: 15px;
    line-height: 1;
}
.signature-show{
    border: solid 1px #e5eaec;
    border-radius: 4px;
    color: #a7a7ba;
}
 .signature-show{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
 }
.signature-show img{ height: 100%; }
.signature-show .ps{
  position: absolute;
  bottom: 10px;
  left:    10px;
  line-height: 1;
  height: auto;
 }



.signature_box .signature-show{
    height: 80px;
    line-height: 78px;
    padding-left: 2%;  
    flex: 0 61%;

}



.signature_box .btn-box{
    flex: 1;
    margin-left: 10px;
    display: inline-block;
    vertical-align: middle;
   
}
.signature_box .btn-box .btn_basic{ 
    display: block; 
    height: 80px;
    width: 100%;
    margin: 0;
    line-height: 80px; 
    padding: 0;
    color: #fff!important;
}


.signature_box .btn-box .btn_basic:hover,
.signature_box .btn-box .btn_basic:focus{
    color: #851b24!important;
    border-color: #851b24;
    background-color: #fff;
}

.sub-fields{ display: flex; justify-content: space-around; align-items: baseline; }
.sub-fields .title{ 
    font-size: 14px;
    line-height: 14px;
    font-weight: bold;
    color: rgba(95, 114, 127,.7);
    flex: 0 40%;
  
    padding-right: 10px;
    text-align: right
 }
 .sub-fields select{
    flex: 1;
 }
.signin_code_box .sub-fields select.code{font-size: 14px;}
.eye_degree_box{ display: flex; flex-wrap: wrap; }
.eye_degree_box > p{ width: 100% }
.eye_degree_box .box{ flex:1;}
 .plate-box{
    height: 250px;
    margin: 40px 0;
 }
.signature-show.plate-box > canvas{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.agree-section{
   color: rgb(95, 114, 127); 
  
}
.agree-section > p{
    font-weight: bold;
    line-height: 1;

} 

.agree-section .exp{
    margin-bottom: 20px;
    color: #ccc;
  font-weight: normal; 
  font-size: 14px;
}

.agree-section .agree-box{
   border: solid 1px #e5eaed;
   border-radius: 2px;
    padding:15px 15px 15px 10px;
    font-size: 14px;
    margin: 15px 0 30px 0;
    background-color: #f4f5f6;
    max-height: 100px;
    overflow-y: auto;
}
.agree-section .agree-box ul{
    list-style-type: disc;
    padding-left:22px;
    line-height: 1.4;
    color: #b6b6b6;
}
.agree-section .agree-box ul li{margin: 5px 0;}

@media only screen and (max-width: 768px) {
   .sub-fields {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: baseline;
    }
    .eye_degree_box .box{ margin:0 0 0 15px; }
    .agree-section .exp{margin-left: 15px;}
    .sub-fields .title{margin-bottom: 6px;margin-right: 0; }
    
}


/* 優惠券 */
.coupon-modal .lightbox_btn_wrapper{ 

    display: flex;
    justify-content:space-between;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    background-color: #f3f3f3; 
}
.coupon-modal .lightbox_btn_wrapper_con{
    overflow-y: auto;
    margin-top: 50px;
    padding-bottom: 20px;
    padding-top: 0;
   
}
.scpi_list_last .coupon-modal .lightbox_btn_wrapper_con{ display: block;}

.scpi_list_last .coupon-modal .title, .coupon-modal .title{
    
    font-size: 22px;
    line-height: 22px;
    letter-spacing: 2px;
    font-weight: bold;
    color: #000;
    text-align: center;display: block;

    position: absolute;
    top: 20px;
    left: 0;
    right: 0;

}

.coupon-modal .lightbox_btn_close, .coupon-modal .coupon_lightbox_btn_close{top: 15px;}

.coupon-modal .btn-bar{ 
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    padding:10px;
    border-top:1px solid #f3f3f3;
    box-shadow: 1px 1px 30px rgba(0, 0, 0, 0.2);
}
.coupon-modal .btn-bar .btn_box{flex:1; text-align: right;}

.lightbox_btn_wrapper_con.coupon-list .ul_3{
    display: flex;
    flex-flow: column;
    padding-bottom: 10px;
}
.lightbox_btn_wrapper_con.coupon-list .li_3, .coupon-list .li_3{
    display: flex;
    flex-wrap: wrap;
    width: 100%;

    border:0;
    border-radius: 0;
    margin:8px 0;
    z-index: 2;
    position: relative;


}
.lightbox_btn_wrapper_con.coupon-list .li_3:after,
.coupon-list .li_3:after{
    content: '';
    display: inline-block;
    height:1px;
    width: 100%;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    z-index: 1;
    position: absolute;
    bottom: 0;
}

.coupon-list .coupon-item-disabled .list_pic,
.coupon-list .coupon-item-disabled .li_3_text,
.coupon-list .coupon-item-disabled .func,
.coupon-list .coupon-item-disabled .toggle-close{
    background-color:#e3e3e3;
}


.coupon-list .coupon-item-disabled .li_3_text{color:#83888b;}
.coupon-item-disabled .list_pic{
    border-color: #d6d6d6;
}
.coupon-list .coupon-item-disabled .func:after{
    background-image: url(../images/pattern_coupon_disabled.png);
}

    .coupon-list .list_pic{
        flex:0 84px;
        padding-bottom: 0;
        border-top-left-radius: 7px;
        border-bottom-left-radius: 7px;
         padding:8px;
         background-color: #fff;
    
        
    }
     .coupon-list .li_3 .list_pic img {
        width: 84px;
        height: 84px;
        transform: translate(-50%, 0);
        top:0px;
    }

    .coupon-list .list_pic .pro-img{ 
        padding-top: 100%; 
        display: block; 
        overflow: hidden;
        background:#d4c2b5 url("../images/info_coupon-s@3x.png") no-repeat 50% 50% / 80%;
        position: relative;
    }


    .coupon-list .coupon-item-disabled .list_pic:has( img) .pro-img:after{
        content: '';
        display: block;
        background-color: rgba(227,227, 227, .9);
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;

    }

    .coupon-list .coupon-item-disabled .list_pic:has( .pro-img:empty) .pro-img:after{ 
       content: '';
        display: block;
        background-color:rgba(241,241,241,.7);
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }
    




    .coupon-list .li_3_text{
        flex:1;
        font-size: 16px;
        color: rgb(49, 56, 61);
        text-align: left;
        padding-left: 15px;
        font-weight: normal;
        border-radius: 0;
        

    }
    .coupon-list .func{
        flex:0 50px;
        text-align: right;
        padding-top: 15px;
        margin-right: 10px;
        background-color:#fff; 
        position: relative;
    }
    .coupon-list .func:after{
        content: '';
        display: inline-block;
        width: 10px;
        position: absolute;
        top: 0;
        right: -10px;
        bottom: 0;
        background: url("../images/pattern_coupon.png") repeat-y 100% 50% / 10px auto;
    }
/*
    .coupon-list .li_3:has( input:checked ) {
      border:1px solid  #000;
    }
*/


    .coupon-list .ps, .method_detail_info_list .coupon-list .ps{
        
        font-size: 16px;
        color: rgb(49, 56, 61);
        text-align: left;
        border-top:1px dashed #f3f3f3;
        line-height: 1.3;
        word-break: break-all;
        margin:0;

    }
    .coupon-list .toggle-close{
        background-color:#fff; 
        padding:15px;
    }
    .coupon-list .toggle-more {margin-top: 0; position: relative;}
    .coupon-list .toggle-more .more,
    .coupon-list .toggle-more .close{
        position: absolute;
        right:22px;
        top:-36px;
        width: 16px;
        height: 16px;
    }
.status_wording{
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 1.4;
    color: #3e3a39;
    text-align: center;

    margin-top: 15%;
    
}
.scpi_list_last .coupon-modal .status_wording{display: block;}
.status_wording img{ width: 100px; margin-bottom: 30px; display: block;margin: 0 auto 30px;}


.scl_fre .btn-bar .btn_basic, 
.method_detail_info_list.editView .info_list_con .coupon-modal .btn-box .btn_basic,
.coupon-modal  .btn-bar .btn_basic{
    padding: 8px 10px 7px 10px;
    margin-left: 0px;
    border-radius: 4px!important;
}

.fake-view{ display: inline-block; width: 206px; }

@media (max-width: 1200px){
    .coupon-modal .lightbox_btn_wrapper_con {
        padding: 6% 20px;
        margin-top: 20px;
    }
    .status_wording{
        margin-top: 30%;
        
    }
}

@media (max-width: 640px){
   .coupon-modal  .lightbox_btn_wrapper {
        width: 96%;
        height: 90%;
        border-width: 5px;
        top: 5%;
        bottom: auto;
    }
    .coupon-modal .btn-bar{flex-direction: column;}
    .coupon-modal .btn-bar .wording{padding:8px;width: 100%;}
    .coupon-modal .btn-bar .btn_box {  width: 100%; text-align: center; }
    .coupon-list .li_3_text {
        padding-left: 0;
        padding-right: 0;
    }
    
    .coupon-list .toggle-more .more, 
    .coupon-list .toggle-more .close{right: 22px}
    
}


/* 會員中心 - 優惠券 */
.member_center_coupon_class {display: flex; justify-content: space-between;}
.member_center_mycoupon_main .mccc_ul{margin-bottom: 0}
.member_center_coupon_box .li_3 {
    width: calc( 100% / 4 - 2%);
}

.member_center_coupon_box .li_3 .list_pic {
    padding-bottom: 0;
}


        
.member_center_coupon_box .pro-img{
    background:#d4c2b5 url("../images/info_coupon-s@3x.png") no-repeat 50% 50% / 80%;
    padding-top: 100%;
}
.member_center_coupon_box .coupon_list_text_title{    color: rgb(49, 56, 61);}
.member_center_coupon_box .coupon_list_text_deadline{ font-weight: normal; }
.member_center_coupon_box .receive_btn_no{margin-top: 0; margin-bottom: 0;     background: #ae8f72;}

.member_center_coupon_box .coupon_lightbox_btn_close {    top: 10px; }

.member_center_coupon_box .lightbox_btn_wrapper{
    width: 1200px; 
    max-width: 96%; 
    height: auto; 
    top:10%;
    bottom: auto; 
}
.member_center_coupon_box .lightbox_btn_wrapper_con {
    color: rgb(49, 56, 61);
     line-height: 1.4;
     display: flex;
}
.member_center_coupon_box .lightbox_btn_wrapper_con .pic{ flex:0 48%; }
.member_center_coupon_box .lightbox_btn_wrapper_con .pic img{width: 100%;}
.member_center_coupon_box .lightbox_btn_wrapper_con .pic-con{flex:1; padding-left:3%;}

.member_center_coupon_box .lightbox_btn_wrapper_con .title{font-weight: bold; font-size:24px;}
.member_center_coupon_box .lightbox_btn_wrapper_con .text,
.member_center_coupon_box .lightbox_btn_wrapper_con .wording{ font-size:16px; margin-top: 15px;}
.member_center_coupon_box .lightbox_btn_wrapper_con .wording{ color: rgb(95, 114, 127);}

/* add-- */
.member_center_coupon_box .coupon_list_text_deadline span{width: auto; display: inline-block; }
.member_center_coupon_box .coupon_list_text_deadline span br{display: none}
/* ---add */

.coupon-empty-img{
    background:#d4c2b5 url("../images/info_coupon-s@3x.png") no-repeat 50% 50% / 80%;
    padding-top: 100%;
}


@media (max-width: 1200px){
    .member_center_coupon_class{ display: block; }
    .member_center_coupon_class .add_coupon_box{margin-top: 15px;}
    .member_center_coupon_class .add_coupon_form_input{ width: 200px }
    .member_center_coupon_box .li_3 {    width: calc( 100% / 3 - 4%);}
    .member_center_coupon_box .ul_9 {    text-align: left;}
    .member_center_coupon_box .lightbox_btn_wrapper_con{padding:40px 3%;}
/* add-- */
    .member_center_coupon_box .coupon_list_text_deadline span:not(br){display: inline;}
    .member_center_coupon_box .coupon_list_text_deadline span:has(br){display: block;}
    .member_center_coupon_box .coupon_list_text_deadline span br{display: block;}
/* ---add */
}

@media (max-width: 640px){
    .member_center_coupon_box .li_3 {    width: calc( 100% / 2 - 4%);}
    .member_center_coupon_box .lightbox_btn_wrapper_con{ flex-direction: column;padding:40px 20px;}
    .member_center_coupon_box .lightbox_btn_wrapper_con .pic-con{ padding:3%;}

}

/* 優惠組合 */
:root{
 scroll-padding-top:calc(64px );
 --combo-color:#c3aa97;
 --check-color:#e8656b;
}


.product_combo_group{
    border:2px solid  var(--combo-color);
    padding-top: 10px;
}

.product_combo_group .product_detail_guess_title{
    color: var(--combo-color);
    font-size: 20px;
    margin-bottom: 10px;
    letter-spacing: 0;
}
.product_combo_group .product_detail_guess_title > span{
    background-color: var(--combo-color);
    color: #fff;
    display: inline-block;
    width: 28px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    margin-right: 10px;
}
.product_combo_group .index_product_con{
    position: relative;
    padding: 0 60px;
    width: calc(100% - 120px);
}
.product_combo_group .swiper-next {
    right: 20px;
}
.product_combo_group .swiper-prev {

    left: 20px;
}

.product_combo_group .exp{ color:#dfe5e8 ; padding:0px 38px;margin-bottom: 38px;}
.product_combo_group .exp > span{color: rgb(95, 114, 127);}
.product_combo_group .exp > span b{color: var(--combo-color); }

.product_combo_group .guess_list_text_title{margin-top: 10px; text-align: left;}

.product_combo_group .exp > .check-color{ color:var(--check-color); }
.product_combo_group .exp > .no-check-color{ color: var(--combo-color); }

.combo-tab-bar{
   position: fixed;     
   left: 0;
   right: 0;
   z-index: 99;
   bottom:  0;
   text-align: center;
   min-height: 42px; line-height: 42px;
   display: none;
   color: rgb(95, 114, 127);
   background-color: #efe0cd;
   display: block;
   box-shadow: 0 0 8px rgba(0,0,0,.2);
}

.combo-tab-bar .wrapper{ text-align: left;padding:0 10px; display: flex;}
.combo-tab-bar .text{ flex:0 200px; }
.combo-tab-bar .item{ 
    flex:1;
    display: inline-block; 
    margin:0 0px 0 20px;
    border:1px solid  var(--combo-color); 
    line-height: 28px;
    padding-right: 14px;
    
     background-color: #fff;
}
.combo-tab-bar .item a{ 
 font-size:14px;

}
.combo-tab-bar .item .point{
    display: inline-block; 
    width: 28px; height: 28px; line-height: 28px; 
    color: #fff!important;
    background-color: var(--combo-color); 
    text-align: center;
    margin-right:8px;
    font-weight: bold;
    font-size:16px;
}

.combo-tab-bar .item.check{ position: relative; }
.combo-tab-bar .item.check:after{
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background:#fff url(../images/icon_combo_check.png)  no-repeat 0 0 /cover;
    position: absolute;
    top: -5px;
    right: -10px;
    border-radius: 10px;
}
.btn_box_combo{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #efefef;
    padding: 10px 20px;
}
.btn_box_combo .txt{ margin-right: 40px; }
.btn_box_combo .txt select{margin-left: 12px;}

.combo-cart-box{
    display: flex;
    align-items: center;
    border:1px solid #efefef;
    background-color: #fff;
    padding:5px;
    margin-bottom: -1px;
    
}


.combo-cart-box .img img{ width: 36px;  margin-right: 20px;}
.combo-cart-box .name{font-size: 16px;margin-right: 20px;}
.combo-cart-box .num, .combo-cart-box .num > div{
        color: #959595;
        font-size: 16px;
        line-height: 1.4;
}
.p_commodity_con_info_conbox .p_ccic_line{margin-top: 10px;}
.p_commodity_con_info_con div.p_ccic_text{ position: relative; }
.p_commodity_con_info_con{padding-bottom: 15px;}
.p_commodity_con_info_con .p_ccic_num{ float: none; margin-top: -6px; }
.p_ccic_text_num_item{padding:5px 0; display: flex; justify-content: space-between;}

.p_commodity_con_info_con:has(.combo-cart-box) .p_ccic_text_num_item{ display: block; }
.p_commodity_con_info_con .p_ccic_num{ width: 130px; }
.p_commodity_con_info_con .p_ccic_num > div{text-align: right;}
.p_commodity_con_info_con .p_ccic_text_num:has(.combo-cart-box){ padding-top: 5px; }

body:has(.combo-tab-bar) {padding-bottom: 42px}
.index_product_con_list.product_check{
    border-color:var(--check-color);
    border-width: 2px;
}

@media (min-width:1201px){

 

 .p_commodity_con_info_con .p_ccic_text .colspan{ position: relative; }
 .p_commodity_con_info_con .p_ccic_text_num{ /*position: relative;*/}
 .p_commodity_con_info_con .p_ccic_num{   }
     .p_ccic_eye {
        display: inline-block;
        width: 77%;
        float: none;
    }
    .p_ccic_text_num_item:has(.combo-cart-box) .p_ccic_num{position: absolute; top: -6px; right: 0px;}

}
@media (max-width:1200px){
    
    
    

    .p_commodity_con_info_con .p_ccic_num{  margin-top:-7px; }
    .product_combo_group .index_product_con {
        padding: 0;
        width: 100%;
    }
    .index_product_con_list {
        width: calc(100% - 20px);
        margin: 0 10px;
    }
    .p_ccic_text_price{position: relative;        top: 0px;}
    .p_commodity_con_info_con {
        padding:15px 5px;
    }
    .p_commodity_con_info_con:has(.combo-cart-box) .colspan{position: relative;}
    .p_ccic_text_num_item:has(.combo-cart-box) .p_ccic_num{position: absolute; top: -13px;right: 0px;margin-top: 0;}
   
    .combo-tab-bar .item{line-height: 18px; padding-right: 0;}
    .combo-tab-bar .item a{font-size: 0;}
    .combo-tab-bar .item .point{font-size: 16px;margin-right: 0;}
    .combo-tab-bar .item.check:after{    top: -7px;    right: -13px;}
}

@media (max-width:991px){


/*.navFixed { top: 53px;}*/

.btn_box_combo .txt{ margin-right: 20px; }
.btn_box_combo .txt select{margin-left: 6px;}
.p_commodity_con_info_con:has(.combo-cart-box) .p_ccic_text_price{margin-top: 10px;}

.combo-cart-box{ width: 100%; flex-wrap: wrap;}

.combo-cart-box .img{ flex:0 50px;}
.combo-cart-box .name{ flex:1 auto; margin-right: 0;}
.combo-cart-box .num{flex:1 auto;margin-left: 50px;}
.p_commodity_con_info_con .p_ccic_eye, .p_commodity_con_info_con .p_ccic_text_name {
    width: calc(100% - 100px - 10px);
}
 .p_commodity_con_info_con .p_ccic_text_name{width: calc(100% - 10px);}
 .p_commodity_con_info_con:has(.combo-cart-box) .p_ccic_text_name{width: calc(100% - 100px - 10px);}
 .combo-cart-box{ width:100%; }
.combo-tab-bar .wrapper{flex-direction: column;width: calc(100% - 20px);}
.combo-tab-bar .text{ flex:0 auto;}
body:has(.combo-tab-bar) {padding-bottom: 84px}


}
/*+56*/

.p_commodity_con_info_con div.p_ccic_close{margin-left: 6px;}

}


@media only screen and (max-width: 640px){
    .p_commodity_con_info_con .p_ccic_num {
        margin-top: -2px;
    }

}


