﻿@charset "utf-8";
*{ margin:0; padding:0; border:0;}
body{font-size:12px; margin:0 auto; border:0 none;padding:0px; color:#666; font-family:arial; background:#fff;}
ul, ol{list-style:none;}
a{text-decoration:none;border:none; color:#666; transition:all 0.2s ease-in-out;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;}
img{border:none; margin:0; padding:0; font-size:0;vertical-align: bottom;}
h1{ text-align:center;}

/*底部开始*/
.logoz{ position:fixed; left:0; top:350px; z-index:99999;}
.logoz a{ display:block;}
.foot{ background:#fff; width:100%;}
.foot p{ margin:0 auto; text-align:center; font-size:1.2em; line-height:24px; padding:20px 0;}

.header {background:none repeat scroll 0 0 #FFFFFF;border-bottom:5px solid #000000;height:65px;left:0;padding-top:1em;top:0;width:100%;font-size:1em;z-index:2000;overflow:hidden; position:relative;}
.header_content {margin:0 auto; width:1200px; position:relative;}
.header_content .logo {float:left;width:355px;}
.header_content .logo img {height:51px;width:340px;}
.header_content .header_nav {float:left;width:500px;}
.header_content .header_nav ul {border-left:1px solid #CCCCCC;display:block;height:30px;line-height:30px; margin-top:12px;}
.header_content .header_nav ul li {display:block;float:left;height:30px;vertical-align:bottom;}
.header_content .header_nav ul li a {background:url(https://img.banggood.com/deals/images/arrow.png) no-repeat scroll 0 9px rgba(0, 0, 0, 0);color:#FF6633;display:block;padding:0 7px 0 20px;}
.header_content .header_nav ul li a.one {background:none;color:#333333;}
.header_content .header_nav ul li a:hover {color:#333333;text-decoration:underline;}
.header_content .share { position:absolute; right:0; top:12px;}
.header_content .share a {display:block;float:left;padding-left:6px;}
.header_content .share img {height:30px;width:30px;}

.main{ width:100%; background:#424a7b;}
.main_ban_bg{ width:100%; background:url(https://img.banggood.com/deals/edm/topic/coupondeals160601/coupondealsbanner-bg.jpg) top center no-repeat;}
.main_ban{ margin:0 auto; width:100%; max-width:1200px;}
.main_ban img, .main01 p img, .main02_img img{ width:100%;}
.main_nav_info{ width:100%; z-index:1000;}
.main_nav{ width:100%; max-width:1200px; margin:0 auto; padding:10px 0; border-bottom:1px solid #666; margin:0 auto; background-color: #424a7b;}
.main_nav p{ font:bold 20px/36px arial; float:left; width:24.7%; text-align:center; }
.main_nav p a{ color:#FFF; background:#248edc; display:block;}
.main_nav p a:hover{ background:#CCC;}
.main_nav_lac{ margin:0 0.4% 0 0;}

.main01{ width:100%; max-width:1200px; margin:0 auto; padding:10px 0;}
.main01_pro{ background:#eeeeee; margin:10px 0;}
.main01_pro:hover{ background:#FFF; box-shadow:0 0 0 3px #eee;}
.main01_img{ width:30%; padding:1% 10%; float:left;}
.main01_img img{ width:100%}
.main01_info{ width:50%; float:left; padding:1% 0; font-family arial;}
.main01_name{ font:22px/26px arial; width:80%; height:52px; overflow:hidden; padding-top:5%;}
.main01_name a{color:#000; }
.main01_name a:hover,.main02_name a:hover, .main03_name a:hover{ text-decoration:underline;}
.main01_price{ font-size:18px; padding:3% 0; color:#ee8100;}
.main01_price b{ font-size:30px;}
.main01_dt{ font-size:16px; line-height:24px; color:#605f5f; width:94%;}
.main01_cp{ background:#248EDC; width:60%; font-size:20px; font-weight:bold; color:#FFF; text-align:center; margin:3% 0 0 0; padding:1% 0;}

.main02_price a:hover, .proprice01 a:hover{ background:#ffb535; text-decoration:none; color:#000;}

.main02, .main03{ width:100%; max-width:1200px; margin:0 auto;}
.nav_02{ width:100%; font:bold 24px/40px arial; color:#fff; text-align:center; margin:0 0 0.8% 0;}
.main02_info{ background:#e5e5e5; width:100%; margin:0 auto 1%;}
.main02_info:hover{ background:#FFA200;}
.main02_info:hover .main02_banner{ opacity:1;}
.main02_info:hover .main02_off{ color:#FFF;}
.main02_banner{ width:58.4%; float:left; opacity:0.8;}
.main02_banner img{ width:100%;}
.main02_content{ width:41.6%; float:left; font-family:arial; text-align:center; font-size:18px; font-weight:bold; color:#000;}
.main02_off{ font-size:56px; font-weight:bold; color:#000; padding:4% 0 1%; padding-top:10%;}
.main02_off span{font-size:14px;}
.main_02cp{ background:#000; color:#FFF; width:70%; margin:1% auto; line-height:30px;}

.nav_03{ width:100%; font:bold 24px/40px arial; color:#000; text-align:center; margin:0 0 0.8% 0;}
.main03 li{ width:24%; padding:3% 0.8% 1%; background:#F0F0F0; float:left; margin:.5%; position:relative; box-sizing: border-box;}
.main03 li p{ text-align:center;}
.main03_lac{ margin:0 0.8% 0 0;}
.proimg{ width:98.6%; margin:0 auto;transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;-ms-transition:all 0.5s ease-in-out;}
.proimg img{ width:100%;}
.proname{font:14px/20px arial; height:38px; overflow:hidden; text-overflow :ellipsis; padding:2% 1%;}
.proname a{ color:#000;}
.proprice01{ font:bold 24px/36px arial; color:#FFF; background:#FFA200; display:block;}
.proprice01 b{ font-size:14px; font-weight:100;}
.main03 li:hover{ background:#fff;  box-shadow:0 0 0 3px #56b7fa;}
.main03 li:hover .proimg{transform:scale(0.95);}
.main03_coupon{font:18px/30px arial; background:#2396d9; color:#fff; position:absolute; top:0; left:0; display:block; width:100%; text-align:center;}
.main05_bn{ width:100%; max-width:1200px; margin:0 auto;padding-bottom: 2%;}
.main05_bn p{ display:block; float:left; margin:1% .7%; width:48%;}
.main05_bn p:hover{ box-shadow:0 0 0 3px #56b7fa;}
.main05_bn p img{ width:100%;}
.main05_bn:after{content:''; display:block; clear:both;}

.main_time{ background:#242625; width:100%;}
.count_time{ width:100%; max-width:1200px; margin:0 auto; padding:2% 0 0 0;}
.time_name{ width:40%; float:left;font:36px/50px arial; text-align:center; color:#FFF;}
#countdown{ width:60%; float:left;}
.clean{ clear:both; width:0; height:0;}
.main03 li .proprice01{text-align:center;}
.main03 .procoupon{background:#56b7fa;font:1rem/1.8rem arial; color:#fff;position:absolute;width:100%;top:0;left:0;}
.proprice01 .pronewprice u{text-decoration:none;}

.main01_shop{background:#ee8100; color:#fff; width:30%; font:1.6em/1.4em arial; text-align:center;margin-top:2%; transition:.2s ease;}

.main01_pro:hover .main01_shop{transform:translateX(10px);}

@media screen and (max-width:1200px) {
	
	
	.main03_name{ height:40px; overflow:hidden;text-overflow :ellipsis;}
	}
@media screen and (max-width:1000px) {
	.main01_img{ width:38%; padding:1% 6%;}
	}
@media screen and (max-width:900px) {
	.main01_cp{ width:80%;}
	.main_nav{ padding:1% 0;}
	.main_nav p{ font:bold 16px/30px arial;}
	
	
	}
@media screen and (max-width:830px) {
	.nav_02 span{ width:35%;}
	.main03_coupon{font:14px/24px arial;}
	.main03 li{width:32%;}
	}	
@media screen and (max-width:768px) {
	.main01_img{ width:44%; padding:1% 3%;}
	.main_nav p{ font-weight:300;}
	.main02_banner{ width:65%;}
	.main02_content{ width:35%;}
	.main02_off{ font-size:46px; padding-top:10%;}
	.main_02cp{font-weight:300; width:100%;}
	}
@media screen and (max-width:550px) {
	.main03 li{width:49%;}
	.main_nav p{width:49%; margin-bottom:.5%;}

}
@media screen and (max-width:425px) {
	.time_name{ width:20%; float:left;font:10px/40px arial;}
	.main01_info{ width:98%; font:16px/24px arial;}
	#countdown{ width:80%;}
	.nav_02, .nav_03{font:bold 20px/28px arial;}
	.nav_02 span{ width:100%;font:18px/30px arial;}
	.header,.foot{ display:none;}
	.main_nav_info{ display:none;}
	.main02_banner{ width:100%;}
	.main02_content{ width:100%; font-size:14px;}
	.proprice01 a{ font:bold 18px/24px arial;}
	.main01_img{ width:90%; padding:1% 5%;}
	.main01_dt{ display:none;}
	.main01_info{ width:98%; padding:1%; margin:0 auto; float:none;}
	.main01_name{ width:98%;font:18px/24px arial;}
	.main01_price{ width:60%; margin:0 auto;}
	.main01_cp{ margin:0 auto;}
	.main05_bn p{ display:block; float:left; margin:1% 0 0 0; width:99%;}
	.time_name{ width:80%; margin:0 auto;font:24px/32px arial;}
	#countdown{ width:100%; margin:0 auto;}

	}
@media screen and (max-width:320px) {
	.proprice01 b{display: none;}
	.main03 .procoupon{font-size:.8rem;}
}		

.countdownHolder{
	width:100%;
    max-width:450px;
	margin:0 auto;
	font: 40px/1.5 arial,sans-serif;
	text-align:center;
	letter-spacing:-3px;
}
#countdown > span {
    display: inline-block;
}
.position{
	display: inline-block;
	height: 1.6em;
	overflow: hidden;
	position: relative;
	width: 1.05em;
}

.digit{
	position:absolute;
	display:block;
	width:1em;
	background-color:#444;
	border-radius:0.2em;
	text-align:center;
	color:#fff;
	letter-spacing:-1px;
}
.time-style {
    font-size: 15px;
    letter-spacing: 0px;
    display: block;
    margin-top: -1em;
}
.digit.static{
	box-shadow:1px 1px 1px rgba(4, 4, 4, 0.35);
	
	background-image: linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
	background-image: -o-linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
	background-image: -moz-linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
	background-image: -webkit-linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
	background-image: -ms-linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0.5, #3A3A3A),
		color-stop(0.5, #444444)
	);
}

/**
 * You can use these classes to hide parts
 * of the countdown that you don't need.
 */

.countDays .digit{ 
/* display:none !important;*/ 
	color:#F5FB02 !important;
}
.countDiv0{ /* display:none !important;*/ }
.countHours{}
.countDiv1{}
.countMinutes{}
.countDiv2{}
.countSeconds{}


.countDiv{
	display:inline-block;
	width:16px;
	height:1.6em;
	position:relative;
    top:-0.4em;
}

.countDiv:before,
.countDiv:after{
	position:absolute;
	width:5px;
	height:5px;
	background-color:#444;
	border-radius:50%;
	left:50%;
	margin-left:-3px;
	top:0.5em;
	box-shadow:1px 1px 1px rgba(4, 4, 4, 0.5);
	content:'';
}

.countDiv:after{
	top:0.9em;
}

@media screen and (max-width:460px) {
    .countdownHolder {
        font-size: 26px;
    }

    #countdown {
        top: 5.5em;
        left: 0%;
        margin-left: 0px;
    }

    .time-style {
        margin-top: -0.8em;
    }
    .countDiv {
        top:-0.6em;
    }
}