@charset "utf-8";
/*	pc style	*/

.pop-mod{ color: #fff;}
.pop-mod .pop-dialog{ display: table; width: 100%; height: 100%;}
.pop-mod .cont{ display: table-cell; padding: 90px; vertical-align: middle;}
.pop-info{}
.pop-info .h20{ margin-bottom: 30px; font-size: 20px;font-family: 'hyxlsj';}
.pop-info .h16{ margin-bottom: 18px; font-size: 16px;}
.pop-info .h16 span{ margin-right: 25px;}
.pop-info .p{ margin-bottom: 8px;}
.pop-info .scroll1 {position: absolute;top: 90px;bottom: 90px;left: 0;margin: 0 90px;}
.pop-info .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {opacity: 1;}

.pop-help{ text-align: center;}
.pop-help .h30{ margin-bottom: 25px; font-size: 30px;}
.pop-help .h25{ margin-bottom: 25px; font-size: 25px;}
.pop-help .list{ display: inline-block; margin-bottom: 80px; overflow: hidden;}
.pop-help .cir{ float: left; margin: 0 16px; width: 175px; height: 175px; border-radius: 50%; }
.pop-help .icon{ margin: 25px auto 15px; width: 65px; height: 65px; overflow: hidden;}
.pop-help .icon img{ display: block; width: 100%;}
.pop-help .h18{ font-size: 18px;}
.pop-help .h16{ font-size: 16px;}

.details{ /*background: url(../image/temp/img1.jpg); */overflow: hidden; z-index: 2;}
.details .x-wrap{ position: absolute; left: 0; right: 0; top: 0; bottom: 0;}

.tools{ position: absolute; top: 30px; right: 0; white-space: nowrap;}
.tools .link{ display: inline-block; margin: 0; padding: 0; min-width: 22px; line-height: 42px; vertical-align: top; text-align: center; background: #fff; background-size: contain; border-radius: 999px;
	float: none;
	font-size: inherit;
	height: auto;
}
.tools .link:first-child{ padding: 0 20px;}
.tools .link + .link{ margin-left: 4px; width: 42px; height: 42px;}
.tools .link:first-child + .link{ margin-left: 20px;}
.tools .icon-wchat{ background-image: url(../image/temp/png18.png);}
.tools .icon-sinawb{ background-image: url(../image/temp/png19.png);}
.tools .icon{ width: 20px; height: 22px; margin-right: 5px;}
.bd_weixin_popup{ width: 270px !important; height: 320px !important;}

.section{ position: absolute; left: 0; top: 0; bottom: 0; margin: auto; width: 100%; }
.section .text {position: absolute;left: 8%;top: 12%;z-index: 9;color: #fff;text-shadow: 0px 0px 15px #ccc;}
.section .text .h30{ margin-bottom: 14px; font-size: 30px; text-align: center;/*font-family: 'hyxlsj';*/}
.section .text .h25{ margin-bottom: 14px; font-size: 25px; text-align: center;font-family: 'hyxlsj'}
.section .text .h18 {line-height: 1.8;font-family: 'hyxlsj';width: 30%}
.section .view{ position: absolute;/* height: 605px;*/left: 0;top: 0;bottom: 0;right: 0;}
.section .view.full{ position: fixed; left: 0; right: 0; top: 0; bottom: 0; margin: 0; height: auto; z-index: 999;}
.section .handle{ position: absolute; right: 0; top: 50%; /*margin-top: -101px; height: 202px; */z-index: 2;}
.section .handle .item{ width: 66px; height: 66px; cursor: pointer;position: relative;}
.section .handle .item.sharebox{background:url(../image/temp/png21.png) no-repeat center;}
.section .handle .item.sharebox:hover{background-image:url(../image/temp/png21-1.png)}
.section .handle .item + .item{ margin-top: 2px;}
.section .handle .item img{ display: none; width: 100%;}
.section .handle .item img:first-child{ display: block;}
.section .handle .item.on img{ display: block;}
.section .handle .item.on img:first-child{ display: none;}
.section .handle .item.i1{background:url(../image/temp/png20.png) no-repeat center;}
.section .handle .item.i3{background:url(../image/temp/png4.png) no-repeat center;}
.section .handle .item.i4{background:url(../image/temp/png5.png) no-repeat center;}

.section .handle .item.i1:hover{background:url(../image/temp/png20-1.png) no-repeat center;background-size:cover;}
.section .handle .item.i3:hover{background:url(../image/temp/png4-1.png) no-repeat center;background-size:cover;}
.section .handle .item.i4:hover{background:url(../image/temp/png5-1.png) no-repeat center;background-size:cover;}

.listpage{ background: url(../image/temp/img1.jpg); overflow: hidden;}
.listpage .bannar{ position: relative; height: 733px; background: center top no-repeat; background-size: cover;}
.listpage .bannar .cont{ padding-top: 180px; width: 50%; color: #fff;}
.listpage .bannar .txt{ width: 443px; height: 108px; overflow: hidden;}
.listpage .bannar .txt img{ display: block; width: 100%;}
.listpage .bannar .h48{ margin-bottom: 22px; font-size: 48px; text-transform: uppercase;}
.listpage .bannar .p{ margin-bottom: 55px;}
.listpage .bannar .link{ display: inline-block; min-width: 215px; line-height: 55px; text-align: center; font-size: 18px; border: 1px solid; border-radius: 999px;}
.listpage .bannar .link .ico{ width: 35px; height: 35px; vertical-align: -10px;}
.listpage .search-wrap{ position: relative; padding: 22px 0; background: #fff url(../image/temp/img3.jpg) center no-repeat; text-align: center; z-index: 2;}
.listpage .select-mod{ display: inline-block; vertical-align: top; width: 345px; font-size: 16px;}
.listpage .search-txt{ display: inline-block; margin-left: 14px; vertical-align: top; padding: 10px 25px; width: 308px; border: 1px solid #e8e8e8; border-radius: 999px;}
.listpage .search-txt input{ width: 100%; font-size: 16px; height: 24px;}
.listpage .serch-btn{ display: inline-block; margin-left: 24px; width: 180px; background-color: #c49453; vertical-align: top; font-size: 16px; color: #fff; line-height: 46px; border-radius: 999px; cursor: pointer;}
.listpage .serch-btn .ico{ width: 21px; height: 21px; margin-right: 5px;}
.listpage .waterfall{ position: relative; padding: 80px 0 108px; z-index: 1;}
.listpage .waterfall .list{ position: relative;}
.listpage .waterfall li{ position: relative; width: 301px; background: url(../image/opacity-w50.png); overflow: hidden;}
.listpage .mask{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; opacity: 0; background: url(../image/opacity-b50.png); visibility: hidden; text-align: center; color: #fff;
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	transform: scale(1.2);
	
	-webkit-transition: transform .5s, opacity .5s, visibility .5s;
	-moz-transition: transform .5s, opacity .5s, visibility .5s;
	transition: transform .5s, opacity .5s, visibility .5s;
}
.listpage .mask .txt{ display: inline-block; vertical-align: middle; width: 80%; letter-spacing: 0; font-size: 14px;}
.listpage .mask .h16{ font-size: 16px;}
.listpage .waterfall li:hover .mask{ opacity: 1; visibility: visible;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	transform: scale(1);
}

/*	复用图片包裹	*/
.scaleimg{ overflow: hidden;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}
.scaleimg img{ width: 100%; height: auto;
	-webkit-transition: transform .5s;
	transition: transform .5s;
}
.scaleimg:hover img{
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
	


/*	mobile style	*/
@media screen and (max-width: 750px){
	
	.pop-mod .pop-dialog{ display: block; overflow: auto;}
	.pop-mod .cont{ display: block; padding: 0.2rem;}
	.pop-info .h20{ margin-bottom: 0.3rem; font-size: 0.4rem;}
	.pop-info .h16{ margin-bottom: 0.2rem; font-size: 0.32rem;}
	.pop-info .h16 span{ margin-right: 0.2rem;}
	.pop-info .p{ margin-bottom: 0.1rem;}
	
	.pop-info .scroll1 {top: 1rem;bottom: 0.6rem;margin: 0 0.4rem;}
	.pop-info .scroll1 .mCSB_inside > .mCSB_container {margin-right: 0.3rem;}
	
	.pop-help{ font-size: 0;}
	.pop-help .h30{ margin-bottom: 0.3rem; font-size: 0.5rem;}
	.pop-help .list{ display: block;}
	.pop-help .cir{ float: none; display: inline-block; vertical-align: top; margin: 0 0.2rem 0.2rem; width: 2.5rem; height: 2.5rem;}
	.pop-help .icon{ margin: 0.2rem auto; width: 0.5rem; height: 0.5rem;}
	.pop-help .h18{ font-size: 0.32rem;}
	.pop-help .h16{ font-size: 0.28rem;}

	.details .x-wrap{ position: relative;}
	
	.tools{ top: 0.5rem; left: 0.25rem; right: 0.25rem; text-align: center;}
	.tools .link{ margin: 0 0.1rem; line-height: 0.8rem;}
	.tools .icon{ width: 0.3rem; height: 0.33rem; margin: 0 0.1rem;}
	.tools .link:first-child{ padding: 0 0.2rem; min-width: 2.8rem;}
	.tools .link + .link{ margin-left: 0.05rem; width: 0.8rem; height: 0.8rem;}
	.tools .link:first-child + .link{ margin-left: 0.2rem;}
	
	.section{ position: static; padding: 2rem 0 1rem;height: auto;}
	.section .h34{ margin-bottom: 0.2rem; font-size: 0.5rem;}
	.section .view{ margin:0; height: 100%;}
	.section .text{left:0;right:0;top:0.3rem;padding:0 0.3rem 0.6rem;}
	.section .text .h30{text-align:left;line-height: 1.5;margin-bottom:0;font-size:0.5rem;width: 40%}
	.section .handle{ margin-top: 0; height: auto;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	.section .handle .item{ width: 0.6rem; height: 0.6rem; background-size: 100% 100% !important;}
	.share-box{right:104%;}
	.section .handle .item + .item{ margin-top: 0.05rem;}
	/* .section .handle .item:last-child{ display: none;} */
	.share-box a.share-item{height:100%;width:0.6rem;line-height:0.6rem;}
	.share-box a.share-item img{}

	.listpage .bannar{ height: 7rem;}
	.listpage .bannar .cont{ padding-top: 1rem; width: 100%; color: #fff;}
	.listpage .bannar .txt{ width: 4rem; height: auto;}
	.listpage .bannar .h48{ margin-bottom: 0.2rem; font-size: 0.5rem;}
	.listpage .bannar .p{ margin-bottom: 0.2rem;}
	.listpage .bannar .link{ min-width: 3rem; line-height: 0.6rem; font-size: 0.3rem;}
	.listpage .bannar .link .ico{ margin-right: 0.05rem; width: 0.3rem; height: 0.3rem; vertical-align: middle;}
	.listpage .search-wrap{ padding: 0.5rem 0; background: #fff;}
	.listpage .select-mod{ display: block; width: 100%; font-size: 0.28rem;}
	.listpage .search-txt{ display: block; margin-left: 0; margin-top: 0.2rem; padding: 0.1rem 0.2rem; width: 100%;}
	.listpage .search-txt input{ font-size: 0.28rem; height: 0.42rem;}
	.listpage .serch-btn{ display: block; margin-left: 0; margin-top: 0.2rem; padding: 0.1rem; width: 100%; font-size: 0.28rem; line-height: 1.5;}
	.listpage .serch-btn .ico{ width: 0.25rem; height: 0.25rem; margin-right: 0.1rem;}
	.listpage .waterfall{ padding: 1rem 0;}
	.listpage .waterfall li{ width: 3.4rem;}
	.listpage .waterfall li:before, .listpage .waterfall li:after{ height: 50%;}
	
}