/* 超小设备（手机，小于 768px） */

.top-contact-wrapper{
	padding: 10px 0;
	background: #f5f6f7;
}
.top-contact {
	width: 1200px;
	margin: 0 auto;
}
.top-contact .left .item{
	margin-right: 20px;
}
.top-contact .right {
	text-align: right;
}
.top-contact .right .item{
	margin-left: 20px;
}
.top-contact a:hover{
	color: #c30e23;
}

@media (max-width: 768px) {
	.top-header,.top-contact,.top-contact-wrapper {
		display: none;
	}

	/* 导航栏 */
	.navbar-mask {
		position: fixed;
		left: 0;
		top: 0;
		bottom: 0;
		right: 0;
		z-index: 999;
		background: rgba(0, 0, 0, .3);
	}

	.navbar-container {
		height: 50px;
	}

	.navbar-header {
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		z-index: 998;
		padding: 0 15px;
		height: 50px;
		background: #c30e23;
		/*主色hover*/
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
	}

	.navbar-header-item {
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		flex: 1;
	}

	.navbar-logo img {
		height: 30px;
		padding: 10px 0;
	}

	.navbar-header-menu {
		display: block;
		padding: 9px 0;
	}

	.navbar-header-menu .icon {
		font-size: 32px;
		padding: 0 5px;
		color: #fff;
	}

	.navbar-nav li.active a {
		background: #b20d20;
		/*主色hover*/
	}

	.navbar-nav>li img {
		display: none;
	}

	.navbar-nav .navbar-nav-menu {
		display: block;
		color: #fff;
		padding: 0 15px;
		font-size: 15px;
		line-height: 40px;
		background: #c30e23;
		position: relative;
		/*主色hover*/
	}
	.navbar-nav-menu .caret {
		position: absolute;
		top:20px;
		right:15px;
		z-index:998;
		padding-right:15px;
	}
	
	.navbar-nav-menu .caret::after {
		content: '';
		display: inline-block;
		width: 8px;
		height: 8px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		transform: rotate(135deg);
		-webkit-transform: rotate(135deg);
		vertical-align: middle;
		position: absolute;
		top: 50%;
		right: 0px;
		margin-top: -8px;
	}
	.navbar-nav-pc {
		display: none !important;
	}

	.dropdown-menu {
		display: none;
	}

	.dropdown-menu li a {
		display: block;
		color: #fff;
		padding: 0 15px;
		font-size: 15px;
		line-height: 40px;
		background: #c30e23;
		/*主色hover*/
	}

	.navbar-lang {
		/* float: right !important; */
		padding: 0 15px 10px 12px;
	}

	.navbar-lang select {
		width: 100%;
		margin: 4px 0;
		border: none;
		outline: none;
		height: 32px;
		line-height: 32px;
		font-size: 15px;
		background: none;
		color: #fff;
	}

	.navbar-lang option {
		color: #333;
	}

	/*顶部布局*/
	.navbar-nav-top {
		display: none;
		position: fixed;
		left: 0;
		top: 50px;
		right: 0;
		z-index: 1000;
		width: 100%;
		background: #c30e23;
		border-top: 1px solid #b20d20;
	}

	/*左侧布局*/
	.navbar-nav-left {
		position: fixed;
		left: 0;
		top: 0;
		bottom: 0;
		z-index: 1000;
		width: 0;
		background: #c30e23;
		overflow: auto;
	}

	/*右侧布局*/
	.navbar-nav-right {
		position: fixed;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 1000;
		width: 0;
		background: #c30e23;
		overflow: auto;
	}
}

/* 小型设备（平板电脑，768px 起） */
@media (min-width: 768px) and (max-width: 1200px) {
	.top-header {
		margin: 0 15px;
	}

	.top-header .logo {
		float: left;
	}

	.top-header .logo img {
		height: 60px;
		padding: 10px 0;
	}

	.top-header .top-info {
		float: right;
	}

	.top-info-item {
		float: left;
		line-height: 24px;
		margin-left: 15px;
		padding: 28px 0;
	}

	.top-info-item .icon {
		float: left;
		padding: 4px;
		font-size: 16px;
		color: #fff;
		border-radius: 30px;
	}

	.top-shop-cart .icon {
		background: #6ae1ff;
	}

	.top-login {
		position: relative;
	}

	.top-login .top-user-menu {
		display: none;
		position: absolute;
		right: 0;
		top: 60px;
		z-index: 1000;
		background-color: #fff;
		box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
		border-radius: 5px;
	}

	.top-login:hover .top-user-menu {
		display: block;
	}

	.top-login .top-user-menu a {
		color: #333;
		display: block;
		min-width: 72px;
		height: 36px;
		line-height: 36px;
		padding: 0 12px;
		border-radius: 5px;
		text-align: center;
	}

	.top-login .top-user-menu a:hover {
		background-color: #f2f2f2;
	}

	.top-login .icon {
		background: #9fa6ff;
		font-size: 14px;
	}

	.top-info-item span {
		float: left;
		font-weight: bold;
		color: #666;
		margin-left: 10px;
		font-size: 15px;
	}

	.top-lang select {
		outline: none;
		border: 1px solid #ccc;
		color: #666;
		width: 60px;
		height: 24px;
		line-height: 24px;
		background: none;
	}

	.top-lang option {
		color: #333;
	}

	.navbar-lang {
		display: none;
	}

	/* 导航栏 */
	.navbar-container {
		margin: 0 20px;
	}

	.navbar-header {
		display: none;
	}

	.navbar-nav>li {
		float: left;
		position: relative;
	}

	.navbar-nav li.active a {
		background: #b20d20;
		/*主色hover*/
	}

	.navbar-nav>li img {
		display: none;
	}

	.navbar-nav-menu {
		display: block;
		color: #fff;
		font-size: 15px;
		height: 50px;
		line-height: 50px;
		padding: 0 15px;
	}
	
	.navbar-nav-menu .caret {
		position: relative;
		padding-right:15px;
	}
	
	.navbar-nav-menu .caret::after {
		content: '';
		display: inline-block;
		width: 8px;
		height: 8px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		transform: rotate(135deg);
		-webkit-transform: rotate(135deg);
		vertical-align: middle;
		position: absolute;
		top: 50%;
		right: 0px;
		margin-top: -8px;
	}
	
	.navbar-nav-app {
		display: none;
	}

	.navbar-nav-menu:focus,
	.navbar-nav-menu:hover,
	.navbar-nav-menu:active {
		background: #b20d20;
		/*主色hover*/
		color: #fff;
	}

	.navbar-nav li .dropdown-menu {
		display: none;
		position: absolute;
		left: 0;
		top: 50px;
		z-index: 999;
		background: #b20d20;
		padding-top: 5px;
		width: auto;
		border-radius: 0 0 5px 5px;
		-webkit-border-radius: 0 0 5px 5px;
		-moz-border-radius: 0 0 5px 5px;
		box-shadow: 0 5px 15px #9e0b1c;
	}

	.navbar-nav li:hover .dropdown-menu,
	.navbar-nav li:focus .dropdown-menu,
	.navbar-nav li:active .dropdown-menu {
		display: block;
	}

	.dropdown-menu li {
		display: block;
		white-space: nowrap;
	}

	.dropdown-menu li a {
		padding: 3px 10px;
		display: block;
		color: #fff;
		font-size: 14px;
		height: 36px;
		line-height: 36px;
	}

	.dropdown-menu li a:active {
		background: #9e0b1c;
	}
}

/* 大型设备（大台式电脑，1200px 起） */
@media (min-width: 1200px) {
	.top-header {
		width: 1200px;
		margin: 0 auto;
		/* overflow: hidden; */
	}

	.top-header .logo {
		float: left;
	}

	.top-header .logo img {
		height: 60px;
		padding: 10px 0;
	}

	.top-header .top-info {
		float: right;
	}

	.top-info-item {
		float: left;
		line-height: 24px;
		margin-left: 15px;
		padding: 28px 0;
	}

	.top-info-item .icon {
		float: left;
		padding: 4px;
		font-size: 16px;
		color: #fff;
		border-radius: 30px;
	}

	.top-shop-cart .icon {
		background: #6ae1ff;
	}

	.top-login {
		position: relative;
	}

	.top-login .top-user-menu {
		display: none;
		position: absolute;
		right: 0;
		top: 60px;
		z-index: 1000;
		background-color: #fff;
		box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
		border-radius: 5px;
	}

	.top-login:hover .top-user-menu {
		display: block;
	}

	.top-login .top-user-menu a {
		color: #333;
		display: block;
		min-width: 72px;
		height: 36px;
		line-height: 36px;
		padding: 0 12px;
		border-radius: 5px;
		text-align: center;
	}

	.top-login .top-user-menu a:hover {
		background-color: #f2f2f2;
	}

	.top-login .icon {
		background: #9fa6ff;
		font-size: 14px;
	}

	.top-info-item span {
		float: left;
		font-weight: bold;
		color: #666;
		margin-left: 10px;
		font-size: 15px;
	}

	.top-lang select {
		outline: none;
		border: 1px solid #ccc;
		border-radius: 2px;
		color: #666;
		width: 60px;
		height: 24px;
		line-height: 24px;
		background: none;
	}

	.top-lang option {
		color: #333;
	}

	.navbar-lang {
		display: none;
	}

	/* 导航栏 */
	.navbar-container {
		width: 1200px;
		margin: 0 auto;
	}

	.navbar-header {
		display: none;
	}

	.navbar-nav>li {
		float: left;
		position: relative;
	}

	.navbar-nav li.active a {
		background: #b20d20;
		/*主色hover*/
	}

	.navbar-nav>li img {
		position: absolute;
		right: -5px;
		top: 0;
		z-index: 3;
	}

	.navbar-nav-menu {
		display: block;
		color: #fff;
		font-size: 15px;
		height: 50px;
		line-height: 50px;
		padding: 0 20px;
	}

	.navbar-nav-menu .caret {
		position: relative;
		padding-right:15px;
	}

	.navbar-nav-menu .caret::after {
		content: '';
		display: inline-block;
		width: 8px;
		height: 8px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		transform: rotate(135deg);
		-webkit-transform: rotate(135deg);
		vertical-align: middle;
		position: absolute;
		top: 50%;
		right: 0px;
		margin-top: -8px;
	}

	.navbar-nav-app {
		display: none;
	}

	.navbar-nav-menu:hover {
		background: #b20d20;
		/*主色hover*/
		color: #fff;
	}

	.navbar-nav li .dropdown-menu {
		display: none;
		position: absolute;
		left: 0;
		top: 50px;
		z-index: 999;
		background: #b20d20;
		padding-top: 5px;
		width: auto;
		border-radius: 0 0 5px 5px;
		-webkit-border-radius: 0 0 5px 5px;
		-moz-border-radius: 0 0 5px 5px;
		box-shadow: 0 5px 15px #9e0b1c;
	}

	.navbar-nav li:hover .dropdown-menu {
		display: block;
	}

	.dropdown-menu li {
		display: block;
		white-space: nowrap;
	}

	.dropdown-menu li a {
		padding: 3px 10px;
		display: block;
		color: #fff;
		font-size: 14px;
		height: 28px;
		line-height: 28px;
	}

	.dropdown-menu li a:hover {
		background: #9e0b1c;
	}

}
