@charset "utf-8";
/*----------------------------------内页---------------------------------------------------------*/
/*-------
Company Profile
-------*/

/*about company*/
#about-haihun{overflow:hidden; padding-bottom:2rem;}
#about-haihun .com-title{ justify-content: flex-start; align-items: center;}
#about-haihun h2{  padding-top:2rem; text-align:left; text-transform:uppercase;}
#about-haihun p{padding-top:1.5rem;}
#about-haihun p:first-child{ padding-top:4rem;}
#about-haihun h3{ margin-top:4rem;}
#about-haihun  .grid{ margin-top:2rem;grid-template-columns:repeat(2,auto);grid-column-gap:8rem;  }
#about-haihun  a{display:inline-block; position:relative; color:#333;}
.about-haitun-txt{ padding-top:2rem;}
.about-companyitemvideo{ position:relative; padding-top:2rem; }
.about-companyimg{border-radius:20px; overflow:hidden; background-color:#000;}
#video-play{
	position:absolute;
	left:50%;
	top:45%;
}
#video-play svg{ display:block; width:26%; margin:0 auto;}
#video-play  .play-btn:hover #play-button-circle,#video-play .play-btn:hover #play-button-triangle{stroke:var(--web-theme-color);}


/*-------
index-about
-------*/
/*indexabout-data*/
#indexabout-data{ position:relative; overflow:hidden;}
.indexaboutbg{position:absolute; left:0; top:0; width:100%; height:50%;background-color:#F2F5F7; z-index:0;}
.index-comimg{position:relative; z-index:5;}
#indexabout-data h1{ text-align:center; }
#indexabout-data h2{ position:relative; z-index:5; padding-top:1.6rem;}
#indexabout-data h1{ padding-top:2rem; text-transform:capitalize; color:#333;}
#indexabout-data h1 span{font-size:1.8rem; vertical-align:text-top;}
.about-data-unit{ font-size:1.8rem; vertical-align:text-bottom;}
#indexabout-data  .grid{ position:relative; z-index:5;grid-template-columns:repeat(4,auto);}
.indexabout-data-item{ border-right:rgba(255,255,255,.3) solid 1px; padding: 0 8rem;}  
.indexabout-data-item:nth-child(4){ border:none;}
#indexabout-data .indexabout-data-item h1,.indexabout-data-item p{ color:#fff;}
#indexabout-data .index-com-cont p{ text-align:center; padding-top:3rem;}

/*company design*/
#about-design{ position:relative;overflow:hidden; padding-top:0;}
#about-design .com-title{justify-content: center;}
#about-design p{ padding-top:4rem; text-align:center;}
/*swiper*/		
#about-design .gallery-top{ padding-top:6rem;}
#about-design .gallery-top img{ width:100%; overflow:hidden;}
#about-design .gallery-thumbs {
	padding:0 4rem;
	margin-top:2rem;
	overflow: hidden;
}

#about-design .gallery-thumbs .swiper-slide{ position:relative; z-index:6;	border-radius:20px;}
#about-design .gallery-thumbs .swiper-slide.active {
    border: 3px solid var(--web-theme-color-blue);
	border-radius:23px;
}
#about-design .gallery-thumbs img{ width:100%; overflow:hidden;}

#about-design .gallery-thumbs .swiper-button-prev,#about-design .gallery-thumbs  .swiper-button-next{
	height:130%;
	top:0;
	background-color:var(--web-theme-color-gray);
	color:#fff;
	cursor: pointer;
	border-radius:20px;
}
#about-design .gallery-thumbs .swiper-button-next:after, #about-design .gallery-thumbs .swiper-button-prev:after{
	font-size:24px;
	background-color:var(--web-theme-color-gray);
	color:#fff;
	cursor:pointer;
	border-radius:20px;
} 

/*swiper end*/	

/*about-honors*/
#about-honors{padding-top:0;}
.abouthonorbg{ position:relative;}
.abouthonorbg img{ width:100%;}
#about-honors .about-honors-top{
	 position:absolute; 
  left:0; 
  top:0; 
  width:100%; 
  height:100%;
  display: -webkit-flex; 
  display: flex;
justify-content:  center;
align-items: center;	
}
#about-honors h2{ color:#fff;}
#about-honors p{width:min(80%,900px); margin:0 auto; padding-top:2rem;color:#fff; text-align:center;}
#about-honors .grid{ margin-top:10rem; grid-template-columns:repeat(4,1fr); grid-column-gap:1.2rem;}
#about-honors .commore{display:block; width:20rem; margin:0 auto; margin-top:8rem;}

/*about Exhibition*/

#about-exhibition{padding-bottom:20rem;}
#about-exhibition a{ background-color:var(--web-theme-color-blue); color:#fff;border-radius:10px; text-decoration:none; }
#about-exhibition a:nth-child(2){ margin:0 6rem;}
#about-exhibition a h3{ padding:4rem;}
#about-exhibition .wrap-flex{ margin-top:6rem; justify-content:center;}
.exhibition-img{ position:relative; overflow:hidden;}
.exhibition-img img{ width:100%; border-radius:20px 20px 0 0;}
.exhibition-time{
	position:absolute;
	left:0;
	bottom:0;
	width:60%;
	background-color:#F2F5F7;
	border-radius:0 10px 0 0;
	border-bottom:var(--web-theme-color) solid 2px;
	padding:1.2rem 4rem;
	padding-left:0;
	text-align:center;
	color:#333;
}
#about-exhibition a:hover{box-shadow: 0 0 10px rgba(80,80,80,0.4);color:var(--web-theme-color);}
#about-exhibition a:hover img{opacity: .6;}

/*mobile phone*/

@media (max-width:1023px){
/*#about-haihun*/
.about-companyimg{border-radius:8px;}
/*about-data*/
#indexabout-data  .grid{padding-top:6rem;  grid-template-columns:repeat(2,1fr); grid-row-gap:8rem;}
#indexabout-data .index-aboutimg{ display:none;}
#indexabout-data .index-smallaboutimg{ display:block;}
.indexabout-data-item:nth-child(2),.indexabout-data-item:nth-child(4){ border:none;}
#indexabout-data h1{ font-size:4.6rem;}
#indexabout-data  .index-comimg{ margin-top:4rem;} 

/*about company*/
#about-haihun{ padding-bottom:4rem;}
#about-haihun h2{ line-height:1.5em;} 
#about-haihun  .grid{ margin-top:4rem; grid-template-columns:auto; grid-column-gap:0; grid-row-gap:4rem; }
#about-haihun p{ width:100%; margin:0 auto; margin-top:0; font-size:10px;}
#about-haihun .wrap-flex-1{ flex-direction: column; margin-top:4rem; }
#about-haihun .about-bottomimg{margin-top:2rem;}
#about-haihun .about-bottomimg:last-child{ margin-left:0;}

/*company design*/

#about-design{ position:relative;overflow:hidden; padding-top:2rem; padding-bottom:4rem;}
#about-design h2{ padding-top:1.6rem;}
#about-design p{ width:100%; margin:0 auto;}
/*swiper*/	
#about-design .gallery-top .swiper-slide .sy-rounded{border-radius:5px;}
#about-design .gallery-thumbs .swiper-slide .sy-rounded{border-radius:5px;}
#about-design .gallery-thumbs .swiper-slide.active {border-radius:8px;}
#about-design .gallery-thumbs .swiper-button-prev,#about-design .gallery-thumbs  .swiper-button-next{
	display:none;
}
#about-design .gallery-thumbs .swiper-button-next:after, #about-design .gallery-thumbs .swiper-button-prev:after{
display:none;
} 
#about-design .gallery-top{ margin-top:4rem; padding-top:2rem;}

/*about-honors*/
#about-honors .grid{ margin-top:4rem; grid-template-columns:repeat(2,1fr); grid-column-gap:4rem;grid-row-gap:4rem;}
#about-honors p{width:min(100%,400px); margin:0 auto; padding-top:2rem;color:#fff;}
.about-honorsimg{ margin-left:4rem;}
#about-honors .about-honorsimg{ margin-top:2rem; margin-left:0;}
#about-honors .commore{display:block; width:24rem; }

#about-exhibition{ padding-bottom:4rem;} 
#about-exhibition .wrap-flex{   flex-direction: column; margin-top:4rem; justify-content:center;}
#about-exhibition .showmeeting-tiem:nth-child(2){ margin:2rem 0;}
#about-exhibition h1{ display:none;}
#about-exhibition .com-txt{color:#333;}
#about-exhibition .indexnewsmore{ margin-top:2rem; }
#about-exhibition a:nth-child(2){ margin:0; margin:4rem 0;}
#about-exhibition .indexnewsmore:nth-child(1){ margin-bottom:2rem;}
#about-exhibition .indexnewsmore:nth-child(2){ margin:0;}

}