@media (min-width:1400px) {
	.container {
		width: 1280px;
	}
}


@media (min-width:1480px) {
	.container {
		/* width: 1440px; */
	}

}

@media (max-width:1024px) {
	.container {
		width: 100%;
	}

	.flex-header .nav-mobile-btn {
		display: block;
		position: relative;
		width: 40px;
		height: 40px;
	}

	.flex-header .nav-mobile-btn span {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		display: block;
		width: 30px;
		height: 1px;
		border-radius: 1px;
		background: var(--white);
	}

	.flex-fixed-position .nav-mobile-btn span {
		background: var(--main);
	}

	.flex-header .nav-mobile-btn span::before,
	.flex-header .nav-mobile-btn span::after {
		content: "";
		display: block;
		width: 30px;
		height: 1px;
		border-radius: 1px;
		background: var(--white);
		transition: .5s;
	}

	.flex-header .nav-mobile-btn span::before {
		margin-top: -10px;
	}

	.flex-header .nav-mobile-btn span::after {
		margin-top: 20px;
	}

	.open {
		background-color: var(--white);
	}

	.open .nav-mobile-btn span {
		background: transparent;
	}

	.flex-fixed-position .nav-mobile-btn span::before,
	.flex-fixed-position .nav-mobile-btn span::after,
	.open .nav-mobile-btn span::before,
	.open .nav-mobile-btn span::after {
		background: var(--main);
	}

	.open .nav-mobile-btn span::before {
		transform: rotate(45deg);
		margin-top: unset;
	}

	.open .nav-mobile-btn span::after {
		transform: rotate(-45deg);
		margin-top: unset;
	}

	.flex-nav {
		position: absolute;
		top: 100%;
		left: -100%;
		flex-direction: column;
		width: 100%;
		height: calc(100vh - 90px);
		background-color: var(--white);
		border-top: 1px solid #dfdfdf;
		visibility: hidden;
		opacity: 0;
		transition: .5s;
	}

	.open .flex-nav {
		left: 0;
		visibility: visible;
		opacity: 1;
		z-index: 999;
	}

	.flex-nav li {
		display: block;
		width: 100%;
	}

	.flex-nav li.nav-top a {
		display: flex;
		justify-content: space-between;
		align-items: center;
		color: var(--font-color);
	}

	.flex-nav li.nav-top a span.expand {
		display: block;
		width: 12px;
		height: 12px;
		border: 1px solid var(--font-color);
		border-left: 0;
		border-bottom: 0;
		transform: rotate(45deg);
		transition: .5s;
	}

	.flex-nav li.open a span.expand {
		transform: rotate(135deg);
	}

	.flex-nav li.nav-top .nav-childs-ul {
		position: initial;
		max-height: 0;
		overflow: hidden;
		transition: .5s;
	}

	.flex-nav li.nav-top:hover .nav-childs-ul {
		background-color: var(--white);
	}

	.flex-nav li.nav-top.open .nav-childs-ul {
		background-color: var(--white);
		max-height: 500px;
		visibility: visible;
		opacity: 1;
	}

	.flex-nav li.nav-top .nav-childs-ul a {
		color: var(--font-color);
		text-align: left;
		padding: 10px 40px;
	}

	.index-products .item-product .product-desc .title {
		font-size: 28px;
	}

	.index-brand .brand-control .brand-tabs .brand-item {
		padding: 60px 10px 10px;
	}
	
	.show-product-thumb .product-thumb{
		flex-direction: column;
	}
	
	.show-product-thumb .product-thumb .product-left{
		width: 100% ;
	}
	
	.show-product-thumb .product-thumb .product-right{
		width: 100% ;
		height: auto;
		margin-top: 20px ;
	}
	
	.show-product-thumb .product-thumb .product-right img{
		width: 100% ;
		max-width: 100% ;
	}
}

@media (max-width:992px) {
	.flex-sticky-position{
		position: relative;
	}
	
	.index-products .item-product {
		width: 100%;
	}

	.index-products .item-product .product-desc {
		width: 40%;
		padding-left: 30px;
		bottom: 25%;
	}

	.index-brand .brand-control .brand-desc {
		margin-top: 30px;
		padding-right: 30px;
	}

	.index-brand .brand-control .brand-desc .title {
		font-size: 28px;
	}

	.index-brand .brand-control .brand-desc .tool-btns {
		margin-top: 30px;
	}

	.news-grid {
		flex-wrap: wrap;
	}

	.news-grid .news-thumb,
	.news-grid .news-list {
		width: 100%;
	}

	.news-grid .news-list {
		margin-top: 30px;
	}

	.index-brand-intro .brand-circle .item-circle {
		width: 150px;
		height: 150px;
	}

	.index-brand-intro .brand-circle .item-circle .circle .title {
		font-size: 20px;
	}

	.index-brand-intro .brand-circle .item-circle .circle .desc {
		white-space: normal;
	}
	
	.contact-map-card{
		flex-direction: column;
	}
	
	.contact-map-card .contact-thumb,
	.contact-map-card .contact-card{
		width: 100% ;
	}

	.footer-nav {
		flex-wrap: wrap;
	}

	.footer-nav .nav-ul {
		width: 100%;
		padding: 0;
	}

	.footer-nav .nav-ul:not(:last-child) {
		border-right: 0;
	}

	.footer-nav .nav-ul-items {
		justify-content: flex-start;
		margin-top: 20px;
	}

}

@media (max-width:576px) {

	.flex-fixed-header {
		position: relative;
		background-color: var(--main);
	}
	
	.flex-fixed-position {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 999;
	}
	
	.flex-fixed-header.open,
	.flex-fixed-header.flex-fixed-position{
		background-color: var(--white);
	}
	
	.open .nav-mobile-btn span,
	.open .nav-mobile-btn span::before,
	.open .nav-mobile-btn span::after{
		background-color: var(--white);
	}
	
	.flex-fixed-header.open .nav-mobile-btn span::before,
	.flex-fixed-header.open .nav-mobile-btn span::after,
	.open.flex-fixed-position .nav-mobile-btn span::before,
	.open.flex-fixed-position .nav-mobile-btn span::after{
		background-color: var(--main);
	}
	
	.open .nav-mobile-btn span{
		background-color: transparent;
	}
	
	.flex-nav{
		height: calc(100vh - 70px);
	}

	.logo a img {
		max-height: 50px;
	}
	
	.section-padding{
		padding: 50px 0;
	}
	
	.index-topic-title{
		font-size: 32px ;
	}
	
	.index-products .item-product .product-desc .desc{
		display: none;
	}
	
	.index-brand{
		flex-direction: column;
	}
	
	.index-brand .brand-control, .index-brand .brand-thumb{
		width: 100% ;
	}
	
	.index-brand .brand-thumb{
		margin-top: 50px ;
	}
	
	.news-grid .news-list{
		padding: 30px ;
	}
	
	.news-more{
		padding: 30px 0 ;
	}
	
	.index-brand-intro .brand-circle{
		flex-wrap: wrap;
	}
	
	.index-brand-intro .brand-circle .item-circle{
		width: 100% ;
		height: auto;
		border-width: 1px ;
		border-radius: 0;
		padding: 10px 0;
	}
	
	.index-brand-intro .brand-circle .item-circle:not(:last-child){
		margin-bottom: 20px ;
	}
	
	.index-brand-intro .brand-circle .item-circle .circle{
		position: initial;
		transform: translate(0, 0);
	}
	
	.index-form .form-line{
		flex-direction: column;
	}
	
	.index-form .form-line input{
		width: 100% ;
	}
	
	.index-form .form-line input:not(:last-child){
		margin-bottom: 30px ;
	}
	
	.static-banner .banner-text .en-title{
		font-size: 16px ;
	}
	
	.static-banner .banner-text .cn-title{
		font-size: 20px ;
	}
	
	.category-product-name{
		flex-direction: column;
		padding: 0 0 50px ;
	}
	
	.category-product-name a{
		display: block;
		width: 100% ;
	}
	
	.category-product-name a:not(:last-child){
		margin-right: 0 ;
		margin-bottom: 20px ;
	}
	
	.category-product-list .product-item{
		width: calc((100% - 30px) / 2);
	}
	
	.category-product-list .product-item:not(:nth-child(4n)){
		margin-right: 0;
	}
	
	.category-product-list .product-item:not(:nth-child(2n)){
		margin-right: 30px ;
	}
	
	.category-product-list .product-item .product-name{
		font-size: 16px ;
	}
	
	.show-product-thumb{
		flex-direction: column;
	}
	
	.show-product-thumb .product-thumb,.show-product-thumb .product-detail{
		width: 100% ;
		padding: 0 ;
	}
	
	.show-product-thumb .product-detail{
		margin-top: 30px ;
	}
	
	.show-product-thumb .product-detail .product-name{
		font-size: 24px ;
	}
	
	.show-product-thumb{
		margin-bottom: 30px ;
	}
	
	.show-product-detail{
		margin-bottom: 50px;
		padding: 30px ;
	}
	
	.list-news .item-news{
		width: 100% ;
		margin-bottom: 30px ;
	}
	
	.list-news .item-news:not(:nth-child(2n)){
		margin-right: 0;
	}
	
	.list-news .item-news .thumb-desc{
		padding: 30px 15px ;
	}
	
	.show-news{
		padding: 30px ;
	}
	
	.show-news .title{
		font-size: 20px ;
	}
	
	.show-news .content{
		padding: 30px 15px ;
	}
	
	.show-news .related-links{
		padding: 30px 0;
	}
	
	.contact-map-card .contact-card{
		padding: 30px 15px ;
	}
	
	.contact-map-card .contact-card .title{
		font-size: 20px ;
	}
	
	.contact-form{
		padding: 50px 0;
	}
	
	.contact-form .form-title .cn-title{
		font-size: 20px ;
	}
	
	.contact-form .form-elements .form-inline{
		flex-direction: column;
	}
	
	.contact-form .form-elements .form-inline input:not(:last-child){
		margin-right: 0;
		margin-bottom: 30px ;
	}
	
}