﻿@charset "UTF-8";
.m-panel {
	padding-bottom:50px
}
.m-panel-header {
	margin:30px 0
}
.m-panel-header>* {
	display:inline-block;
	height:34px;
	vertical-align:middle
}
.m-panel-header .channel {
	position:relative;
	margin-right:20px;
	padding-top:2px;
	height:44px
}
.m-panel-header .channel i {
	position:absolute;
	top:0;
	left:0;
	display:inline-block;
	width:40px;
	height:44px;
	border:2px solid #222
}
.m-panel-header .channel i:before, .m-panel-header .channel i:after {
	position:absolute;
	bottom:28px;
	z-index:2;
	width:8px;
	background:#ffd900;
	transform:skewX(30deg);
	content:''
}
.m-panel-header .channel i:before {
	left:7px;
	height:20px
}
.m-panel-header .channel i:after {
	left:22px;
	height:9px
}
.m-panel-header .channel p {
	position:relative;
	z-index:2;
	text-align:left;
	line-height:1.3;
	font-weight:bold
}
.m-panel-header .channel .cn {
	padding-left:44px;
	font-size:15px
}
.m-panel-header .channel .en {
	margin-left:12px;
	background:#f3f3f3;
	font-size:13px;
	color:#999
}
.m-panel-header .txt {
	padding-left:10px;
	border-left:2px solid #999;
	font-size:26px;
	color:#999;
	line-height:34px
}
.p-kaifu {
	padding-top:144px;
	background:url(/skin/img/bgkaifu.jpg) no-repeat 50% 0
}
.p-kaifu .calendar {
	position:absolute;
	right:25px;
	top:-119px;
	width:80px;
	text-align:center;
	color:#fff
}
.p-kaifu .calendar .sp1 {
	background:#4ca7e6;
	line-height:22px
}
.p-kaifu .calendar .sp2 {
	background:#288bd2;
	line-height:22px
}
.p-kaifu .calendar .sp3 {
	background:#fff;
	color:#333;
	font-size:32px;
	font-weight:bold;
	line-height:50px
}
.m-tab-hook {
	margin-bottom:20px;
	height:56px;
	background:rgba(40, 40, 40, .85);
	color:#ccc
}
.m-tab-hook p {
	float:right;
	margin:15px 15px 0;
	font-size:15px;
	line-height:26px
}
.m-tab-hook ul {
	float:left
}
.m-tab-hook li {
	position:relative;
	float:left;
	width:150px;
	cursor:pointer;
	line-height:56px;
	font-size:20px;
	text-align:center
}
.m-tab-hook li:hover {
	color:#fff
}
.m-tab-hook li:after {
	position:absolute;
	right:-1px;
	top:50%;
	margin-top:-6px;
	height:12px;
	border-left:1px dotted #575757;
	content:''
}
.m-tab-hook li.active {
	margin-top:-2px;
	line-height:58px;
	background-color:#ffd900;
	font-weight:bold;
	color:#000
}
.m-tab-hook li.active:after {
	left:50%;
	top:auto;
	bottom:0;
	margin:0 0 0 -6px;
	width:0;
	height:0;
	border:6px solid transparent;
	border-bottom-color:#f3f3f3
}
.m-tab-panel .tab-pane {
	display:none
}
.m-tab-panel .tab-pane.active {
	display:block
}
.m-tab-panel .tab-pane table:not(:last-child) {
margin-bottom:15px
}
.m-tab-panel .tab-pane .loading {
	padding:60px 0 40px;
	background:url(/skin/img/g_loading.gif) no-repeat 50% 30px;
	font-size:16px;
	text-align:center;
	color:#999
}
.m-herald {
	position:relative;
	width:100%;
	border:1px solid #ddd;
	background-color:#fff;
	font-size:15px;
	text-align:center;
	box-sizing:content-box
}
.m-herald thead {
	background:#f0f0f0;
	color:#444
}
.m-herald thead th {
	height:40px;
	font-weight:normal;
	border:1px solid #ddd
}
.m-herald td {
	padding:6px;
	border:1px solid #eee
}
.m-herald thead th:nth-child(1), .m-herald thead th:nth-child(3) {
width:120px
}
.m-herald thead th:nth-child(2) {
width:180px
}
.m-herald thead th:nth-child(4), .m-herald thead th:nth-child(7) {
width:100px
}
.m-herald thead th:nth-child(6) {
width:130px
}
.m-herald tbody tr:nth-child(even) {
background:#fcfcfc
}
.m-herald tbody tr:hover {
	background:#f8f8f8
}
.m-herald tbody.z-today tr {
	background:#fff9d1
}
.m-herald tbody.z-today tr td {
	border-color:#ffe999
}
.m-herald tbody.z-today tr:nth-child(even) {
background:#fffbdd
}
.m-herald tbody.z-today tr:hover {
	background:#fffdee
}
.m-herald tbody.z-now tr, .m-herald tbody tr.z-now {
	background:#fff690!important
}
.m-herald tbody.z-now tr td, .m-herald tbody tr.z-now td {
	border-color:#f7d15f!important
}
.m-herald tbody.z-now tr:hover, .m-herald tbody tr.z-now:hover {
	background:#fffabe!important
}
.m-herald tbody.z-now td:nth-child(1) {
font-weight:bold;
color:#ca3014
}
.m-herald tbody.z-top tr, .m-herald tbody tr.z-top {
	background:#c1f2ff!important
}
.m-herald tbody.z-top tr td, .m-herald tbody tr.z-top td {
	border-color:#99d8ec!important
}
.m-herald tbody.z-top tr:hover, .m-herald tbody tr.z-top:hover {
	background:#d6f6ff!important
}
.m-herald tbody tr:last-child {
	border-color:#ddd
}
.m-herald p {
	margin:auto;
	max-width:420px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap
}
.m-herald .z-hot {
	padding-left:18px;
	background:url(/skin/img/g_hot.gif) no-repeat 0 50%
}
.m-herald .top-label {
	position:relative;
	display:inline-block;
	width:80px;
	background:#ed3340;
	line-height:26px;
	color:#fff;
	text-align:center;
	border-radius:5px
}
.m-herald .top-label:before {
	position:absolute;
	top:50%;
	right:-8px;
	margin-top:-4px;
	border:4px solid transparent;
	border-left-color:#ed3340;
	content:''
}
.m-herald .first {
	display:inline-block;
	width:68px;
	background:#197fe3;
	line-height:26px;
	font-weight:bold;
	color:#fff;
	text-align:center;
	border-radius:5px
}
.m-herald .diode {
	display:block;
	font-size:0;
	text-align:center
}
.m-herald .diode em {
	display:inline-block;
	margin:0 2px;
	width:24px;
	background:#d2d2d2;
	line-height:24px;
	text-align:center;
	font-size:15px;
	font-weight:bold;
	color:#fff;
	border-radius:5px
}
.m-herald .diode em.act.active {
	background:#97c516
}
.m-herald .diode em.gift.active {
	background:#ff5400
}
.m-herald .btn-start {
	display:inline-block;
	width:81px;
	height:32px;
	background:url(/skin/img/g_btnborder.gif) no-repeat;
	line-height:30px;
	color:#ff2352
}
.m-herald .btn-start:hover {
	background:#ff2352;
	color:#fff;
	text-decoration:none
}
.p-best {
	padding-top:160px;
	background:url(/skin/img/bgbest.jpg) no-repeat 50% 0
}
.p-best .m-prod-wrapper ul {
	overflow:hidden;
	margin:0 0 -40px -40px
}
.p-best .m-prod-wrapper li {
	float:left;
	width:50%;
	margin-bottom:40px;
	padding-left:40px
}
.m-efficacy-box {
	position:relative;
	display:block;
transition:.3s ease
}
.m-efficacy-box .figure {
	position:relative;
	display:block;
	padding-bottom:53.4482758620%;
	height:0;
	overflow:hidden;
}
.m-efficacy-box .figure:after {
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:rgba(0, 0, 0, .15);
	content:'';
transition:.3s ease
}
.m-efficacy-box .figure img.cover {
	position:absolute;
	height:100%;

	overflow:hidden;

}
.m-efficacy-box .tile {
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	z-index:5;
	padding:5px 190px 0 115px;
	height:80px;
	background:hsla(0, 0%, 100%, .9);
transition:.3s ease
}
.m-efficacy-box .tile .icon {
	position:absolute;
	left:20px;
	bottom:15px;
	width:80px;
	height:80px;
	border-radius: 10px;
}
.m-efficacy-box .tile>h3 {
	font-size:18px;
	font-weight:bold;
	line-height:32px
}
.m-efficacy-box .tile>p {
	overflow:hidden;
	margin-top:5px;
	color:#909090;
	white-space:nowrap;
	text-overflow:ellipsis
}
.m-efficacy-box .server {
	position:absolute;
	right:0;
	bottom:0;
	z-index:10;
	padding-top:13px;
	width:160px;
	height:90px;
	background:#ffd900;
	color:#111;
	text-align:center;
	font-size:12px
}
.m-efficacy-box .server:before {
	position:absolute;
	left:-30px;
	top:0;
	border:solid transparent;
	border-width:0 0 90px 30px;
	border-bottom-color:#ffd900;
	content:''
}
.m-efficacy-box .server .btn {
	display:block;
	margin:10px auto 0;
	width:100px;
	background:#333;
	color:#fff;
	font-weight:bold;
	line-height:32px;
	border-radius:50px
}
.m-efficacy-box .server .btn:hover {
	background:#610c82
}
.m-efficacy-box .server:hover {
	text-decoration:none
}
.m-efficacy-box:hover {
	box-shadow:1px 6px 9px rgba(28, 28, 28, .2)
}
.m-efficacy-box:hover .tile {
	background:#fff
}
.m-efficacy-box:hover .figure:after {
	background:rgba(0, 0, 0, 0)
}
.m-efficacy-box:hover .server .btn {
	background:#000
}
.p-coupon {
	padding-top:164px;
	background:url(/skin/img/bgcoupon.jpg) no-repeat 50% 0
}
.p-coupon .m-tab-hook {
	margin-bottom:40px
}
.p-coupon .m-prod-wrapper ul {
	overflow:hidden;
	margin:0 0 -10px -30px
}
.p-coupon .m-prod-wrapper li {
	float:left;
	margin-bottom:30px;
	padding-left:30px;
	width:25%
}
.m-coupon-item .figure {
	padding-bottom:62%
}
.m-coupon-item .award {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	z-index:10;
	padding:8px 15px;
	background:rgba(0, 0, 0, .6);
	color:#fc0
}
.m-coupon-item .tile {
	position:relative;
	padding:6px 15px;
	height:auto;
	background:#fff;
transition:.3s ease
}
.m-coupon-item label {
	color:#999
}
.m-coupon-item .timer {
	margin-top:5px;
	line-height:32px
}
.m-coupon-item .timer span {
	font-weight:bold;
	font-size:17px;
	color:#f30
}
.m-coupon-item .btnbar {
	font-size:0;
	border-top:1px solid #f3f3f3;
	background:#fff
}
.m-coupon-item .btnbar .btn {
	display:inline-block;
	width:50%;
	font-size:15px;
	line-height:42px
}
.m-coupon-item .btnbar .btn:hover {
	background:#ffd900;
	color:#000
}
.m-coupon-item .btnbar .btn:not(:last-child) {
border-right:1px solid #f3f3f3
}
.ts-bold {
	font-weight:bold
}
