/**/
#banner_inner { background-color: #fad1dc; height: auto; }
#banner_inner img { display: block; max-width: 100%; margin: 0 auto; }
/**/
.bocpay { font-size: 14px; }
/**/
.highlight { font-size: 18px; }
.bocpay h5, .bocpay h4, .bocpay h3 { margin-bottom: 0; }
ul.remark { padding: 0; margin-left: 15px; }
ul.remark li { list-style: disc; }

.tabs { display: table; width: 100%; }
.tabs a { display: table-cell; width: 1%; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; vertical-align: middle; font-size: 18px; font-weight: bold; border-left: 1px solid #c8c8c8; }
.tabs a:first-child { border-left: 0; }
.tabs img, .tabs span { vertical-align: middle; display: inline-block; }
.tabs span { margin-left: 20px; }
.tabs .push { margin-left: 5px; }

.seation { position: relative; }
.seation-head { position: absolute; top: -37px; left: 50%; margin-left: -265px; }
.seation-head img { width: 100%; display: block; }

.offset { position: relative; margin-top: 60px; margin-right: 1%; border: 5px solid #45a19c; border-radius: 10px; -webkit-box-shadow: 4px 4px 0px 0px rgba(102, 205, 199, 1); -moz-box-shadow: 4px 4px 0px 0px rgba(102, 205, 199, 1); box-shadow: 4px 4px 0px 0px rgba(102, 205, 199, 1); }
.offset .tab-head { position: relative; }
.offset .tab-head img { position: relative; display: block; max-width: 100%; z-index: 2; }
.offset .tab-head:after { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background-color: #45a19c; }
.offset .tab-body { padding: 30px 60px; }
.offset p { font-size: 18px; text-align: center; }
.offset ul { margin-top: 10px; margin-left: 20px; }
.offset li { list-style: disc; }
.offset .offer1 .tab-body, .offset .offer2 .tab-body { padding-top: 0; }
.offset .offer5 .tab-body { padding-top: 0; }

.leadin { padding: 30px 0px 0px; }

.table { display: table; width: 100%; }
.refund, .monday { display: table-cell; vertical-align: middle; }
.refund { padding-left: 5%; }
.refund p { text-align: left; }
.refund .sticker { width: 100%; max-width: 419px; position: relative; }
.refund .sticker img { width: 100%; display: block; }
.refund .sticker a { position: absolute; right: 0; width: 31%; height: 50%; }
.refund .sticker a.link1 { bottom: 50%; }
.refund .sticker a.link2 { bottom: 0%; }
.monday { width: 176px; padding-left: 10px; }
.monday img { width: 100%; max-width: 176px; display: block; }
.monday.view_m { display: none; }
/*.tips { border-radius: 20px; background-color: #ef462b; color: #ffffff; padding: 10px 20px; margin: 20px 0; display: inline-block; font-size: 18px; -webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5); -moz-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5); box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5); }*/
.tips { font-style: italic; margin-top: 50px; }
.tips strong { font-size: 110%; }

.shop_list {  display: table; width: 100%; }
.shop_list.last { border-bottom: 0; }
.shop_list.with_desc { position: relative; padding-bottom: 50px; }
.shop_list .logo, .shop_list .detail { display: table-cell; vertical-align: middle; padding: 25px 0; }
.shop_list .logo { width: 20%; padding-left: 5%; }
.shop_list .logo img { width: 100%; max-width: 75px; }
.shop_list .logo2 img { width: 100%; max-width: 121px; }
.shop_list li { font-size: 16px; }
.shop_list h4 { font-size: 16px; margin-top: 10px; }
.shop_list h5 { font-size: 20px; margin-top: 0; color: #b10a32; }
.shop_list h5 sup { font-size: 60%; color: #b10a32; }
.shop_list strong { color: #b10a32; }
.shop_list .remark { font-size: 11px; margin-top: 10px; margin-bottom: 0; text-align: left; }
.shop_list .small_desc { position: absolute; bottom: 20px; left: 5%; width: 90%; font-size: 12px; }
.shop_list .small_desc ol { margin: 0; padding-left: 15px; }
.shop_list .small_desc ol li { font-size: 12px; list-style: decimal; }
a.blue_btn { background-color: #66cdc7; border-radius: 7px; display: inline-block; font-weight: bold; padding: 6px 15px; color: #ffffff; margin-top: 15px; -webkit-box-shadow: 4px 4px 0px 0px rgba(69, 161, 156, 1); -moz-box-shadow: 4px 4px 0px 0px rgba(69, 161, 156, 1); box-shadow: 4px 4px 0px 0px rgba(69, 161, 156, 1); }

.logo_group { text-align: center; padding-bottom: 20px; }
.logo_group img { display: inline-block; vertical-align: middle; width: 40%; max-width: 140px; margin: 0 10px 10px; }
.btn_detail img { display: block; margin: 0 auto 10px; }

.features { margin-top: 70px; margin-right: 1%; margin-bottom: 50px; padding: 70px 0 40px; border: 5px solid #680920; border-radius: 10px; -webkit-box-shadow: 4px 4px 0px 0px rgba(176, 9, 49, 1); -moz-box-shadow: 4px 4px 0px 0px rgba(176, 9, 49, 1); box-shadow: 4px 4px 0px 0px rgba(176, 9, 49, 1); }
.feature { display: table; width: 100%; }
.feature .list { display: table-cell; width: 25%; border-right: 2px solid #c8c8c8; text-align: center; }
.feature .list:last-child { border-right: 0; }
.feature h5 { font-size: 20px; margin-top: 0; margin-bottom: 10px; color: #b10a32; }
.feature p { margin-bottom: 0; }
.feature .list.view_desktop { display: table-cell!important; }

.mgm { position: relative; margin-top: 70px; margin-right: 1%; border: 5px solid #087bbd; border-radius: 10px; -webkit-box-shadow: 4px 4px 0px 0px rgba(60, 161, 219, 1); -moz-box-shadow: 4px 4px 0px 0px rgba(60, 161, 219, 1); box-shadow: 4px 4px 0px 0px rgba(60, 161, 219, 1); }
.mgm p { font-size: 18px; text-align: center; }
.mgm p .highlight { font-size: 20px; }
.mgm p.date { color: #b00931; font-size: 16px; }

.blue_table { border-radius: 10px; border: 1px solid #45a19c; }
.blue_table th, .blue_table td { padding: 8px 5px; font-size: 18px; text-align: center; }
.blue_table th { background-color: #45a19c; color: #ffffff; border-right: 1px solid #ffffff; }
.blue_table th:first-child { border-radius: 8px 0 0 0; }
.blue_table th:last-child { border-right: 0; border-radius: 0 8px 0 0; }
.blue_table td { border-right: 1px solid #45a19c; border-bottom: 1px solid #45a19c; }
.blue_table td:last-child { border-right: 0 }
.blue_table tr:last-child td { border-bottom: 0 }

#mgmslider { width: 730px; margin: 0 auto 40px; }
#mgmslider .mobile_skin { width: 100%; position: absolute; top: 0; left: 0; z-index: 8; }
#mgmslider .slider { width: 250px; margin-left: 50px; float: left; }
#mgmslider .slides img, #mgmslider .mobile_skin img { width: 100%; display: block; }
.img-caption { margin: 22% 0 0 0; width: 45%; float: right; }
.img-caption ul { width: 100%; display: block; }
.img-caption ul li div { margin: 8% 0; font-size: 16px; line-height: 25px; position: relative; margin-left: 35px; color: #666666; }
.img-caption ul li div span { content: ''; width: 25px; height: 25px; position: absolute; top: 0; left: -35px; }
.img-caption ul li.caption-1 div span { background: url(1-1.png) center no-repeat; background-size: cover; }
.img-caption ul li.caption-2 div span { background: url(2-1.png) center no-repeat; background-size: cover; }
.img-caption ul li.caption-3 div span { background: url(3-1.png) center no-repeat; background-size: cover; }
.img-caption ul li.caption-4 div span { background: url(4-1.png) center no-repeat; background-size: cover; }
.img-caption ul li.select-cap.caption-1 div span { background: url(1-2.png) center no-repeat; background-size: cover; }
.img-caption ul li.select-cap.caption-2 div span { background: url(2-2.png) center no-repeat; background-size: cover; }
.img-caption ul li.select-cap.caption-3 div span { background: url(3-2.png) center no-repeat; background-size: cover; }
.img-caption ul li.select-cap.caption-4 div span { background: url(4-2.png) center no-repeat; background-size: cover; }

.fullrow { margin: 40px 0 30px; }
.fullrow .inline { width: 49.3%; display: inline-block; vertical-align: top; }
.fullrow .inline img { display: block; }
.fullrow .inline h3 { font-family: "Microsoft YaHei", 微软雅黑, tahoma, arial, simsun; font-size: 26px; line-height: 30px; margin-top: 0; background-color: #ffffff; text-align: center; width: 160px; top: -7px; left: 50%; margin-left: -80px; position: absolute; }

.dlApp { text-align: center; position: relative; border: 2px solid #b00931; border-radius: 20px; margin-right: -20px; z-index: 2; background-color: #ffffff; min-height: 145px; }
.dlApp .app { display: table; margin: 10px auto 0; border-spacing: 15px; }
.dlApp .app div { display: table-cell; vertical-align: middle; border-spacing: 0; }
.dlApp .app img { width: 100%; margin: 0 auto; }
.dlApp .app .ico { /*width: 17%;*/ }
.dlApp .app .ico img { max-width: 70px; margin-bottom: 2px; }
.dlApp .app .dl { /*width: 60%;*/ }
.dlApp .app .dl div { display: table-cell; border-spacing: 5px; }
.dlApp .app .dl .app-store img { max-width: 109px; margin-right: 10px; }
.dlApp .app .dl .google-play img { max-width: 135px; }
.dlApp .app .qrcode { width: 23%; }
.dlApp .app .qrcode img { max-width: 93px; }
.dlApp .app .pay { color: #b00931; font-size: 14px; }
.upay { text-align: center; position: relative; border: 10px solid #b00931; border-radius: 0 20px 20px 0; min-height: 129px; }
.upay .uapp { display: table; margin: 0 auto 0; border-spacing: 15px; }
.upay .uapp .pay { color: #b00931; font-size: 14px; }
.upay .uapp .payqr, .upay .words{ color: #333333; font-size: 14px; }
.upay .words { vertical-align: bottom; text-align: center; padding-top: 8%; }
.upay .uapp .uico { width: 46%; max-width: 120px; }
.upay .uapp .ico { width: 22%; max-width: 70px; }
.upay .uapp div { display: table-cell; vertical-align: middle; border-spacing: 0; }
.upay .uapp img { width: 100%; margin: 5px auto; }
.upay .remark { display: table; text-align: left; margin: -15px 0  10px 0; }

.floating { position: fixed; z-index: 9; width: 100%;  left: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.0); }
.floating.sticky { position: absolute; }
.floating .container { width: 100%; max-width: 650px; margin: 0 auto; display: table; border-spacing: 0px; }
.floating .welcome { display: table-cell; vertical-align: middle; text-align: left; font-size: 20px; font-weight: bold; line-height: 24px; color: #fff; }
.floating .welcome strong { font-size: 30px; }
.floating .dlApp { border: 0; margin-right: 0; min-height: auto; display: table-cell; vertical-align: middle; width: 44%; }
.floating .dlApp img { display: block; }
.floating .dlApp .app .dl { width: 83%; }
.floating .dlApp .app .dl div { width: 48%; display: inline-block; }
.floating .dlApp .app .dl div a { display: block; background-color: #b00931; -webkit-box-shadow: 4px 4px 0px 0px rgba(131,0,31,1); -moz-box-shadow: 4px 4px 0px 0px rgba(131,0,31,1); box-shadow: 4px 4px 0px 0px rgba(131,0,31,1); color: #ffffff; font-weight: bold; font-size: 18px; padding: 10px 0; border-radius: 10px; }
.floating .dlApp .app .dl div:first-child a { margin-right: 10px; }
.floating .dlApp .app .dl div a:hover { margin-top: 4px; margin-left: 4px; -webkit-box-shadow: 0px 0px 0px 0px rgba(77,0,18,1); -moz-box-shadow: 0px 0px 0px 0px rgba(77,0,18,1); box-shadow: 0px 0px 0px 0px rgba(77,0,18,1); }
.floating .app { border-spacing: 10px; margin-top: 0; }
.floating .app .ico { width: 17%; }
.floating .app .qrcode { width: 17%; }
.floating .app .qrcode img { max-width: 70px; }
.floating .controler { position: absolute; right: 5%; top: -30px; width: 60px; height: 30px; background-color: rgba(176, 9, 49, 0.9); background-image: url("ico_close.png"); background-repeat: no-repeat; border-radius: 10px 10px 0 0; cursor: pointer; }
.floating .controler.active { background-image: url("ico_open.png"); }

@media screen and (max-width: 1224px) {
.img-caption { margin: 5% 0 0 0; width: 70%; float: left; }
#mgmslider .slider { width: 250px; margin-left: 120px; float: left; }
	
}

@media screen and (max-width: 600px) {
.shop_list .logo img { width: 100%; max-width: 55px; }
	
}

@media screen and (max-width: 1000px) {
    .bocpay { padding: 0 10px; }
	.shop_list .logo { width: 25%; padding-left: 5%; }
    .leadin { padding: 20px 0px 20px; }
}

@media screen and (max-width: 768px) {
}

@media screen and (max-width: 767px) {
  /*#banner_inner { background-image: url("banner_bocpay_m.jpg"); }*/
  /**/
  #content { padding-top: 10px; }
  
  .tabs { margin-top: 10px; }
  .tabs a { vertical-align: top; font-size: 16px; padding: 0 5px; }
  .tabs img, .tabs span { display: block; text-align: center; }
  .tabs img { margin: 0 auto; width: 40px; }
  .tabs span { margin-left: 0; margin-top: 5px; }
  .tabs .push { margin: 0; position: absolute; top: 3px; right: 3px; }
  
  .seation-head { top: -27px; left: 0; margin-left: 0; }

  .offset { margin-top: 50px; }
  .offset .tab-body { padding: 15px; }
  .offset .offer2 .tab-body { padding: 0 15px 15px; }
  .offset .tab-head { overflow: hidden; }
  .offset .tab-head img { margin-left: -15px; max-width: 80%; }
  .offset p { font-size: 16px; }
  
  .leadin { padding: 20px 0px 20px; }
  
  .table { display: block; }
  .refund, .monday { display: block; }
  .refund { padding-left: 0; }
  .monday { width: 50%; margin: 20px auto; padding-left: 0; }
  .monday.view_d { display: none; }
  .monday.view_m { display: block; }
  .tips { font-size: 16px; }

  .shop_list { display: block; }
  .shop_list.with_desc { padding-bottom: 0; }
  .shop_list .logo, .shop_list .detail { display: block; padding: 20px 0; }
  .shop_list .logo { width: auto; padding-bottom: 0; padding-left: 0; text-align: center; }
  .shop_list .small_desc { position: relative; bottom: 20px; left: 0; width: 100%; margin-top: 20px; }

  .features { padding: 50px 15px 15px; }
  .feature .list.view_desktop { display: none!important; }
  .feature.view_mob { display: table!important; }
  .f1 .feature { border-bottom: 2px solid #c8c8c8; padding-bottom: 20px; margin-bottom: 20px; }
  .f1 .feature .list:nth-child(2) { border-right: 0; }
  .feature .list { padding: 0 5px; width: 50%; }
  
  .mgm p { font-size: 16px; }
  .mgm p .highlight { font-size: 18px; }
  .blue_table th, .blue_table td { font-size: 16px; }
  #mgmslider { width: auto; margin-bottom: 25px; }
  #mgmslider .slider { margin: 0 auto; float: none; }
  #mgmslider .slider .phone-txt { display: block; }
  .img-caption { float: none; width: 90%; margin: 10px 0px 20px 0px; margin-top: 30px; }


  .img-caption ul li div { margin: 0; margin-top: 20px; }
  .flex-direction-nav .flex-prev { left: -30px!important; }
  .flex-direction-nav .flex-next { right: -30px!important; }

  .fullrow .inline { display: block; width: auto; }
  .fullrow .inline h3 { font-size: 20px; line-height: 20px; width: 100px; margin-left: -50px; }

  .dlApp { margin-right: 0; min-height: auto; }
  .dlApp .app { border-spacing: 10px; margin: 0 auto; }
  .dlApp .app .ico { width: 22%; }
  .dlApp .app .dl { width: 78%; }
  .dlApp .app .qrcode { display: none; }
  .upay { border-radius: 0 0 20px 20px; min-height: auto; margin-top: -20px; padding-top: 10px; }
  .upay .uapp { border-spacing: 10px; }
  .dlApp .app .ico, .upay .uapp .pay, .upay .uapp .payqr, .upay .words { font-size: 12px; }
  
  .floating .welcome { font-size: 12px; line-height: 18px; }
  .floating .welcome strong { font-size: 12px; }
  .floating .dlApp { width: 40%; border-radius: 10px; }
  .floating .app  { border-spacing: 5px; }
  .floating .app .ico { width: 20%; }
  .floating .dlApp .app .dl { width: 50%; }
  .floating .dlApp .app .dl div { display: block; width: 95%; }
  .floating .dlApp .app .dl div a { font-size: 14px; padding: 3px 0; border-radius: 5px; margin-bottom: 5px; }
  .floating .dlApp .app .dl div:first-child a { margin-right: 0; margin-bottom: 8px; }
}

@media screen and (max-width: 320px) {
  #mgmslider .slider { width: 200px;  }
}