@charset "UTF-8";
  
.banner{ margin-top: .8rem; min-height: 560px; position: relative;}   
.banner_main{position: relative;}
.banner_main .banner_left{ max-width: 40%;}
.banner_main_img{ max-width: 50%; position: absolute; top: 0; right: 0;}
.banner_main_mobile{ display: none;}
.banner_left{ margin-top: .6rem;}
.banner_right{ position: absolute; right: 0;top: 0;}
.banner_right img{ max-width: inherit;}
.banner_right p{ width: 150px; display: inline-block; vertical-align: top; overflow: hidden; transition:all .3s ease-in-out; position: relative; border-radius: 20px 0 0 0; }
.banner_img1{ top: 0; right: -80px;}
.banner_img2{ top: -54px; right: -40px;}
.banner_img3{ top: -80px; right: 0;}
/* .banner_right .banner_img1{ width: 550px; border-radius: 60px 0 0 0;} 
.banner_right p:hover, .banner_right .banner_img1{ width: 550px; border-radius: 60px 0 0 0;} 
.banner_right .banner_img1{ position: absolute; right: 220px;} */



/* .banner_right p{ width: 150px; height: 500px; position: absolute; top: 0; right: 0; overflow: hidden; border: 1px solid red;}
.banner_right .banner_img1{ right: 120px; border-radius: 20px 0 0 0; z-index: 1;}
.banner_right .banner_img2{height: 550px; top: -50px; right: 30px; border-radius: 20px 0 0 0; z-index: 2;}
.banner_right .banner_img3{height: 580px; top: -80px; right: -40px; border-radius: 20px 0 0 0; z-index: 3;}
 */
 
 
 
 
/* .banner_right .banner_active{ width: 700px; border-radius: 60px 0 0 0; transition: width .3s ease-in-out; opacity: 1;}
.banner_right .banner_next1{height: 550px; top: -50px; right: 30px; border-radius: 20px 0 0 0; z-index: 2;}
.banner_right .banner_next2{height: 580px; top: -80px; right: -40px; border-radius: 20px 0 0 0; z-index: 3;} */

   
   
.section{ margin-top: 1.4rem;} 
.section h1{ font-size: .6rem; font-weight: 700;}
.section h2{ font-size: .6rem; font-weight: 600;}
.section p{ margin-top: .3rem; font-size: .2rem;}

.section1{ margin-top: 1.8rem; background: url(../about/img/section1_background.png) no-repeat;}
.section1_main{ max-width: 920px; margin: 0 auto;}  
.section1_main_mobile{ display: none;}
.section1_main_img{margin: 1.29rem auto 0; display: block;}


.section2{width: 100%;height: 13.6rem;background: url(../about/img/section2_bg.png)center no-repeat;padding-top: 1.55rem;}
.section2 .cont2_item {max-width: 1400px;width: 96%; margin: 0 auto;;background: #FFFFFF;border-radius: .6rem;padding: 0.6rem 0;text-align: center;box-sizing: border-box;}
.cont_img{max-width: 6.38rem;}
.cont2_item .cont_text {
    max-width: 486px;
    margin: 0 .7rem;
    text-align: left;
    direction: ltr;}
.cont2_item>div {
    display: inline-block;
    vertical-align: middle;
}
.cont_text h3{color: #333;text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);font-size: .36rem;}
.cont_text p{font-size: .18rem;margin-top: .2rem;}
.section2_text{max-width: 10.02rem; margin: .59rem auto 0;}
.section2_text h3{color: #FFF;text-align: center;font-size: .6rem;font-weight: 700;}
.section2_text p{color: #FFF;text-align: center;font-weight: 400;margin-top: .26rem;}



.section3{ min-height: 800px; background: url(../about/img/section3_background.png) center no-repeat; overflow: hidden;}
.section3_main{ max-width: 904px; margin-top: 1rem;}
.section3_main img{ display: none;}

.section4_block{width:31%; margin-bottom: 1.5rem; display: inline-block; vertical-align: top; position: relative; border-radius: 10px;}  
.section4_block2, .section4_block3{ max-width: 370px;}
.section4_block img{ position: absolute; top: -0.7rem; left: 0;}
.section4_block1 img{top: -5px; left: -35px;}
.section4_block p{ max-width: 370px; margin:.4rem auto; font-size: .36rem; font-weight: 600; color: #000;}
.section4_block2 p, .section4_block3 p{ max-width: 280px;}

.section4_block2{ margin: 0 60px 0 130px; background:#E9F0FF url(../about/img/section4_backgroun1.png) center no-repeat; background-size: cover;}
.section4_block3{ background: #F1F1F1 url(../about/img/section4_backgroun2.png) center no-repeat; background-size: cover;}
.section4_block4{ background: #E9F5ED url(../about/img/section4_backgroun3.png) center no-repeat; background-size: cover;}
.section4_block5{ margin-left: .4rem; margin-right: .4rem; background: #F1F1F1 url(../about/img/section4_backgroun4.png) center no-repeat; background-size: cover;}
.section4_block6{ background: #FFEFDE url(../about/img/section4_backgroun5.png) center no-repeat; background-size: cover;}
  
.section5{ margin-top: 0;}  
.section5 h2{ margin-bottom: 1rem;} 

.section6{margin: 0 auto;}
.section6 a{ width:80px; height:70px; font-size: .28rem; display:inline-block;  margin: .3rem .25rem; background: url(../about/img/social_background.png) no-repeat; color: #333; line-height: 70px; background-size: 80px auto;}  
.section6 .icon_ytb{ font-size: .2rem;}
.social_fb:hover{ background: url(../about/img/social_backgound2.png) no-repeat; background-size: 80px auto; color: #fff;}
.social_tw:hover{ background: url(../about/img/social_backgound1.png) no-repeat; background-size: 80px auto; color: #fff;}
.social_ins:hover{ background: url(../about/img/social_backgound3.png) no-repeat; background-size: 80px auto; color: #fff;}
.social_in:hover{ background: url(../about/img/social_backgound4.png) no-repeat; background-size: 80px auto; color: #fff;}
.social_ytb:hover{ background: url(../about/img/social_backgound5.png) no-repeat; background-size: 80px auto; color: #fff;}
  
  
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min--moz-device-pixel-ratio:1.5), only screen and (-o-min-device-pixel-ratio:3/2), only screen and (min-device-pixel-ratio:1.5) {
}


@media screen and (max-width: 1400px){
	.section4_block{ width: 45%; max-width: inherit; margin: 0 2% 1.5rem 2%;}
	/* .section4_block2{ margin: 0 .6rem;}
	.section4_block5{ margin-left: 1.5%; margin-right: 1.5%;} */
}

@media screen and (max-width: 1300px){
	.cont_img{margin-bottom: .2rem;max-width: 4rem;}
}

@media screen and (max-width: 980px){
	 .section2_img{ width: 80%; float: none; display: block; margin: .7rem auto 0 auto;}
	 
	 .section2_text{ width: 98%; max-width: 100%; float: none; display: block; margin: 20px auto; text-align: center;}
	 .section4_block p{ max-width: 90%;}
	 
	 .section3{ min-height: auto; background: #F2F6FF;}
	 .section3_main img{ display: block;}
	 
}


@media screen and (max-width: 750px){
	.banner{ min-height: auto;}
	 .section1{ background: none;}
	 .section4_block1{ text-align: center;}
	 .section4_block1>img{ display: none;}
	 .section4_block{ width: 100%;}
	 .section4_block img{width: 0.8rem;}
	 
	 
	 .banner_main .banner_left{ max-width: 100%}
	 .banner_main_img{ max-width: 100%; position: relative; right: 0; }
	 
	
	
}