﻿@media screen and (max-width: 920px) {
	.nav {
		position: relative;
		min-height: 66px;
		width: 100%;
		height: auto;
	}	
	.nav ul {
		width: 100%;
		padding: 0px 0;
		position: absolute;
		top: 0;
		left: 0;
		background: rgba(20, 158, 18, 0.85) url(../res/upload/images/interface.png) no-repeat 95% 21px;
		z-index: 10;
	}
	.nav li {
		display: none; /* hide all <li> items */
		margin: 0;
		padding: 18px 10px 18px 10px;
		border-bottom: 1px solid #737373;
	}
	.nav .current {
		display: block; /* show only current <li> item */
		background: transparent;
	}
	.nav a {
		display: block;
		padding: 5px 5px 5px 32px !important;
		text-align: left;
	}
	.nav  .current a {
		padding: 5px 5px 5px 32px !important;
	}
	.nav .current a {
		background: none;
		color: #fff;
		margin-right: 50px;
	}
	/* on nav hover */
	.nav ul:hover {
		background-image: none;
	}
	.nav ul:hover li {
		display: block;
		margin: 0 0 0px;
	}
	.nav ul:hover .current {
		background: url(../res/upload/images/check.png) no-repeat 95% 19px;
	}

	/* right nav */
	.nav.right ul {
		left: auto;
		right: 0;
	}

	/* center nav */
	.nav.center ul {
		left: 50%;
		margin-left: -90px;
	}
	
}

@media all and (min-width: 981px) and (max-width: 1155px){
	#wrapper {
    width: 100%;
	}
	#header{
	width: 100%;
	}
	#top-menu {
    width: 200px;
	}
	#navi-menu ul {
    width: 100%;
	}
	#navi-menu ul li a {
    padding: 16px 28px 20px 28px;
	}
	#slider {
    width: 100%;
	}
	.o-product ul li {
    width: 31%;
	}
	#contact-co {
    overflow: hidden;
    float: none;
    width: 65%;
    margin: 0px auto;
	}
	#contact-co-left {
    float: left;
    width: 93%;
	}
	#contact-co-right {
    float: left;
    width: 93%;
    font-size: 12px;
    padding-left: 0px;
	}
	#maps img{
	max-width:100%;
	}
	#copyright {
	width:100%;
	}
	#sidebar {
    float: left;
    width: 20%;
	}
	#menu-poduct li a {
    float: left;
    width: 89%;
    background: #ff8d00 url(../res/upload/images/m-down.png) no-repeat 89% center;
    color: #fff;
    padding: 5px 10px;
	}
	.pro-content {
    width: 79%;
	}
	#cat-product li {
    float: left;
    width: 31.6%;
	height: auto;
	}
	#cat-product li .mask {
    top: 0px;
    background: rgba(146, 146, 146, 0.5);
    width: 91%;
    height: 35%;
	padding: 50px 10px 35px 10px;
	}
	.acc-change-center {
    width: 65%;
	}
	.order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 61% !important;
	}
	#pro-img #big-image img{
		width:100%;
	}
	#pro-short {
    float: left;
    width: 47%;
	}
	body.account .order-subm-center .val-subm{
    width: 14% !important;
	}
	.hinfoco {
    padding: 20px 30px 40px 30px !important;
	}
	.foot-content h3 {
    font-size: 15px;
	}
	.post-content {
	padding: 0px 15px 15px 15px;
	}
}

@media all and (min-width: 768px) and (max-width: 980px) {
	#head-title{
	width:100%;
	}
	#slider .owl-controls .owl-dots {
    left: 40%;
	}
	#head-logo {
    width: 60%;
    margin: 0px auto;
	padding-bottom: 20px;
	}
	#wrapper {
    width: 100%;
	}
	#header{
	width: 100%;
	height:auto;
	}
	#logo img{
	width: 35%;
	}
	#cart {
    width: 200px;
	}
	#top-menu {
    width: 200px;
	}
	#navi-menu ul {
    width: 100%;
	}
	#navi-menu ul li a {
    padding: 16px 13px 20px 13px;
	}
	#slider {
    width: 100%;
	}
	#halo-sing {
    position: absolute;
    left: 15px;
    bottom: 10px;
    width: 80px;
	}
	#hotline {
    position: absolute;
    right: 10px;
    bottom: 83px;
    width: 145px;
	}
	#hotline1 {
    position: absolute;
    right: 10px;
    bottom: 45px;
    width: 145px;
	}
	#hotline2 {
    position: absolute;
    right: 10px;
    bottom: 12px;
    width: 145px;
	}
	#search {
    right: 16px;
    top: 15px;
    width: 135px;
	}
	.o-product ul li {
    width: 30%;
	}
	.o-product ul li span{
	font-size: 15px;
	}
	#contact-co {
    overflow: hidden;
    float: none;
    width: 65%;
    margin: 0px auto;
	}
	#contact-co-left {
    float: left;
    width: 93%;
	}
	#maps img{
	max-width:100%;
	}
	#contact-co-right .form-inp input,
	#contact-co-right .form-inp textarea	{
    width: 73%;
	}
	#checkcp input{
    width: 97% !important;
	margin-left: 0px !important;
	}
	#contact-co-right #val-cor {
    float: right;
    width: 100%;
	}
	.foot-content ul.cate li {
    float: left;
    width: 100%;	
	}
	.foot-content:first-child {
    float: left;
    width: 17%;
	}
	.foot-content {
    float: left;
    width: 30%;
	}
	.foot-content +.foot-content +.foot-content {
	width: 36%;
	padding-left: 0px;
	}
	.foot-content+.foot-content +.foot-content +.foot-content  {
    float: left;
    width: 17%;
	}
	.qrcodef img {
    max-width: 100%;
}
	#sidebar {
    float: left;
    width: 30%;
	}
	#menu-poduct li a {
    float: left;
    width: 88%;
    background: #ff8d00 url(../res/upload/images/m-down.png) no-repeat 88% center;
    color: #fff;
    padding: 5px 10px;
	}
	.pro-content {
    width: 67%;
	}
	#cat-product li {
    float: left;
    width: 100%;
    height: auto;
	}
	#cat-product li .mask{
    float: left;
    width: 96%;
    height: 65%;
	padding:20% 2% 0px 2%;
	}
	h3.h-title {
    font-size: 30px;
	}
	.acc-change-center {
    width: 70%;
	}
	.order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 70% !important;
	}
	.your-list .form-inp input {
    padding: 5px 9px;
    float: left;
    width: 56%;
	}
	body.register .order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 91% !important;
	}
	body.register .order-subm-center #val-cor #in-code {
    font-size: 20px;
    float: left;
    width: 28%;
	}
	.order-subm-center #in-change {
    width: 100%;
	}
	#check-agree {
    width: 80%;
	}
	#con-mess {
    width: 95%;
	}
	body.account .order-subm-center .val-subm {
    width: 20% !important;
	}
	#photo-slide #photo-slide-c {
    width: 100%;
	}
	#photo-slide {
    text-align: center;
	}
	#call-phone {
    float: none;
    width: 30%;
	}
	#videos h3{
	text-align:center;
	}
	.modal-open .modal {
    padding-left: 0px !important;
	}
	#contact-co-right .form-inp label {
    float: left;
    width: 22%;
	}
	#contact-co-right .form-inp input.in-sub{
        width: 155px;
	}
	#contact-co-right {
    padding-left: 0px;
	}
	#map-contact {
    overflow: hidden;
    width: 100%;
    height: 300px;
	}
	#map-contact  iframe{
		height: 100% !important;
	}
	.finfo:first-child {
    float: left;
    width: 43%;
	}
	.finfo:last-child {
    float: left;
    width: 13%;
	}
	.post-content {
	padding: 0px 15px 15px 15px;
	}
	.post-avil {
    float: left;
    width: 40%;
	}
	.post-excep {
    margin-bottom: 5px;
	}
	.hinfoco {
    padding: 20px 10px 40px 20px !important;
	}
}

@media all and (min-width: 605px) and (max-width: 767px) {
	#checkcp input{
    width: 95.5% !important;
	margin-left: 0px !important;
	}
	#checkcp {
    float: right;
    width: 78.5%;
	}
	#head-title{
	width:100%;
	}
	#slider .owl-controls .owl-dots {
    left: 40%;
	}
	#head-logo {
    width: 50%;
    margin: 0px auto;
	padding-bottom: 20px;
	}
	#slider .owl-controls .owl-dots {
    left: 40%;
	}
	#wrapper {
    width: 100%;
	}
	#header{
	width: 100%;
	height:auto;
	}
	#logo img{
	width: 35%;
	}
	#cart {
    width: 200px;
	}
	#top-menu {
    width: 200px;
	}
	#navi-menu ul {
    width: 100%;
	}
	#navi-menu ul li a {
    padding: 16px 13px 20px 13px;
	}
	#slider {
    width: 100%;
	}
	#halo-sing {
    position: absolute;
    left: 15px;
    bottom: 10px;
    width: 80px;
	}
	#hotline {
    position: absolute;
    right: 10px;
    bottom: 63px;
    width: 100px;
	}
	#hotline1 {
    position: absolute;
    right: 10px;
    bottom: 35px;
    width: 100px;
	}
	#hotline2 {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 100px;
	}
	#search {
    right: 12px;
    top: 6px;
    width: 135px;
	}
	.o-product ul li {
    width: 30%;
	}
	.o-product ul li span{
	font-size: 15px;
	}
	#contact-co {
    overflow: hidden;
    float: none;
    width: 65%;
    margin: 0px auto;
	}
	#contact-co-left {
    float: left;
    width: 93%;
	}
	#maps img{
	max-width:100%;
	}
	#contact-co-right .form-inp input,
	#contact-co-right .form-inp textarea	{
    width: 75%;
	}
	#contact-co-right #val-cor {
    float: right;
    width: 100%;
	}
	.foot-content ul.cate li {
    float: left;
    width: 100%;	
	}
	.foot-content {
    float: left;
    width: 50%;
	height: 270px;
	}
	.foot-content +.foot-content +.foot-content {
	width: 50%;
	padding-left: 0px;
	}
	#sidebar {
    float: left;
    width: 30%;
	}
	#menu-poduct li a {
    float: left;
    width: 88%;
    background: #ff8d00 url(../res/upload/images/m-down.png) no-repeat 88% center;
    color: #fff;
    padding: 5px 10px;
	}
	.pro-content {
    width: 67%;
	}
	#cat-product li {
    float: left;
    width: 100%;
    height: auto;
	}
	#cat-product li .mask{
    float: left;
    width: 96%;
    height: 65%;
	padding:20% 2% 0px 2%;
	}
	h3.h-title {
    font-size: 30px;
	}
	.acc-change-center {
    width: 70%;
	}
	.order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 70% !important;
	}
	.your-list .form-inp input {
    padding: 5px 9px;
    float: left;
    width: 56%;
	}
	body.register .order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 91% !important;
	}
	body.register .order-subm-center #val-cor #in-code {
    font-size: 20px;
    float: left;
    width: 28%;
	}
	.order-subm-center #in-change {
    width: 100%;
	}
	#check-agree {
    width: 80%;
	}
	#con-mess {
    width: 95%;
	}
	body.account .order-subm-center .val-subm {
    width: 20% !important;
	}
	#home-info {
	display: block;
	}
	.hinfo {
    float: left;
    width: 100%;
	}
	.finfo:first-child {
    float: left;
    width: 100%;
	}
	.finfo {
    float: left;
    width: 50%;
	}
	.finfo:last-child {
    float: left;
    width: 100%;
	}
	#photo-slide #photo-slide-c {
    width: 100%;
	}
	#photo-slide {
    text-align: center;
	}
	#call-phone {
    float: none;
    width: 30%;
	}
	#videos h3{
	text-align:center;
	}
	.post-thumb {
    float: left;
    width: 100%;
	margin-left: 0px;
    margin-right: 0px;
	padding: 15px;
	}
	.post-content {
	width: 100%;
	padding: 0px 15px 15px 15px;
	}
	.modal-open .modal {
    padding-left: 0px !important;
	}
	.cinfo {
    float: left;
    width: 100%;
	}
	.cinfo+.cinfo {
    float: left;
    width: 100%;
	}
	#contact-co-right .form-inp label {
    float: left;
    width: 20%;
	}
	#contact-co-right .form-inp input.in-sub{
        width: 155px;
	}
	#contact-co-right {
    padding-left: 0px;
	}
	#map-contact {
    overflow: hidden;
    width: 100%;
    height: 300px;
	}
	#map-contact  iframe{
		height: 100% !important;
	}
}

@media all and (min-width: 480px) and (max-width: 604px){
	#checkcp input{
    width: 96% !important;
	margin-left: 0px !important;
	}
	#checkcp {
    float: right;
    width: 78.5%;
	}
	.foot-content:last-child {
    padding-left: 10px !important;
	}
	#head-title{
	width:100%;
	}
	#slider .owl-controls .owl-dots {
    left: 40%;
	}
	#head-logo {
    width: 60%;
    margin: 0px auto;
	padding-bottom: 20px;
	}
	#slider .owl-controls .owl-dots {
    left: 40%;
	}
	#wrapper {
    width: 100%;
	}
	#header{
	width: 100%;
	height:auto;
	}
	#logo img{
	width: 45%;
	}
	#cart {
    width: 200px;
	}
	#top-menu {
    width: 200px;
	}
	#navi-menu ul {
    width: 100%;
	}
	#navi-menu ul li a {
    padding: 16px 13px 20px 13px;
	}
	#slider {
    width: 100%;
	}
	#halo-sing {
    position: absolute;
    left: 15px;
    bottom: 10px;
    width: 80px;
	}
	#hotline {
    position: absolute;
    right: 10px;
    bottom: 60px;
    width: 120px;
	}
	#hotline1 {
    position: absolute;
    right: 10px;
    bottom: 35px;
    width: 120px;
	}
	#hotline2 {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 120px;
	}
	#search {
    right: 16px;
    top: 55px;
    width: 135px;
	}
	#photo-slide #photo-slide-c {
    max-height: 100%;
	}
	.o-product ul li {
    width: 30%;
	}
	.o-product ul li span{
	font-size: 15px;
	}
	#contact-co {
    overflow: hidden;
    float: none;
    width: 65%;
    margin: 0px auto;
	}
	#contact-co-left {
    float: left;
    width: 93%;
	}
	#maps img{
	max-width:100%;
	}
	#contact-co-right .form-inp input,
	#contact-co-right .form-inp textarea	{
    width: 75%;
	}
	#contact-co-right #val-cor {
    float: right;
    width: 100%;
	}
	.foot-content ul.cate li {
    float: left;
    width: 100%;	
	}
	.foot-content {
    float: left;
    width: 50%;
	height: 270px;
	}
	.foot-content +.foot-content +.foot-content {
	width: 50%;
	padding-left: 0px;
	}
	#sidebar {
    float: left;
    width: 30%;
	}
	#menu-poduct li a {
    float: left;
    width: 88%;
    background: #ff8d00 url(../res/upload/images/m-down.png) no-repeat 88% center;
    color: #fff;
    padding: 5px 10px;
	}
	.pro-content {
    width: 67%;
	}
	#cat-product li {
    float: left;
    width: 100%;
    height: auto;
	}
	#cat-product li .mask{
    float: left;
    width: 96%;
    height: 65%;
	padding:20% 2% 0px 2%;
	}
	h3.h-title {
    font-size: 30px;
	}
	.acc-change-center {
    width: 70%;
	}
	.order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 70% !important;
	}
	.your-list .form-inp input {
    padding: 5px 9px;
    float: left;
    width: 56%;
	}
	body.register .order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 91% !important;
	}
	body.register .order-subm-center #val-cor #in-code {
    font-size: 20px;
    float: left;
    width: 28%;
	}
	.order-subm-center #in-change {
    width: 100%;
	}
	#check-agree {
    width: 80%;
	}
	#con-mess {
    width: 95%;
	}
	body.account .order-subm-center .val-subm {
    width: 20% !important;
	}
	#home-info {
	display: block;
	}
	.hinfo {
    float: left;
    width: 100%;
	}
	.finfo:first-child {
    float: left;
    width: 100%;
	}
	.finfo {
    float: left;
    width: 50%;
	}
	.finfo:last-child {
    float: left;
    width: 100%;
	}
	#photo-slide #photo-slide-c {
    width: 100%;
	}
	#photo-slide {
    text-align: center;
	}
	#call-phone {
    float: none;
    width: 50%;
	}
	#videos h3{
	text-align:center;
	}
	.post-thumb {
    float: left;
    width: 100%;
	margin-left: 0px;
    margin-right: 0px;
	padding: 15px;
	}
	.post-content {
    float: left;
    width: 100%;
	padding: 0px 15px 15px 15px;
	}
	.modal-open .modal {
    padding-left: 0px !important;
	}
	.cinfo {
    float: left;
    width: 100%;
	}
	.cinfo+.cinfo {
    float: left;
    width: 100%;
	}
	#contact-co-right .form-inp label {
    float: left;
    width: 20%;
	}
	#contact-co-right .form-inp input.in-sub{
        width: 155px;
	}
	#contact-co-right {
    padding-left: 0px;
	}
	#map-contact {
    overflow: hidden;
    width: 100%;
    height: 300px;
	}
	#map-contact  iframe{
		height: 100% !important;
	}
}

@media all and (max-width: 767px){	
	.hinfoco {
    padding: 20px 30px 100px 30px !important;
	}
	.btns {
	width: 100%;
	}
}

@media all and (max-width: 1024px){	
	.post-descp .packed-btns {
	float: left;
	}
}

@media all and (max-width: 479px){
	#checkcp input{
    width: 100% !important;
	margin-left: 0px !important;
	}
	#checkcp {
    float: right;
    width: 100%;
	}
	#checkc {
    margin-left: 0px;
	}
	.foot-content ul.cons-1{
	text-align: center;
	}
	.foot-content ul.cons-1 li span{
	float:none !important;
	}
	.foot-content ul.cate {
    text-align: center;
	}
	#head-title{
	width:100%;
	}
	#slider .owl-controls .owl-dots {
    left: 40%;
	}
	#head-logo {
    width: 80%;
    margin: 0px auto;
	padding-bottom: 20px;
	padding-top: 50px;
	}
	#slider .owl-controls .owl-dots {
    left: 35%;
	}
	#wrapper {
    width: 100%;
	}
	#header{
	width: 100%;
	height: 245px;
	}
	#logo img{
	width: 35%;
    margin-top: 0px;
	}
	#top-menu {
    width: 200px;
	}
	#navi-menu ul {
    width: 100%;
	}
	#navi-menu ul li a {
    padding: 16px 13px 20px 13px;
	}
	#slider {
    width: 100%;
	}
	#halo-sing {
    position: absolute;
    left: 15px;
    bottom: 10px;
    width: 60px;
	}
	#hotline {
    position: absolute;
    right: 10px;
    bottom: 58px;
    width: 120px;
	}
	#hotline1 {
    position: absolute;
    right: 10px;
    bottom: 30px;
    width: 120px;
	}
	#hotline2 {
    position: absolute;
    right: 10px;
    bottom: 0px;
    width: 120px;
	}
	#search {
    right: 16px;
    top: 5px;
    width: 90%;
	}
	#photo-slide #photo-slide-c {
    max-height: 100%;
	}
	.o-product ul li {
    width: 30%;
	}
	.o-product ul li span{
	font-size: 15px;
	}
	#contact-co {
    overflow: hidden;
    float: none;
    width: 65%;
    margin: 0px auto;
	}
	#contact-co-left {
    float: left;
    width: 93%;
	}
	#maps img{
	max-width:100%;
	}
	#contact-co-right .form-inp input,
	#contact-co-right .form-inp textarea	{
    margin-left: 0px;
    width: 100%;
	}
	#contact-co-right #val-cor {
    float: right;
    width: 100%;
	}
	.foot-content ul.cate li {
    float: left;
    width: 50%;	
	}
	#contact-co-right .val-subm {
    float: right;
    width: 100%;
	}
	.hinfoco {
    padding: 20px 30px 100px 30px !important;
	}
	.foot-content:first-child {
    text-align:left;
	}
	.foot-content:last-child {
    text-align:center;
	}
	.foot-content {
    float: left;
    width: 100%;
	height: 100%;
	}
	.foot-content +.foot-content +.foot-content {
	width: 100%;
	padding-left: 0px;
	}
	#sidebar {
    float: left;
    width: 30%;
	}
	#menu-poduct li a {
    float: left;
    width: 88%;
    background: #ff8d00 url(../res/upload/images/m-down.png) no-repeat 88% center;
    color: #fff;
    padding: 5px 10px;
	}
	.pro-content {
    width: 67%;
	}
	#cat-product li {
    float: left;
    width: 100%;
    height: auto;
	}
	#cat-product li .mask{
    float: left;
    width: 96%;
    height: 65%;
	padding:20% 2% 0px 2%;
	}
	h3.h-title {
    font-size: 30px;
	}
	.acc-change-center {
    width: 70%;
	}
	.order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 70% !important;
	}
	.your-list .form-inp input {
    padding: 5px 9px;
    float: left;
    width: 56%;
	}
	body.register .order-subm-center .form-inp {
    overflow: hidden;
    margin: 0px auto;
    width: 91% !important;
	}
	body.register .order-subm-center #val-cor #in-code {
    font-size: 20px;
    float: left;
    width: 28%;
	}
	.order-subm-center #in-change {
    width: 100%;
	}
	#check-agree {
    width: 80%;
	}
	#con-mess {
    width: 95%;
	}
	body.account .order-subm-center .val-subm {
    width: 20% !important;
	}
	#home-info {
	display: block;
	}
	.hinfo {
    float: left;
    width: 100%;
	}
	.finfo:first-child {
    float: left;
    width: 100%;
	}
	.finfo {
    float: left;
    width: 50%;
	}
	.finfo:last-child {
    float: left;
    width: 100%;
	}
	#photo-slide #photo-slide-c {
    width: 100%;
	}
	#photo-slide {
    text-align: center;
	}
	#call-phone {
    float: none;
    width: 75%;
	}
	#pr-content {
    padding: 20px 30px 40px 30px;
	}
	.post-avil {
    float: left;
    width: 100%;
	}
	.post-descp .btns {
    text-align: left;
    float: left;
    width: 100%;
    height: 37px;
    padding-top: 10px;
	margin-top:20px;
	}
	#videos h3{
	text-align:center;
	}
	.post-thumb {
    float: left;
    width: 100%;
	margin-left: 0px;
    margin-right: 0px;
	padding: 15px;
	}
	.post-content {
    float: left;
    width: 100%;
	padding: 0px 15px 15px 15px;
	}
	.modal-open .modal {
    padding-left: 0px !important;
	}
	.cinfo {
    float: left;
    width: 100%;
	}
	.cinfo+.cinfo {
    float: left;
    width: 100%;
	}
	#contact-co-right .form-inp label {
    text-align: left;
    float: left;
    width: 100%;
	}
	#contact-co-right .form-inp input.in-sub{
        width: 155px;
	}
	#contact-co-right {
    padding-left: 0px;
	}
	#map-contact {
    overflow: hidden;
    width: 100%;
    height: 200px;
	}
	#map-contact  iframe{
		height: 100% !important;
	}
	#social {
    margin: 0px auto;
    width: 80px;
    overflow: hidden;
	}
	#social li{
    width: 50%;
	}
	.foot-content h3 {
    text-align: center;
	}
	.cinfoco {
    padding: 20px 30px 40px 30px;
	}
	.cinfo+.cinfo .cinfoco {
    padding: 20px 30px 40px 30px;
	}
}
@media all and (max-width: 320px){
	.finfo:first-child .finfoco ul li {
    float: left;
    text-align: center;
    width: 50%;
	}
	.finfo {
    float: left;
    width: 100%;
	}
	.finfoco {
    height: auto;
	}
	#head-logo {
    width: 91%;
    margin: 0px auto;
    padding-bottom: 20px;
    padding-top: 50px;
	}
}

@media all and (max-width: 390px){
	.foot-md ul li {
    width: 100%;
	}
	.foot-md ul li+li {
    border-top: 1px solid #0F880D;
    background: transparent;
	}
}