/*xxbmmMainStyle.css*/
/*base style*/
body, ul ,li, p, h1, h2, h3 {
	margin: 0px;
	padding: 0px;
}
section {
	display: block;
}
ul, li {
	list-style-type: none;
}
a:link, a:visited {
	text-decoration: none;
	color: #ccc;
}
a:hover, a:active {
	color: #fff;
}
input, textarea, a {
-webkit-tap-highlight-color: transparent;
}
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

/*main start*/
@font-face {  
	font-family: 'number';
	src:url('font/DIN-Bold.otf') format('truetype');
}
body {
	background-color: #FFF;
}
#wrapper {
	width: 100%;
	font-family: Avenir, 'PingFang SC', sans-serif;
	font-weight: 300;
	color: #796969;
	font-size: 15px;
}
#header {
	width: 100%;
	position: fixed;
	height: 60px;
	z-index: 99;
	-webkit-transition: all 200ms;
	-o-transition: all 200ms;
	transition: all 200ms;
}
.mainNav {
	width: 96%;
	max-width: 1000px;
	margin: 0 auto;
}
.mainNav #mainLogo {
	width: 105px;
	height: 119px;
	float: left;
	background-image: url(images/main_logo.svg);
	background-size: 85px 99px;
	background-repeat: no-repeat;
	background-position: center;
	padding: 10px;
	text-indent: -9999px;
	border-radius: 12px;
	-webkit-transition: all 200ms;
	-o-transition: all 200ms;
	transition: all 200ms;
	cursor: pointer;
}
.logoScale {
	transform: scale(.6,.6);
	position: relative;
	top: -25px;
}
.mainNav nav {
	float: left;
	height: 60px;
	padding-left: 25px;
}
.mainNav nav a:link, .mainNav nav a:visited {
	color: #796969;
	font-size: 14px;
	line-height: 20px;
	display: inline-block;
	padding: 2px;
	margin: 23px 13px;
}
.mainNav nav a:hover, .mainNav nav a:active {
	color: #D05151;
}
.mainNav nav a.active {
	background-image: url(images/nav_select.svg);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 18px 2px;
	color: #D05151;
	font-weight: normal;
}

/*mobile nav */
.mobileNavBox {
	width: 100%;
	position: fixed;
	z-index: 9999;
	overflow: hidden;
	display: none;
	height: 0px;
}
.mNavIconBox {
	float: right;
	height: 60px;
	width: 60px;
	position: relative;
	cursor: pointer;
	z-index: 9999;
}
.mNavLineBox {
	float: right;
	height: 18px;
	width: 24px;
	margin: 21px 18px;
	position: relative;
}
.mNavLineBox .navLine1, .mNavLineBox .navLine2, .mNavLineBox .navLine3 {
	width: 100%;
	height: 2px;
	display: block;
	background-color: #D05151;
	position: absolute;
	border-radius: 1px;
	-webkit-transition: all 200ms;
	-o-transition: all 200ms;
	transition: all 200ms;
}
.mNavLineBox .navLine1 {
	top: 0px;
}
.mNavLineBox .navLine2 {
	top: 8px;
}
.mNavLineBox .navLine3 {
	top: 16px;
}
.navLine1Rotate {
	transform: rotateZ(45deg);
	margin-top: 8px;
}
.navLine2Rotate {
	transform: rotateY(90deg);
}
.navLine3Rotate {
	transform: rotateZ(-45deg);
	margin-top: -8px;
}
.mNavListBg {
	width: 100%;
	height: 100%;
	background-color: #000;
	background-color: rgba(0,0,0,.6);
	display: none;
}

.mobileNav {
	padding: 80px 5% 0px;
	width: 80%;
	box-sizing: border-box;
	height: 100%;
	background-color: #fff;
	position: absolute;
	top: 0px;
	right: 0px;
	-webkit-transition: all 200ms;
	-o-transition: all 200ms;
	transition: all 200ms;
	z-index: 999;
}
.mobileNavHide {
	right: -100%;
	-webkit-transition: all 200ms;
	-o-transition: all 200ms;
	transition: all 200ms;
}
#mobileNav a {
	display: block;
	height: 88px;
	line-height: 88px;
	text-align: center;
	font-size: 14px;
	color: #D05151;
	font-weight: normal;
	border-bottom: 1px dashed #eee;
	top: 0px;
	-webkit-transition: all 200ms;
	-o-transition: all 200ms;
	transition: all 200ms;
}

@media screen and (max-width: 600px) {
	#wrapper {
		width: 100%;
		font-family: Avenir, 'PingFang SC', sans-serif;
		font-weight: 300;
		color: #796969;
		font-size: 15px;
	}
	.mainNav nav {
		display: none;
	}
	.mobileNavBox {
		display: inherit;
		height: auto;
	}
}


/*slogan section*/
#sloganSection {
	width: 100%;
	overflow: hidden;
	position: relative;
}
.bgGroup {
	width: 100%;
	height: 100%;
	position: relative;
	background-image: url(images/top_bg.jpg);
	background-repeat: no-repeat;
	background-position: top;
	background-size: contain;
}
#sloganSection .bg1 {
	width: 100%;
	height: 100%;
	background-image: url(images/first_bg.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: top;
	position: absolute;
	top: 0px;
}
#sloganSection .bg2 {
	width: 100%;
	height: 100%;
	background-image: url(images/second_bg.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: top;
	position: absolute;
	top: 0px;
}
#sloganSection .people {
	width: 100%;
	height: 100%;
	background-image: url(images/people_bg.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: top;
	position: absolute;
	top: 0px;
}
.slogan {
	display: block;
	font-size: 42px;
	color: #4E4242;
	font-weight: bold;
	width: 96%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 15% 0px 0px 0px ;
}
.slogan .small {
	font-size: 24px;
}
@media screen and (max-width: 600px) {
	.bgGroup {
		width: 150%;
		height: 100%;
		margin-left: -30%;
		position: relative;
	}
	.slogan {
		display: block;
		font-size: 28px;
		text-align: left;
		color: #4E4242;
		font-weight: bold;
		width: 96%;
		max-width: 1000px;
		margin: 0 auto;
		padding: 45% 0px 0px 25%;
	}
	.slogan .small {
	font-size: 20px;
}
}

/*vp info section*/
#vpInfoSection {
	width: 100%;
	background-color: #FFF7E2;
	background-image: url(images/vp_bg.jpg);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: top;
}
.infoBox {
	width: 90%;
	max-width: 900px;
	margin: 0 auto;
	padding: 20% 0px 10% 0px;
}
.vpPhoto {
	float: left;
	width: 194px;
	height: 215px;
	padding-right: 40px;
}
.vpPhoto img {
	width: 100%;
	max-width: 100%;
}
.infoBox .name {
	display: block;
	font-size: 42px;
	font-weight: bold;
	color: #4E4242;
}
.infoBox .title {
	display: block;
	font-size: 20px;
	color: #D05151;
	padding-bottom: 25px;
}
.infoBox .info {
	display: block;
	line-height: 20px;
	margin-bottom: 10px;
}
@media screen and (max-width: 600px) {
	.vpPhoto {
		float: none;
		width: 194px;
		height: 215px;
		padding-right: 0px;
		margin: 0 auto;
		padding-bottom: 20px;
	}
	.vpPhoto img {
		height: 100%;
		max-height: 100%;
	}
	.infoBox .name {
		display: block;
		font-size: 32px;
		font-weight: bold;
		color: #4E4242;
		text-align: center;
	}
	.infoBox .title {
		display: block;
		font-size: 20px;
		color: #D05151;
		padding-bottom: 25px;
		text-align: center;
		font-weight: normal;
	}
	.infoBox .info {
		display: block;
		line-height: 20px;
		margin-bottom: 10px;
		text-align: center;
	}
}

/*account Section*/
#accountSection {
	width: 100%;
	background-color: #FFEFC5;
}
.accountBox {
	width: 96%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 10% 0px;
}
.accountBox .title {
	font-size: 42px;
	font-weight: bold;
	color: #4E4242;
	display: block;
	text-align: center;
}
.accountBox .info {
	display: block;
	padding: 20px 200px;
	text-align: center;
}
.accountTabBox .tab {
	width: 33.3%;
	float: left;
	box-sizing: border-box;
	padding: 40px 10px 10px 10px;
	position: relative;
}
.accountTabBox .tab .contentBox	{
	width: 100%;
	box-sizing: border-box;
	padding: 120px 30px 30px 30px;
	border-radius: 12px;
	background-color: #FFF7E2;
	text-align: left;
	box-shadow: 0px 2px 6px rgba(0,0,0,.2);
	position: relative;
	overflow: hidden;
}
.accountTabBox .tab .contentBox .tabTitle {
	display: block;
	color: #D05151;
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 5px;
}
.accountTabBox .tab .contentBox .tabInfo {
	display: block;
	color: #796969;
	font-weight: bold;
	margin-bottom: 30px;
}
.accountTabBox .tab .contentBox .tabWord {
	display: block;
	font-size: 13px;
	text-align: justify;
	margin-bottom: 40px;
}
.accountTabBox .tab .contentBox .linkButton {
	display: block;
	width: 105px;
	height: 24px;
	line-height: 25px;
	font-size: 20px;
	color: #D05151;
	font-weight: bold;
	background-image: url(images/tab_right_arrow.svg);
	background-repeat: no-repeat;
	background-size: 20px 10px;
	background-position: center right;
	cursor: pointer;
	position: relative;
}
.accountTabBox .tab .contentBox .linkButton:hover {
	color: #B84444;
}
.accountTabBox .tab .contentBox .qtBox {
	width: 100%;
	background-color: #FFF7E2;
	text-align: center;
	vertical-align: middle;
	position: absolute;
	bottom: 0px;
	left: 0px;
	box-sizing: border-box;
	padding-top: 20px;
	display: none;
}
.accountTabBox .tab .contentBox .qtBox .qtCloseButton {
	width: 100%;
	height: 60px;
	margin-top: 10px;
	background-image: url(images/qt_close.png);
	background-repeat: no-repeat;
	background-size: 40px;
	background-position: center;
	background-color: #FFF7E2;
	border-radius: 6px;
	cursor: pointer;
}
.accountTabBox .tab .contentBox .qtBox img {
	width: 200px;
	max-width: 200px;
}
.accountTabBox .tab .icon {
	width: 148px;
	position: absolute;
	top: 0px;
	left: 30px;
}
.accountTabBox .tab .icon img {
	width: 100%;
	max-width: 100%;
}
.youxuanBg {
	background-image: url(images/youxuan_bg.png);
	background-repeat: no-repeat;
	background-position: bottom right;
	background-size: 198px 210px;
}
.luntanBg {
	background-image: url(images/luntan_bg.png);
	background-repeat: no-repeat;
	background-position: bottom right;
}
.ketangBg {
	background-image: url(images/ketang_bg.png);
	background-repeat: no-repeat;
	background-position: bottom right;
}
a.oldArticleLink:link, a.oldArticleLink:visited {
	display: block;
	width: 100%;
	text-align: center;
	color: #D05151;
	text-decoration: underline;
	font-size: 15px;
	line-height: 32px;
	margin-bottom: 3%;
}
a.oldArticleLink:hover, a.oldArticleLink:active {
	font-weight: bolder;
}
@media screen and (max-width: 600px) {
	.accountTabBox .tab {
		width: 100%;
		float: left;
		box-sizing: border-box;
		padding: 40px 10px 10px 10px;
		position: relative;
	}
	.accountBox .title {
		font-size: 32px;
	}
	.accountBox .info {
		display: block;
		padding: 20px;
		text-align: center;
	}
}



/*cooperation Section*/
#cooperationSection {
	width: 100%;
	padding-bottom: 10%;
}
.cooperationBox {
	width: 96%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 10% 0px 6% 0px;
}
.cooperationBox .title {
	font-size: 42px;
	font-weight: bold;
	color: #4E4242;
	display: block;
	text-align: center;
}
.cooperationList {
	width: 100%;
	padding-top: 40px;
}
.cooperationList li {
	float: left;
	width: 23%;
	box-sizing: border-box;
	padding: 30px;
	margin: 1%;
	background-image: url(images/coo_bg.png);
	background-repeat: repeat-x;
	background-size: contain;
	border-radius: 12px;
	text-align: left;
}
.cooperationList li .icon {
	width: 64px;
	height: 64px;
	margin-bottom: 40px;
}
.cooperationList li .icon img {
	width: 100%;
	max-width: 100%;
}
.cooperationList li .listTitle {
	display: block;
	color: #4E4242;
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 5px;
}
.cooperationList li .listInfo {
	display: block;
	color: #796969;
	font-weight: bold;
}
/*brand show swiper-slide*/
.brandShowList .swiper-slide {
	text-align: center;
}
.brandShowList .swiper-slide img {
	width: 100%;
	max-width: 200px;
}

/*ad box*/
.adMailBox {
	text-align: center;
	width: 96%;
	margin: 0 auto;
	padding: 80px 0px 0px 0px;
}
.adMailBox .adIcon {
	margin: 0 auto;
	width: 64px;
	height: 64px;
}
.adMailBox .adIcon img {
	width: 100%;
	height: 100%;
}
.adMailBox p {
	padding-top: 20px;
	font-size: 16px;
	color: #4E4242;
	line-height: 24px;
	font-weight: 500;
}
.adMailBox p a:link, .adMailBox p a:visited {
	color: #4E4242;
	text-decoration: underline;
}
.adMailBox p a:hover, .adMailBox p a:active {
	color: #796969;
}
@media screen and (max-width: 600px) {
	.cooperationBox .title {
		font-size: 32px;
		font-weight: bold;
		color: #4E4242;
		display: block;
		text-align: center;
	}
	.cooperationList li {
		float: left;
		width: 48%;
		box-sizing: border-box;
		padding: 12px;
		margin: 1%;
		background-image: url(images/coo_bg.png);
		background-repeat: repeat-x;
		background-size: contain;
		border-radius: 12px;
		text-align: left;
	}
	.cooperationList li .listTitle {
		display: block;
		color: #4E4242;
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 5px;
	}
	.cooperationList li .listInfo {
		display: block;
		color: #796969;
		font-weight: normal;
		font-size: 13px;
	}
}

/*news section*/
#newsSection {
	width: 100%;
	background-color: #FFF7E2;
	padding: 10% 0px;
}
.newsTitle {
	font-size: 42px;
	font-weight: bold;
	color: #4E4242;
	display: block;
	text-align: center;
}

#newsSection .swiper-container {
	padding-top: 40px;
}
.newsList .swiper-slide {
	width: 96%;
	height: 420px;
	max-width: 800px;
	opacity: .2;
}
.newsList .swiper-slide-active {
	opacity: 1;
}
.newsList .swiper-slide img {
	width: 100%;
	max-width: 100%;
}
.newsList .swiper-button-prev:hover,
.newsList .swiper-button-next:hover {
	opacity: 1;
}
.newsTitleBox {
	position: absolute;
	bottom: 30px;
	height: 90px;
	width: 80%;
}
.newsTitleBox .newsTitle {
	color: #fff;
	max-width: 90%;
	font-size: 23px;
	height: 70px;
	padding: 10px;
	text-align: left;
	background-color: #D05151;
	background-color: rgba(208,81,81,.9);
}
.newsTitleBox a.newsLinkButton {
	display: inline-block;
	float: right;
	height: 90px;
	width: 120px;
	background-image: url(images/news_link.png);
	background-repeat: no-repeat;
	background-size: contain;
}
@media screen and (max-width: 600px) {
	.newsList .swiper-slide {
		width: 96%;
		height: auto;
		max-width: 800px;
		opacity: .2;
		padding-bottom: 45px;
	}
	.newsList .swiper-slide-active {
		opacity: 1;
		overflow: visible;
	}
	.newsList .swiper-button-prev,
	.newsList .swiper-button-next {
		display: none;
	}
	.newsTitle {
		font-size: 32px;
		font-weight: bold;
		color: #4E4242;
		display: block;
		text-align: center;
	}
	.newsTitleBox {
		position: absolute;
		bottom: 0px;
		height: 50px;
		width: 100%;
	}
	.newsTitleBox .newsTitle {
		color: #fff;
		max-width: 100%;
		font-size: 14px;
		height: 40px;
		padding: 5px;
		text-align: left;
		background-color: #D05151;
		font-weight: normal;
	}
	.newsTitleBox a.newsLinkButton {
		display: inline-block;
		float: right;
		height: 50px;
		width: 90px;
		background-image: url(images/news_link_m.png);
		background-repeat: no-repeat;
		background-size: contain;
		position: relative;
	}
}


/*foot section*/
#footer {
	background-image: url(images/foot_bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	text-align: center;
	padding: 30px 0px 10px 0px;
	color: #fff;
}
#footer .footslogan {
	display: block;
	font-size: 32px;
	font-weight: bold;
	padding-top: 40px;
	text-indent: 20px;
}
#footer .tel {
	display: block;
	font-size: 24px;
	font-weight: bold;
	padding-bottom: 60px;
}
#footer .footWord {
	display: inline-block;
	padding: 0px 20px;
	font-size: 12px;
}
#footer a:link, #footer a:visited {
	color: #fff;
	text-decoration: underline;
}
#footer a:hover, #footer a:active {
	color: #fff;
	text-decoration: underline;
}






/*About me page style start*/
#aboutWrapper {
	width: 100%;
	font-family: Avenir, 'PingFang SC', sans-serif;
	font-weight: 300;
	color: #796969;
	font-size: 15px;
}
#AbHeader {
	width: 100%;
	background-image: url(images/top_bg.jpg);
	background-repeat: no-repeat;
	background-position: top;
	background-size: 100%;
}
.AbLogoArea {
	width: 96%;
	max-width: 1000px;
	margin: 0 auto;
}
#AbMainLogo {
	display: block;
	width: 105px;
	height: 119px;
	background-image: url(images/main_logo.svg);
	background-size: 85px 99px;
	background-repeat: no-repeat;
	background-position: center;
	padding: 10px;
	text-indent: -9999px;
	border-radius: 12px;
	-webkit-transition: all 200ms;
	-o-transition: all 200ms;
	transition: all 200ms;
	cursor: pointer;
}
#AbContent {
	width: 96%;
	max-width: 1000px;
	margin: 0 auto;
}
#AbContent h2 {
	line-height: 120px;
	font-size: 42px;
	font-weight: bold;
	color: #4E4242;
	padding-top: 20px;
}
.AbInfo {
	padding: 5% 0;
}
#AbContent h3 {
	line-height: 80px;
	font-size: 28px;
	font-weight: bold;
	padding-top: 30px;
	color: #4E4242;
}
#AbContent p {
	font-size: 16px;
	line-height: 32px;
}
#AbFoot {
	width: 100%;
	height: 200px;
	background-image: url(images/vp_bg.jpg);
	background-repeat: no-repeat;
	background-position: top;
	background-size: cover;
}