@import url("reset.css");

@media screen and (max-width: 640px) {
*{padding:0px; margin:0px; font-family: '微軟正黑體'; font-size:16px;}
body{ background-color:#fff;font-family:Arial, Helvetica, sans-serif;-webkit-text-size-adjust:none;	font-family: "微軟正黑體"; box-sizing:border-box; width:100%}

/*========================================================================================================================================================*/

/*===桌機===*/
.header_t {display:none;}
.wrapper {display:none;}
.i_line { display:none;}
.content_help { display:none;}
.shopfr h2{display:none;}
.shoptitlet h3{ float:none;}
.share{display:none;}/*分享*/
.payiton h2{display:none;}/*商家名稱標題*/
.shopinfo{display:none;}/*商品資訊*/
.desc{display:none;}/*左邊商品說明 商店的話*/
.mdesc{display:block;}
.mwrapper{ width:100%; min-height:20px; display:block;}
.Post_Code, .Post_Code2 {display:none;}

.i_footer_100{width: 100%; margin-bottom:30px; display: block; overflow: hidden;clear: both; border: 1px solid #bababa;}	
.i_footer {display: block;width: 100%;background-color: #f2f0f0;border-top-width: 1px; border-bottom-width: 1px;border-top-style: solid;border-bottom-style: solid;border-top-color: #bababa;border-bottom-color: #bababa;box-shadow: 0px 1px 1px 1px #E6E6E6;}
.copyright {margin: 0px 10px 0px 10px;font-size: 12px;}
/*===手機上方版頭===*/
#BLACK{display: block;width: 100%; height: 50px; float: left; top: 0px;	background-color: #f2f0f0; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #bababa; box-shadow: 0px 1px 1px 1px #E6E6E6; z-index:99999;}
#BLACK h1{text-align: left;	position: absolute;	left: 8px;	top: 12px; display:block;}
#BLACK span a{text-align: left;	line-height: 18px;	color: #000;	font-size: 13px;	position: absolute;	left: 160px;	top: 17px;	text-align: justify;	text-justify: inter-cluster;	font-family: "微軟正黑體";	letter-spacing: 0px; text-decoration:none; color:#333;}
#BLACK h3 a{display: block;	position: absolute;	right: 3px;	top: 10px;	text-decoration:none; }

/*===商家logo圖 800*300px 伸縮===*/
.shoplogo{width: 100%; height: auto; margin-top: 10px; clear: both; display: block; text-align: center; margin-bottom:10px;}
/*========================================================================================================================================================*/

/*===版頭選單===(目前三項:產品服務.幫助中心.關於智付寶)*/
.mobheader_menu { width:80%; display: block; ;height: 40px;	line-height: 40px;   clear:both ; background-color:#FFF; margin:52px auto 0px auto; text-align:center;}
.mobheader_menu li {float:left;list-style-type: none;	margin-right:10px;	height: 27px;	padding-right: 15px;	background-image: url(../images/arrow/menu_ui.png);	background-repeat: no-repeat;	background-position: right 16px;}
.mobheader_menu li a {padding-left: 0px; font-family: "微軟正黑體"; font-size: 13px; color: #666;height: 40px; line-height: 40px; display: block; text-decoration:none; }
.mobheader_menu li a:hover {color: #36C; text-decoration:none;}
.first{ padding-left:15px;}

/*===中央左右兩塊設定===*/
.container{ width:100%; padding:0px; margin:0 auto; clear:both;}
.shopfl{float:none;width:96%; display:block;  margin:0 auto; }
.shopfr{float:none;width:96%; display:block;  margin:0 auto; }
.motitle{display:block;}
.shopflm{width:100%;}

/*===商品圖===*/
.p_img{ width:95% ; height:auto; display:block;background-color:#F60; margin:100px auto 10px;  border:1px #CCC solid;}

/*===(一)商店資訊:商店名稱 產品金額屬性訂購數量(點選才出現)===*/
.shopinfo{ border:1px solid #CCC; font-family:'微軟正黑體'; font-size:16px; line-height:45px; width:100%;}
.shopinfo ul li{ padding:0px; margin:0px;}
.shopinfo li{ min-height:45px; border-bottom:1px solid #CCC;}
.shopinfo h4{ border-right:1px solid #CCC; display:inline-block; width:100px; line-height:45px; text-align:center; }
.shopinfo p{display:inline-block; line-height:45px; text-align:left; padding-left:15px;}
.shopinfo li.last{ border-bottom: none;}

/*===(三)商店資訊(收合面版)===*/
.m_shopinfo{display:block;width:100%; font-family:"微軟正黑體"; color:#FFF;  cursor: pointer;}
.m_shopinfo_in{ font-family:'微軟正黑體'; font-size:16px; margin:10px; width:97%; border:none;}
.m_shopinfo_in h2{font-family: 微軟正黑體;	font-size: 18px;color: #333;padding: 12px 0 12px 20px;	display: block;	background-color: #eee;	margin-top: 15px;}
#m_shopinfo{display:none;float:left;}

/*===(四)原右邊上方商家訂單資訊(訂單編號 產品金額屬性數量等)===*/
.payiton{display:block;width:100%; font-family:"微軟正黑體";}
.payiton h2{font-family:'微軟正黑體'; font-size:36px; color:rgb(11, 117, 160);  padding:10px 0; border-bottom:1px rgb(11, 117, 160) solid;} 
.payiton_in{display:block;width:98%;}
.payiton_in ul li {list-style:none;}
.payiton_in li{ min-height:40px; font-family:"微軟正黑體"; font-size:14px;}

/*===(五)選擇付款方式_信用卡分期及其他付款方式===*/
.choose_payment_n {display:block;width:90%;font-family:微軟正黑體; height:40px; clear:both;background-color:rgba(14, 151, 228, 0.26);}
.choose_payment_in{}
.choose_payment_in h3{ font-size:16px; color:#630; padding:10px; float:none d; display:block;}
.choose_payment_in .card{ width:100%; display:block; float:none;}
.choose_payment_in .card_n{  width:100%; float:none; display:block;}
.choose_payment_in .other_n{ float:none;}

/*===秀出所選擇的付款方式===*/
.payment_show{display:block;width:100%;  color:#FFF;}
.payment_show_in{display:block;width:100%;  background-color:#f6f6f6; float:left}
.payment_show_in .card ul li{list-style:none; padding:4px; line-height:25px; }

/*===按鈕===*/
.paybon{display:inline-block; width:140px; height:40px; text-align:center; margin-bottom:10px; white-space:nowrap;}
.paybon_custom{width:auto; height:auto; min-width:140px}

/*===(六)付款人資訊===*/
.payinfo_n {display:block;width:90%; height:40px; clear:both;background-color:rgba(14, 151, 228, 0.26);}
.payinfo_in {display:block;width:90%; clear:both;}
.payinfo_in ul li{padding-top:10px;list-style:none;}

/*===(七)收件人資訊===*/
.addressee{display:block;width:90%; height:30px; line-height:16px; clear:both; background-color:rgba(14, 151, 228, 0.26);}

/*===(八)留言給商家===*/
.messageto{display:block;width:90%;height:28px;line-height:28px; clear:both; margin:10px;background-color:rgba(14, 151, 228, 0.26);}

/*===(九)手機分享===*/
.mshare{ display:inline; text-align:left; float:left; margin-left:20px;}

/*===(十)隱私權&服務平台===*/
.privacy{ width:92%; margin:10px auto; text-align:center; min-width:320px;}
.privacy_in a{width:96%; display:block; background-color:#f2f2f2; border:1px solid #ccc;  border-radius:5px; margin:0px auto;text-align:left; padding:8px 0 8px 26px; }

/*===版尾===*/
.m_footer_info {width:100%;margin:60px 0 30px 0px; display: block;text-shadow:0px 1px #fff;color: #666;background-color:#f2f0f0; padding:12px; border-top:1px solid #CCC; border-bottom:1px solid #CCC; margin:0 auto; }
.m_footer_info ul {	list-style-type: none;}
.m_footer_info ul li { font-size: 14px;height: 22px; display: block;	line-height: 22px;  }
.m_copyright {height: 10px; margin:10px auto 30px auto;	font-size: 9px;color: #999;line-height: 10px;	text-align: center;	letter-spacing: 0px;  line-height:15px;}

/*========================================================================================================================================================*/
._select{ display: inline-block; height: 35px; padding: 8px 6px; font-size: 12px;line-height: 1.4285; color: #555; background-color: #FFF; background-image: none; border: 1px solid #CCC; border-radius: 4px; box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset; transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;  width:30%;}
.ml-20 {
    margin-left: 0px;
}
.div_login_btn {
    font-size: 14px !important;
    font-family: Arial,微軟正黑體 !important;
    font-weight: normal !important;
    -moz-border-radius: 5px !important;
    -webkit-border-radius: 5px !important;
    border-radius: 5px !important;
    border: 1px solid #e3891c !important;
    padding: 7px 25px !important;
    text-decoration: none !important;
    background: -moz-linear-gradient( center top, #f2c218 5%, #f0911d 100% ) !important;
    background: -ms-linear-gradient( top, #f2c218 5%, #f0911d 100% ) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2c218', endColorstr='#f0911d') !important;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(5%, #f3c110), color-stop(100%, #f0911d) ) !important;
    background-color: #f0911d !important;
    color: #ffffff !important;
    display: inline-block;
    text-shadow: 1px 1px 0px #db8215 !important;
    -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff !important;
    -moz-box-shadow: inset 1px 1px 0px 0px #ffffff !important;
    box-shadow: inset 1px 1px 0px 0px #fff7d4 !important;
}.div_login_btn:hover {
    background:-moz-linear-gradient( center top, #f2c218 5%, #f0911d 100% ) !important;
    background:-ms-linear-gradient( top, #f0911d 5%, #f0911d 100% ) !important;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2c218', endColorstr='#f0911d') !important;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #f0911d), color-stop(100%, #f0911d) ) !important;
    background-color:#f0911d !important;
}.div_login_btn:active { position:relative !important;top:1px !important;}

.G_btn_1 {width: 48%;font-weight: 500;-moz-border-radius:1px;-webkit-border-radius:1px;border-radius:1px;border:1px solid #ccc;padding:9px 6px;text-decoration:none;background-color:#f5f5f5;color:#333;display:inline-block;text-shadow:1px 1px 0px #e5e5e5; }

.G_btn_1:hover{
    border: 1px solid #8fc51d;
    box-shadow: 0 0 5px rgba(14,81,5,.3), inset 0 0 1px rgba(121,121,121,.38);
    background-color: #e7ecc3;
    color:#333; text-decoration:none;
    background-image: linear-gradient(bottom, #95bd0d 0%, #a1c124 17.85%, #b9c952 52.49%, #fff 100%);
}

.G_btn_1_active{
    border: 1px solid #8fc51d;
    box-shadow: 0 0 5px rgba(14,81,5,.3), inset 0 0 1px rgba(121,121,121,.38);
    background-color: #e7ecc3;
    color:#333; text-decoration:none;
    background-image: linear-gradient(bottom, #95bd0d 0%, #a1c124 17.85%, #b9c952 52.49%, #fff 100%);
}

#show_img > img , .pic_div > img{ display:none;}
#show_img{text-align: center; height:350px; border: 1px solid #ddd; float:left; width:100%; }
.thumbnail{ display: inline; margin-bottom: 0; border: none;}
.pic_div{ 
    position: relative;
    width:66px;
    height:76px; 
    float:left; 
    display:table-cell;
    text-align:center;
    vertical-align:middle; 
    margin: 5px 5px 5px 0px;
    background-color: #fff;
    border: 1px solid #ddd; 
    border-radius: 4px;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.payinfo_in_name { padding-left:32px; }
div.ProdDesc, div.MerRemark { font-size: 16px; }
label {font-weight: 100;}
.bank_text {font-weight:bold; margin-right:10px; font-size: 18px;}

.payiton_in_shopinfo_left { width: 100%; float: left; text-align:left;font-weight: bold; margin-top:5px;}
.payiton_in_shopinfo_right { width: 100%; float: left;  word-wrap: break-word;}
.payiton_in_order_left_shop { width: 100%;  text-align: left;font-weight: bold; margin-top:5px;}
.payiton_in_order_right_shop { width: 100%;  }

#LimitY, #LimitM, #aeLimitY, #aeLimitM, #unionLimitM, #unionLimitY{ width: 43%; }
.number, .aenumber {width:20%}
.aenumber:nth-child(2) {width:20%;} 
.aenumber:nth-child(3) {width:26%;} 
.aenumber:nth-child(4) {width:24%;} 
#cvc, #LimitMY, #aecvc, #aeLimitMY, #UnionCVC, #UnionLimitMY{width:42%}
input[name=ReceiverAddr] {margin-top: 5px;margin-bottom: 5px;}
input[name=ReceiverMail] {margin-bottom: 5px;}
.input_text{ width: 100%; }

.payiton_in_div{display: inline-block;width: 100%;padding:5px 0px 0px 5px}
.payiton_in_div_left_shop{width:15%; float:left;}
.payiton_in_div_right_shop{width:auto;}
.SubProdList_a, .SubProdList_b, .Quantity{ width: 100%; height: 40px; padding: 0px 0px 0px 5px;}
input.ProductPrice{ width: 88%; height: 40px; padding: 0px 0px 0px 5px;}

.explain{width:95%; display:none;}
.card_top_div {margin:5px 10px 5px 10px; float:left; width:100%;}
.card_first_div {margin:5px 10px 5px 10px; float:left; width:100%;}
.card_last_div {margin:5px 10px 5px 10px; float:left; width:100%;}
.card_explane{margin-left: 9px}
.card_in_div_left { width:100%; float:left; margin-top: 4px; }
.card_in_div_right { width:100%; float:left; }
.card_in_div_last{padding: 25px 0px 10px 10px; margin-top:10px;}

.buyr_div { display: inline-block;width: 100%;padding:5px 0px 0px 5px; }
.buyr_div_first { padding:10px 0px 0px 5px; }
.buyr_div_last { padding:5px 0px 20px 5px; }
.buyr_in_div_left { width:100%; float:left; margin-top:3px; text-align:left;}
.buyr_in_div_right { width:100%; float:left; }

.InvoiceCompanyNameDiv { display:none; }
.InvoiceUBNDiv {  display:none;  padding:35px 0px 40px 5px;}

.ProdDesc, .MerRemark {word-wrap: break-word;word-break: break-all; float: left;margin: 5px}

.mobile_only { display:inline; }    /* mobile */
.desktop_only { display:none; }   /* desktop */
.css_table { display:block; margin-bottom: 5px; border-bottom: 1px rgb(11, 117, 160) solid;float: left; width: 100%; }
.payiton_in_desktop{ display:none; }

.payiton_in_mobile > .css_tr > .css_td:nth-child(1)  { float: left; font-size:26px; color: rgb(11, 117, 160); width:100%; word-wrap: break-word; word-break: break-all; }
.payiton_in_mobile > .css_tr > .css_td:nth-child(2)  { float: right; text-align: right; width: 100%; }
.payiton_in_mobile > .css_tr > .css_td:nth-child(2)  > span { font-size:14px;  }
.payiton_in_mobile > .css_tr > .css_td:nth-child(2)  > a { cursor:pointer; font-size:14px;  }

.address_en{display:none;}
.tip2 {color:red; margin-left:5px;}

.card_mobile_icon {display:inline;}
.card_desktop_icon {display:none;}

._input, ._select {height:40px; font-size: 16px;}
._textarea{width:100%; height:80px; margin-top:20px; padding:2%; resize:none; float:left; font-size:16px;}
#VACC > ul > li > div > img  { margin:2px 2px 2px 2px;width: 20px; cursor:default;}
#WEBATM > ul > li > div > img { margin:2px 2px 2px 2px;width: 20px; cursor:default;}
#show_error{
    margin: 0px;
    font-size:20px;
    color: red;
}
.modal-content {width:100%;margin-top:50px}

.modal_text {
    font-family: arial,微軟正黑體,Microsoft JhengHei;
    font-size: 24px;
    color: #F39929;
    font-weight: normal;
    line-height: 36px;
    margin-top: 5px;
    margin-bottom: 15px;
}

.bank_table thead {
    border: 1px solid #999;
    line-height: 30px;
    font-weight: normal;
    background-color: #F5F5F5;
    border-top-width: 2px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: #999;
    border-right-color: #999;
    border-bottom-color: #999;
    border-left-color: #999;
    font-size: 14px;
}

.bank_table {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #E7E7E7;
    padding-top: 15px;
    padding-right: 8px;
    padding-bottom: 15px;
    padding-left: 0px;
    line-height: 30px;
    font-size: 15px;
    font-family: arial,微軟正黑體,Microsoft JhengHei;
    text-align: center;
    vertical-align: middle;
}

.bank_table thead tr th { text-align: center;}

.td_color{
    border: 1px solid #999;
    line-height: 30px;
    font-weight: normal;
    background-color: #F5F5F5;
    border-top-width: 2px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: #999;
    border-right-color: #999;
    border-bottom-color: #999;
    border-left-color: #999;
    font-size: 14px;
}

.City, .Area{width:48%; margin-right:5px;}
.Post_Code{background-color: #e7e7e7; width: 75px; height: 30px; padding-left: 4px; font-size: 12px}
.cvs_alert{
    padding-left: 15px;
}

radio_webatm_bank, .radio_atm_bank, .bank_text {cursor:pointer;}
.cvs-com-text {
    margin-left: 1em;
}

}