﻿@charset "utf-8";
/* CSS Document */
body{ font-size: 12px;background:#fff;  }
.w1920{ margin:0 auto;}
.w1920{ max-width: 1920px;background: #f2fcff;}
.banner2{ display: none;}
.w1920 img{ display: block; }
.banner-bg{ background:url(//deal.tomtop.com/activity/201708/20170812_Clearance_BG.jpg) center no-repeat ;}
.height80{ height:80px; width:20px;}
.banner{ position:relative;}
.banner{ position:relative;}
.code{ position:absolute; top:47.2%; left: 38.5%; font-size:44px; color:#44bdf9;}
.code span{display: inline-block; transition: none; text-transform: uppercase;text-indent: -15px; }
.char1{transform: translateX(0px) translateY(-13px) rotate(-25deg);}
.char2{ transform: translateX(0px) translateY(-23px) rotate(-20deg);}
.char3{ transform: translateX(0px) translateY(-30px) rotate(-12deg);}
.char4{ transform: translateX(0px) translateY(-35px) rotate(-10deg);}
.char5{ transform: translateX(0px) translateY(-35px) rotate(0deg);}
.char6{ transform: translateX(0px) translateY(-32px) rotate(8deg);}
.char7{ transform: translateX(0px) translateY(-35px) rotate(10deg);}
.char8{ transform: translateX(0px) translateY(-25px) rotate(14deg);}
.char9{ transform: translateX(0px) translateY(-17px) rotate(20deg);}
.char10{ transform: translateX(0px) translateY(-7px) rotate(27deg);}
.char11{ transform:translateX(0px) translateY(3px) rotate(25deg);}
.nav{width: 100%;position: fixed;bottom: 200px;right:55px;}
 .nav .nav_content {position: relative}
.nav ul li {width: 50px;height: 35px;padding:3px 10px; list-style:none;position: absolute;right: -42px;cursor: pointer;background: #b4b4b4;}
.nav ul li img {width: 100%}
.nav ul li:hover {background: #646464;}
.nav ul .nav_top {bottom: 1px;display: none;border-top-left-radius: 4px;border-top-right-radius: 4px;}
.nav ul .nav_bottom {top: 1px;border-bottom-left-radius: 4px;border-bottom-right-radius: 4px;}
/*nav*/
li{ list-style-type:none;}

.bg2{background:#e9faff url(//deal.tomtop.com/activity/201708/20170812_Clearance_BG2.jpg) center top no-repeat ;}
.content{ background: #fff; border:1px solid #d3f0ff; }
.content h1{ font-size: 43px; text-align: center; background: #6bcbfb; color: #fff; padding: 5px 0;}
/*产品*/
.product{ padding:1.2% 0.6%;  }
.product_content{ position:relative;}
.product ul li img{  -webkit-transition: all 0.3s linear;  -moz-transition: all 0.3s linear;  -o-transition: all 0.3s linear;  transition: all 0.3s linear;  transform: scale(1);  -o-transform: scale(1);  -moz-transform: scale(1);  -webkit-transform: scale(1);  -ms-transform: scale(1);
	max-width:100%;}
.product ul li img{ max-width:100%;}
.product_price {  width: 100%;  line-height: 24px;  font-size:27.39px;  color: #e34730;  text-decoration: none;  text-align: center;}
.product_price p {  font-size:17.45px;  color: #282828;  padding-right: 2px;text-decoration: line-through;display: inline-block;}

.product_discount{
font-size: 18px;  color: #e1021a;line-height: 10px;  position: absolute; top: 0%; right: 3%;  width: 55px;  height: 55px;  color: #FFF; background: #e39f45; display: none;
  border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -webkit-border-radius: 100px;}	
.zk01{font-size: 20px;line-height: 25px;display: inline-block;font-weight: bold;margin-top:9px;}
.chi{overflow: hidden;  text-overflow: ellipsis;  -o-text-overflow: ellipsis;  -webkit-text-overflow: ellipsis;  -moz-text-overflow: ellipsis;  white-space: nowrap;
	height: 32px;
	display: block;
	padding:0 10px;
	font-size: 14px;
}

.product ul li{  
    display: block;
    float: left;
    position: relative;
    width: 32.111%;
    text-align: center;
    background: #fff;
    margin:0.6% 0.6% 0.6% 0.6%;
    padding-bottom: 2%;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
	border:#CCC solid 1px;
	}
.product ul li img{display: block; }
.product ul li img:hover,.I2061-ZT img:hover,.piright-le img:hover{ transform:scale(1.1); -moz-transform:scale(1.1); -ms-transform:scale(1.1); -webkit- transform:scale(1.1);}
.product_content:hover a{ color:#F00;}
.product ul li:hover{/*border:#6a6a6a 1px solid;*/}
.product_content:hover .product_buy a{ color:#fff;}
.product ul li .product_img a{ display:block;}
.product ul li a h4{ font-size:14px; font-weight:100; line-height:20px; display:block; padding-bottom:15px; }
.product .product_title a{ color: #000;font-size:16.91px;}
.product_title{
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    line-height: 19px;
    font-weight: 100;
    height: 21px;
    margin:5px auto 7px auto;
    text-align: center;
}
.product_buy {text-align: center;margin-top:5%;}
.product_buy a {
    color: #FFF;
    text-align: center;
    padding: 2px 10px;
    font-size: 14.58px;
    background: #262333;
    padding: 5px 7%;
    border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    -o-border-radius: 7px;
    -ms-border-radius: 7px;
}
.product_buy a:hover{background: #4a4a4a; }

.prozy10{ padding:10px 10px 20px 10px; }
.product_img { overflow: hidden; height:262px; background: #fff url(//www.tomtop.com/activity/images/edm/20160621_loading.gif) no-repeat 50% 50%; margin:4.5% 4.5% 4% 4.5%;}
.xj01{ font-weight:bold;}


@media(max-width:1200px){
    .nav_content{ display: none;}
	}

@media(min-width:1000px) and (max-width:1200px){
    .bg2 .W1200,.W1200{ max-width: 950px;}
    .banner-bg { background-size: 1519px;}
    .product_img{ height: 205px;}
    .code{ position:absolute; top:48%; left: 38%; font-size:38px; color:#44bdf9;}
.code span{display: inline-block; transition: none; text-transform: uppercase;text-indent: -14px; }

	}
@media(min-width:768px) and (max-width:1000px){
    .bg2 .W1200,.W1200{ max-width: 750px;}
    .banner-bg { background-size: 1202px;}
    .product_img{ height: 160px;}
    .code{ position:absolute; top:48%; left: 38.3%; font-size:26px; color:#44bdf9;}
    .code span{display: inline-block; transition: none; text-transform: uppercase;text-indent: -8px; }
    .char1{transform: translateX(0px) translateY(-8px) rotate(-10deg);}
.char2{ transform: translateX(0px) translateY(-15px) rotate(-0deg);}
.char3{ transform: translateX(0px) translateY(-19px) rotate(-8deg);}
.char4{ transform: translateX(0px) translateY(-20px) rotate(-2deg);}
.char5{ transform: translateX(0px) translateY(-21px) rotate(0deg);}
.char6{ transform: translateX(0px) translateY(-21px) rotate(1deg);}
.char7{ transform: translateX(0px) translateY(-22px) rotate(5deg);}
.char8{ transform: translateX(0px) translateY(-18px) rotate(10deg);}
.char9{ transform: translateX(0px) translateY(-13px) rotate(15deg);}
.char10{ transform: translateX(0px) translateY(-10px) rotate(19deg);}
.char11{ transform:translateX(0px) translateY(-4px) rotate(22deg);}
	}
@media(max-width:768px){
      .bg2 .W1200,.W1200{ max-width: 750px;}
    .banner-bg { background-size: 1202px;}
    .product_img{ height: 160px;}
    .code{ position:absolute; top:48%; left: 38.3%; font-size:26px; color:#44bdf9;}
    .code span{display: inline-block; transition: none; text-transform: uppercase;text-indent: -8px; }
    .char1{transform: translateX(0px) translateY(-8px) rotate(-10deg);}
.char2{ transform: translateX(0px) translateY(-15px) rotate(-0deg);}
.char3{ transform: translateX(0px) translateY(-19px) rotate(-8deg);}
.char4{ transform: translateX(0px) translateY(-20px) rotate(-2deg);}
.char5{ transform: translateX(0px) translateY(-21px) rotate(0deg);}
.char6{ transform: translateX(0px) translateY(-21px) rotate(1deg);}
.char7{ transform: translateX(0px) translateY(-22px) rotate(5deg);}
.char8{ transform: translateX(0px) translateY(-18px) rotate(10deg);}
.char9{ transform: translateX(0px) translateY(-13px) rotate(15deg);}
.char10{ transform: translateX(0px) translateY(-10px) rotate(19deg);}
.char11{ transform:translateX(0px) translateY(-4px) rotate(22deg);}  
.content h1 {
    font-size: 27px;
    padding: 3px 0;
}     
}
@media(min-width:360px) and (max-width:550px){
   .W1200{ max-width: 360px;}  
    .banner-bg { background-size: 577px;}
    .bg2 .W1200{ max-width: 100%;}    
    .code{ position:absolute; top:46.8%; left: 37.9%; font-size:12px; color:#44bdf9;}
    .code span{display: inline-block; transition: none; text-transform: uppercase;text-indent: -3px; }
    .char1{transform: translateX(0px) translateY(0px) rotate(-20deg);}
.char2{ transform: translateX(0px) translateY(-4px) rotate(-15deg);}
.char3{ transform: translateX(0px) translateY(-6px) rotate(-8deg);}
.char4{ transform: translateX(0px) translateY(-7px) rotate(0deg);}
.char5{ transform: translateX(0px) translateY(-8px) rotate(5deg);}
.char6{ transform: translateX(0px) translateY(-7px) rotate(8deg);}
.char7{ transform: translateX(0px) translateY(-7px) rotate(15deg);}
.char8{ transform: translateX(0px) translateY(-5px) rotate(15deg);}
.char9{ transform: translateX(0px) translateY(-2px) rotate(20deg);}
.char10{ transform: translateX(0px) translateY(0px) rotate(25deg);}
.char11{ transform:translateX(0px) translateY(4px) rotate(29deg);}     
    
.content h1 {font-size: 22px; padding: 3px 0;}   
.product_img {height:inherit;} 
.product .product_title a {font-size: 12px;} 
.product_title {
    line-height: 15px;
    height: 29px;
    margin: 0px auto 0px auto;
    padding: 0 5px;
}  
.product_price p { font-size: 12px;}  
.product_price { line-height: 24px; font-size: 14px;}
.product_buy a {padding: 2px 10px;font-size: 12px;padding: 1px 7%;}  
.product_buy {margin-top: 0%;}  
.height80{ height: 40px;}
.product_img{ background-size:50px;}	
}
@media(max-width:440px){.product_img {height:inherit; min-height:90px;} .height80{ height: 40px;}}
@media(max-width:420px){.product_img {height:inherit; min-height:86px; }}
@media(max-width:400px){.product_img {height:inherit; min-height:80px; }}
@media(max-width:380px){
    .product_img {height:inherit; min-height:75px; }
.product_img {height:inherit; }     
   .W1200{ max-width: 360px;}  
    .banner-bg { background-size: 577px;}
    .bg2 .W1200{ max-width: 100%;}    
    .code{ position:absolute; top:46.8%; left: 37.9%; font-size:12px; color:#44bdf9;}
    .code span{display: inline-block; transition: none; text-transform: uppercase;text-indent: -3px; }
    .char1{transform: translateX(0px) translateY(0px) rotate(-20deg);}
.char2{ transform: translateX(0px) translateY(-4px) rotate(-15deg);}
.char3{ transform: translateX(0px) translateY(-6px) rotate(-8deg);}
.char4{ transform: translateX(0px) translateY(-7px) rotate(0deg);}
.char5{ transform: translateX(0px) translateY(-8px) rotate(5deg);}
.char6{ transform: translateX(0px) translateY(-7px) rotate(8deg);}
.char7{ transform: translateX(0px) translateY(-7px) rotate(15deg);}
.char8{ transform: translateX(0px) translateY(-5px) rotate(15deg);}
.char9{ transform: translateX(0px) translateY(-2px) rotate(20deg);}
.char10{ transform: translateX(0px) translateY(0px) rotate(25deg);}
.char11{ transform:translateX(0px) translateY(4px) rotate(29deg);} 
    
.content h1 {font-size: 22px; padding: 3px 0;}   

.product .product_title a {font-size: 12px;} 
.product_title {
    line-height: 15px;
    height: 29px;
    margin: 0px auto 0px auto;
    padding: 0 5px;
}  
.product_price p { font-size: 12px;}  
.product_price { line-height: 24px; font-size: 14px;}
.product_buy a {padding: 2px 10px;font-size: 11px;padding: 1px 7%;}  
.product_buy {margin-top: 0%;}

}
@media(max-width:350px){

    .product ul li{ width: 48%; margin: 1%;}    
}