body{background: #F1F0F0;}
.inforport h2{ border-bottom: 1px solid #d3d1d1;margin-top: 30px; }
.inforport h2 span{font-size: 24px;display: inline-block;border-bottom:1px solid #000000 ;}
.inforport h3{font-family: "Geometria";color: #595656;font-size: 16px;}
.inforport h4{ color: #000000;font-size: 20px;margin-top: 15px;margin-bottom: 10px;}
.inforport p{ text-indent: 2em;font-size: 16px;line-height: 22px;color: #595757;margin-bottom: 8px;}
.inforport .map{margin-top: 30px; width: 70%;margin-left: 15%;margin-bottom: 40px;}
.inforport .power-main{background: #FFFFFF;overflow: hidden;margin-top: 50px;padding: 50px;margin-bottom: 40px;}
.inforport .power-main p{ text-indent: 0; }
.inforport .power-main .left-sild{float: left; width: 220px;margin-top: 50px; display: none;}
.inforport .power-main .left-sild.on{ display: block; }
.power-main .left-sild .title{ font-size: 18px;border-bottom: 1px solid #000000;padding-bottom: 15px;margin-bottom: 15px; }
.inforport .power-main .right-sild{position: relative; float: right;width: 770px;height: 300px; background: url(../images/4_03.jpg)no-repeat center;background-size: contain; }

.inforport .right-sild .ziyuan{ position: absolute; }
.right-sild .ziyuan span{cursor: pointer; text-align: center; position: absolute;left:70px;top: -35px; padding: 5px;width: 50px;}
.right-sild .ziyuan.on span{ background: #343231;color: #FFFFFF; }
.right-sild .ziyuan.on span:after{content: '';position: absolute;left: 22px;top: 30px; width: 5px;height: 5px;border-radius: 50%; background: #343231;}
.right-sild .ziyuan .logo{ cursor: pointer;position: absolute;left:19px;top: 14px; width: 160px;height:160px;background: url(../images/icon01.png)no-repeat center;background-size: contain; }
.right-sild .ziyuan.on .logo{background-image: url(../images/icon02.png);}

.inforport .right-sild .fuwu{ position: absolute;right:385px;top: 0;}
.right-sild .fuwu span{cursor: pointer; text-align: center; position: absolute;left:70px;top: -35px; padding: 5px;width: 50px;}
.right-sild .fuwu.on span{ background: #343231;color: #FFFFFF; }
.right-sild .fuwu.on span:after{content: '';position: absolute;left: 22px;top: 30px; width: 5px;height: 5px;border-radius: 50%; background: #343231;}
.right-sild .fuwu .logo{ cursor: pointer;position: absolute;left:19px;top: 14px; width: 160px;height:160px;background: url(../images/icon05.png)no-repeat center;background-size: contain; }
.right-sild .fuwu.on .logo{background-image: url(../images/icon06.png);}

.inforport .right-sild .zhiku{ position: absolute;left:185px;bottom: 188px;}
.right-sild .zhiku span{cursor: pointer; text-align: center; position: absolute;left:70px;top: 200px; padding: 5px;width: 50px;}
.right-sild .zhiku.on span{ background: #343231;color: #FFFFFF; }
.right-sild .zhiku.on span:after{content: '';position: absolute;left: 22px;top: -8px; width: 5px;height: 5px;border-radius: 50%; background: #343231;}
.right-sild .zhiku .logo{ cursor: pointer;position: absolute;left:19px;top: 14px; width: 160px;height:160px;background: url(../images/icon03.png)no-repeat center;background-size: contain; }
.right-sild .zhiku.on .logo{background-image: url(../images/icon04.png);}

.inforport .right-sild .ziben{ position: absolute;right:185px;bottom: 188px;}
.right-sild .ziben span{cursor: pointer; text-align: center; position: absolute;left:70px;top: 200px; padding: 5px;width: 50px;}
.right-sild .ziben.on span{ background: #343231;color: #FFFFFF; }
.right-sild .ziben.on span:after{content: '';position: absolute;left: 22px;top: -8px; width: 5px;height: 5px;border-radius: 50%; background: #343231;}
.right-sild .ziben .logo{ cursor: pointer;position: absolute;left:0px;top: 14px; width: 160px;height:160px;background: url(../images/icon07.png)no-repeat center;background-size: contain; }
.right-sild .ziben.on .logo{background-image: url(../images/icon08.png);}

#gallery{background: #FFFFFF;margin-bottom: 40px;}
#gallery .swiper-wrapper .swiper-slide{overflow: hidden;}
#gallery .swiper-wrapper .text{ float:left;width: 60%; padding: 3%;}
.swiper-wrapper .text h4 span{font-size: 24px;border-bottom: 1px solid #F39800;display: inline-block;}
.swiper-wrapper .text h5{color: #595656;font-size: 16px;margin-bottom: 15px;}
#gallery .swiper-wrapper img{ float: right; width: 40%; }
#thumbs{ margin: 50px 0; }
#thumbs .swiper-wrapper p{text-align: center;}
#thumbs .swiper-slide { opacity: 0.4;}
#thumbs .swiper-slide-thumb-active { opacity: 1; }
.button-cover{position: relative; width: 100%;display: none; }

.styst-main{ margin-top: 30px;margin-bottom: 40px; }
.styst-main ul{display: flex;}
.styst-main ul>li{width: 25%;margin: 0 0.2%;overflow: hidden;transition: all 0.6s;position: relative;}
.styst-main ul>li img{ height: 500px;width: auto;max-width: none;transition: all 0.6s; }
.styst-main ul>li .textBox{position: absolute;width: 100%;height: 16%;bottom: 0;background: rgba(85,83,83,0.9);transition: all 0.6s;padding: 0 30px;}
.styst-main ul>li .textBox h5{font-size: 20px;color: #fff;text-align: center;transition: all 0.6s;margin-top: 20px;}
.styst-main ul>li .textBox h6{font-size: 14px;color: #fff;text-align: center;transition: all 0.6s;margin-bottom: 10px;}
.styst-main ul>li .textBox p{ text-indent: 0; }
.styst-main ul>li .textBox .text-main{font-size: 14px;color: #fff;line-height: 26px;transition: all 0.6s;opacity: 0;}

.styst-main ul>li.on{width: 40%;}
.styst-main ul>li.on img{ transform: scale(1.1); }
.styst-main ul>li.on .textBox{height: 100%;}
.styst-main ul>li.on .textBox h5{text-align: left;margin-top: 60px;}
.styst-main ul>li.on .textBox h6{text-align: left;border-bottom: 1px solid #F39800;color: #999999;}
.styst-main ul>li.on .textBox .text-main{opacity: 1;}
@media only screen and (max-width: 768px) {
	.styst-main ul{flex-wrap: wrap;}
	.styst-main ul>li{ width: 100%;margin-bottom: 20px;height: 150px; }
	.styst-main ul>li.on{width: 100%;height: 300px;}
	.styst-main ul>li .textBox{height: 80px;}
	.styst-main ul>li.on .textBox h5{margin-top: 20px;}
	.inforport .map{ width: 80%;margin-left: 10% }
}


@media  screen and (max-width:768px ) {
	.inforport .power-main .left-sild{float: none;}
	.inforport .power-main .right-sild{float: none;width: 280px;margin: 0 auto;}
	.inforport .power-main{ padding: 10px; }
	.inforport .right-sild .fuwu{  right: 243px;top: 47px; }
	.inforport .right-sild .ziyuan{ left: 0;top: 100px; }
	.inforport .right-sild .zhiku{ left: 54px;top: 127px; }
	.inforport .right-sild .ziben{  left: 215px;top: 127px; }
	.right-sild .ziyuan .logo{ left: 4px;top: 0; }
	.right-sild .ziyuan .logo,.right-sild .ziben .logo,.right-sild .fuwu .logo,.right-sild .zhiku .logo{ width: 60px;height: 60px; }
	.right-sild .fuwu .logo{ left: 110px;top: 50px; }
	.right-sild .ziyuan span{ left: 10px;top: -40px; }
	.right-sild .ziben span{ left: 7px;top: 89px; }
	.right-sild .zhiku span{ left: 23px;top:89px ; }
	.right-sild .fuwu span{ left: 114px;top:13px; }
	.inforport .power-main .left-sild{margin-top: 0px;}
	#thumbs{margin: 20px 0;}
	#gallery .swiper-wrapper .text{ width: 100%;float: none; }
	#gallery .swiper-wrapper img{ width: 100%;float: none; }
	.button-cover{ display: block;top: -30px;}
	#thumbs .swiper-wrapper p{margin-top: 15px;}
	.swiper-button-prev, .swiper-container-rtl .swiper-button-next,.swiper-button-next, .swiper-container-rtl .swiper-button-prev{ background: none; }
	
}