/* 移动优先 */
/* Author: */
/* Contact: soft@0523cn.com*/
/* WebSite: www.0523cn.com*/

/* ---mobile models--- */
header{
	height: 6.25rem;
	position:fixed;
	width:100%;
	/* background: linear-gradient(#54d4ff 50%,#9cfb8f); */
	background-color: rgba(255,255,255,.85);
	z-index: 10;
	padding: 0rem 1rem;
	box-shadow: 3px 3px 10px rgba(0,0,0,0.3);
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
}

.index-logo{
	padding:1rem 0;
	height: 100%;
	flex: 0 0 auto;
}
.index-logo>img{
	height: 100%;
}
.index-menubar{
	
	flex: 0 0 auto;
	display: flex;
	flex-flow: row nowrap;
	justify-content: left;
	align-items: stretch;
}
.index-menubar>li{
	flex:0 0 auto;
	list-style: none;
	padding: 0 2rem;
	display: flex;
	align-items: center;
	transition: background 0.4s ease-in-out 0s;
}
.index-menubar>li:hover{
	background-color: rgba(168, 25, 113, 0.8);
}
.index-menubar>li:hover>a{
	color: #fff;
	transition: color 0.4s ease-in-out 0s;
}
.index-menubar>li>a{
	color: rgba(154, 16, 76, 1);
	font-size: 1.125rem;
}
.mobile-menu{
/* 	flex: 0 0 auto;
	display: flex;
	align-items: center; */
	display: none;
}
.mobile-menu>.hnetdaohang1{
	font-size: 3rem;
	color: #313131;
}
.index-body{
	width:100%;
	height: 100vh;
	display: flex;
	flex-flow: row nowrap;
}

.index-body-item{
	text-align: center;
	flex:0 1 33.33333%;
	height: 100vh;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: flex 0.5s ease 0s;
	position: relative;
}
.index-body-item>img{
	height: 100%;
	filter: brightness(50%);
	transition: filter 0.5s ease-in-out .3s,transform 0.4s ease-out .5s;
}
.index-body-item:hover img{
	filter: brightness(90%);
	transform: scale(1.5);
}
.index-body-item:hover{
	flex:0 1 60%;
}
.index-about,.index-product,.index-contact{
	position: absolute;
	text-align: center;
}
.index-body-item:nth-child(1):hover .index-about-content{
	/* visibility: visible; */
}
.index-about-content{
	width:20vw;
	text-align: left;
	color: #fff;
	line-height: 2;
	/* visibility: hidden; */
	transition: all 0.5s ease-in-out
}
.index-about-logo{
	margin: auto;
	width: 6.25rem;
	height: 6.25rem;
	background-color: azure;
}
.index-body-item:nth-child(1):hover .index-about-tit{
	color: #ff5500;
	/* font-size: 4rem; */
	background-color: rgba(255,255,255,.5);
	/* box-shadow: 0 3px 10px rgba(120, 120, 120, 0.8); */
}
.index-body-item:nth-child(1):hover .index-about-keywords-item:nth-child(1){
	opacity: 100;
	top:0px;
}
.index-body-item:nth-child(1):hover .index-about-keywords-item:nth-child(2){
	opacity: 100;
	top:0px;
}
.index-body-item:nth-child(1):hover .index-about-keywords-item:nth-child(3){
	opacity: 100;
	top:0px;
}

.index-body-item:nth-child(2):hover .index-about-tit{
	color: #ff5500;
	/* font-size: 4rem; */
	background-color: rgba(255,255,255,.5);
	/* box-shadow: 0 3px 10px rgba(120, 120, 120, 0.8); */
}
.index-body-item:nth-child(2):hover .index-about-keywords-item:nth-child(1){
	opacity: 100;
	top:0px;
}
.index-body-item:nth-child(2):hover .index-about-keywords-item:nth-child(2){
	opacity: 100;
	top:0px;
}
.index-body-item:nth-child(2):hover .index-about-keywords-item:nth-child(3){
	opacity: 100;
	top:0px;
}

.index-body-item:nth-child(3):hover .index-about-tit{
	color: #ff5500;
	/* font-size: 4rem; */
	background-color: rgba(255,255,255,.5);
	/* box-shadow: 0 3px 10px rgba(120, 120, 120, 0.8); */
}
.index-body-item:nth-child(3):hover .index-about-keywords-item:nth-child(1){
	opacity: 100;
	top:0px;
}
.index-body-item:nth-child(3):hover .index-about-keywords-item:nth-child(2){
	opacity: 100;
	top:0px;
}
.index-body-item:nth-child(3):hover .index-about-keywords-item:nth-child(3){
	opacity: 100;
	top:0px;
}

.index-about-tit{
	margin: auto;
	width: fit-content;
	letter-spacing: .5rem;
	font-size:2rem;
	
	font-weight:700;
	padding: 0.625rem 2rem;
	background-color: none;
	transition: all 0.5s ease-in-out;
	border-radius: 1rem;
}
.index-about-tit a{
	color: #fff;
}
.index-about-keywords{
	padding:1rem 0;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-around;
}
.index-about-keywords-item{
	position: relative;
	top:50px;
	flex:0 0 auto;
	margin:0 0.3125rem;
	padding:0 0.875rem;
	line-height: 2;
	border-radius: 1rem;
	background-color: #41a4c5;
	color: #fff;
	font-size: 0.875rem;
	opacity: 0;
	
}
.index-about-keywords-item:nth-child(1){
	transition: all 0.5s ease-in-out .1s;
}
.index-about-keywords-item:nth-child(2){
	transition: all 0.5s ease-in-out .2s;
}
.index-about-keywords-item:nth-child(3){
	transition: all 0.5s ease-in-out .3s;
}





footer{
	border-top: 5px solid  #419fb6;
	/* background-color: #3d3d3d; */
	background-color: #0e332d;
	padding:2rem 1rem;
	display: flex;
	flex-flow: row nowrap;
}
.footer-logo{
	flex: 0 0 20%;
	text-align: center;
}
.footer-logo>img{
	width: 5rem;
	vertical-align: bottom;
}
.footer-contact{
	flex: 0 0 60%;
	line-height: 2;
}
.footer-contact>p{
	color: #d9d9d9;
}

.footer-qrcode{
	text-align: center;
	flex: 1 0 auto;
	color: #fff;
	line-height: 2;
}
.footer-qrcode>img{
	width: 6rem;
	vertical-align: bottom;
}

/* ---pc models--- */
@media (min-width:1200px) {
	
}

​