@media only screen and (min-width: 320px) {
	html {
		font-size: 62.5% !important;
	}
}
.topFixed .changeTab span.act{color:#fff!important;}
@media only screen and (min-width: 640px) {
	html {
		font-size: 125% !important;
	}
}

@media only screen and (min-width: 750px) {
	html {
		font-size: 150% !important;
	}
}

@media only screen and (min-width: 1242px) {
	html {
		font-size: 187.5% !important;
	}
}

.sumOne {
	padding-top: 3.2rem;
	padding-bottom: 1.5rem;
	background: #FAFAFA;
}

.sumImage {
	width: 100%;
}


.sumDetail .speakDetail .img,.boxOuter .designDetail img {
	width: 100%
}

.sumTitle {
	color: #080808;
	font-size: 1.4666rem;
	font-family: "Noto Sans S Chinese Bold"!important
}

.textTitle,
.transTitle {
	color: #080808;
	font-size: 1.467rem;
	font-family: "Noto Sans S Chinese Bold"!important;
	margin-bottom: 5%;
}

.sumTitle1 {
	text-align: center;
	font-size: 1.4666rem;
	line-height: 150%;
}

.sumContent {
	text-align: left;
	font-size: 0.6rem;
	color: #3e3e3e;
	margin-top: 1rem;
	margin-bottom: 2.3rem;
	word-break: normal;
	line-height: 250%;
}

.textContent,
.transContent {
	font-size: 0.6rem;
	color: #3e3e3e;
	word-break: normal;
	line-height: 250%;
}

.sumContent1 {
	text-align: center;
}

.sumTwo {
	padding-top: 4.3rem;
	padding-bottom: 5.67rem;
}

.twoTr {
	width: 100%;
}

.bottomTr {
	margin-bottom: 0.667rem;
}

.s_auto {
	width: 1200px;
	margin: 0 auto
}

.twoTr>div {
	width: 49.167%;
	height: 20rem;
	float: left;
	background-color: #FAFAFA;
	margin-right: 1.477%;
}

.textNo {
	margin-right: 0!important
}

.twoText {
	padding: 6.8%;
}

.twoImage1 {
	background: url(/images/detail/design/ttwoImage1.png?v=1.0.1) #FAFAFA no-repeat 30% top;
	background-size: contain
}

.twoImage2 {
	background: url(/images/detail/design/ttwoImage2.png?v=1.0.1) #FAFAFA no-repeat center bottom;
	background-size: 80%
}

.top-text,
.detailTitle {
	font-size: 1.6rem;
	color: #f1f1f1;
	font-family: "Noto Sans S Chinese Bold";
	text-align: center
}

.topDiv>div,
.topDiv,
.speakDetail>div {
	display: table;
	margin: 0 auto;
}

.speakDetail {
	width: 100%;
	background: #131218;
	padding: 3rem 0;
}

.top-images {
	width: 36.2667rem;
	height: 31.6rem;
	background: url(/images/detail/design/top-images_p.png) no-repeat center center;
	background-size: contain;
	margin-top: 1.83rem!important;
}



.top-tip {
	width: 14.15%;
	margin-bottom: 0.4rem!important;
}

.detailContent {
	width: 30.8rem;
	word-break: normal;
	font-size: 0.6rem;
	color: #9797a4;
	line-height: 222%;
	text-align: center;
	margin-top: 1.1rem!important;
	margin-bottom: 1.6rem!important;
}

.speakCommon .description {
	float: left;
	padding-top: 162px;
	width: 570px;
}

.right-img {
	float: right;
	padding-top: 5.53rem;
	width: 17.133rem;
}

.speakCommon {
	width: 100%;
	background: #1a191f;
}

.speakCommon .sumTitle {
	color: #f1f1f1
}

.speakCommon .sumContent {
	color: #9797a4
}

.b_auto {
	width: 1225px;
	margin: 0 auto
}

.speakBottomImg {
	width: 100%;
}

.speakBottomImg>li {
	float: left;
	margin-right: 16%;
	width: 8.7%;
}

.li-last {
	margin-right: 0!important;
}

.speakCommon-last {
	padding-bottom: 6.467rem;
}

.transTab {
	font-size: 0.8rem;
	color: #9695a3;
	border-bottom: 2px solid #7f7574;
	line-height: 1.8667rem;
	height: 2rem;
}

.transTab>li {
	float: left;
	width: 33.3%;
	text-align: center;
	cursor: pointer;
	height: 2rem;
}

.trasContent {
	width: 100%;
	background: #131315;
	padding-bottom: 6rem;
}

.transact,
.transTab>li:hover {
	color: #f0f0f0;
	border-bottom: 2px solid #f0f0f0
}

.transDetail {
	height: 23.37rem;
	background-color: #181b2a;
	overflow: hidden;
	display: none;
}

.transLeft {
	width: 50%;
	height: 100%;
	float: left;
	position: relative;
}

.transRight {
	position: relative;
	width: 50%;
	height: 100%;
	float: right;
}

.transText {
	width: 17.67rem;
	padding-left: 12.034%;
	padding-top: 22.25%;
}

.transText>div {
	word-break: normal;
}

.transTitle {
	color: #f1f1f1;
}

.transContent {
	color: #9797a4
}

.transImg1 {
	width: 97.224%;
	float: right;
}

.transImg2 {
	width: 59.82%;
	position: absolute;
	bottom: 0;
	left: 14%;
}

.transImg3 {
	width: 77.0689%;
}

.transImg4 {
	width: 88.793%;
	padding-top: 28.14%;
	padding-right: 5%;
}


.transparam>li {
	float: left;
	margin-right: 20%;
}

.transparam>li>div {
	font-size: 0.5333rem;
	color: #9797a4;
	display: block
}

.transparam .transNumber {
	font-family: "Noto Sans S Chinese Bold";
	font-size: 2rem;
	color: #f1f1f1;
	line-height: 2.5rem;
}

.transparam .transNumber span {
	font-size: 1.26rem;
	line-height: 100%;
}

.transText3,
.transText2 {
	padding-left: 0;
}

.transparam {
	margin-top: 2.5rem
}

.speakDList {
	display: table;
	margin: 0 auto;
	margin-top: 1rem;
}

.speakDList>li {
	float: left;
	margin-right: 8.13rem;
}

.DListNumber {
	font-family: "Noto Sans S Chinese Bold";
	font-size: 2rem;
	color: #f1f1f1;
	position: relative;
	line-height: 2.5rem;
}

.DListNumber span {
	font-size: 1.267rem;
	line-height: 100%;
}

.DListSpan {
	font-size: 0.5333rem;
	color: #9797a4;
}

.DListIcon {
	width: 0.6rem;
	height: 2.1333rem;
	position: absolute;
    left: -18%;
    top: 0%;
}
.transText2{
	width: 63.667%;
    margin: 0 auto;
    text-align: center;
	margin-top: 5%;
	/* text-overflow: ellipsis;
	-webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    -o-line-clamp: 3;
    -o-box-orient: vertical;
    -moz-line-clamp: 3;
    -moz-box-orient: vertical;
    -ms-line-clamp: 3;
    -ms-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden; */
}
.down {
	background: url(/images/detail/design/down.png?v=1.0.1) no-repeat center top;
	background-size: contain;
}

.up {
	background: url(/images/detail/design/up.png?v=1.0.1) no-repeat center top;
	background-size: contain;
}
.the-detail{
	font-size: 0.47rem;
	margin-top: 2rem;
	color: #f0f0f0;
	font-family: "Noto Sans S Chinese Bold";
}

.transDetail2 {
    background: url(/images/detail/design/trans2.png?v=1.0.1) #181b2a no-repeat center bottom;
    background-size: 20.833rem 14.167rem;
}
.speakBottomImg{
	display: none;
}
.topFixed{
	background: transparent;
}

@media screen and (max-width:768px) {
	.topframe .topDiv{
		width: 100%;
		padding-top:20px;
		background:linear-gradient(to bottom, #1f2025, #16151b);
		/*background: url(/images/detail/design/fixbg.png?v=1.0.1)  no-repeat center top;
		background-size:cover;*/
	}
	.topframe .topDiv img{width:100%;}
	.topVideo{height:290px;position:relative;}
	.topVideo video{width:100%;height:100%;object-fit:cover;min-width: 100%; min-height: 100%;}
	.topVideo i{
		position: absolute;
		z-index:1000;
		top: 50%;
		left: 50%;
		margin-left: -25px;
		margin-top: -25px;
	}
	.topVideo i img{width:50px;height:50px;}
	.topVideo .videoText{
		position: absolute;
		z-index:1000;
		top:66%;
		left:50%;
		width:200px;
		margin-left: -100px;
		text-align:center;
		font-size:14px;
		color:#f1f1f1;

	}
	.transTitle2{
		margin-bottom: 1%!important;
	}
	.top-tip{
		width: 36.15%;
	}
	.top-images {

		background: url(/images/detail/design/top-images_m.png) no-repeat center center;
		background-size: 100%;

	}
	.sumTitle3,.sumContent{
		text-align: center;
	}
	.boxOuter .designDetail {
		margin-bottom: 50px!important;
	}
	.threeTr>div{
		height: 12rem!important;
	}
	.sumContent{
		line-height: 153%
	}
	.sumImagespex{
		position:absolute;
		right: 0;
		top: 0px;
	}
	.sumCommon{
		position: relative;
	}
	.twoImage2 {
		background: url(/images/detail/design/ttwoImage2.png?v=1.0.1) #FAFAFA no-repeat center bottom;
		background-size: 100%;
	}
	.bgauto{
		background-color: #FAFAFA
	}
	.twoText{
		padding: 0px;
		padding-top: 1rem;
	}
	.twoTr>div{
		background-color: transparent!important;
	}
	.twoTextMob{
		width: 50%;
		float: left;
	}
	.sumTwo{
		padding:0px 
	}
	.sumContent1{
		width: 90%;
	}
	.transImg4{
		width: 57.52%;
		padding: 0px;
		display: table;
		margin: 0 auto;
		margin-top: 2rem;
	}
	.transDetail4 .transRight{
		width: 100%;
		height: auto;
	}
	.transDetail4>*{
		float: none;
	}
	.transDetail4 .transLeft{
		height: auto;
		width: 90.667%;
		margin: 0 auto;
	}
	.transDetail4 .transText{
		padding: 0;
		text-align: center;
		margin-top: 5%;
		text-overflow: ellipsis;
		-webkit-line-clamp: 5;
		-webkit-box-orient: vertical;
		-o-line-clamp: 5;
		-o-box-orient: vertical;
		-moz-line-clamp: 5;
		-moz-box-orient: vertical;
		-ms-line-clamp: 5;
		-ms-box-orient: vertical;
		display: -webkit-box;
		overflow: hidden;
	}
	.transText2{
		width: 90.667%;
	}
	.transImg3{
		width: 89%!important;
	}
	.transText {
		width: 98%;
		padding-top: 12.25%;
	}
	.textContent, .transContent {
		line-height: 153%;
	}
	.pcimg{
		display: none;
	}
	.transText3{
		padding-right:12.034%;
	}
	.topframe{
		background: url(/images/detail/design/fixbg_m.png?v=1.0.1) #131218 no-repeat right top;
		background-size: cover;
	}
	#top{
		background: #121216!important;
	}
	#top .head_top{
		border-bottom:none!important;
	}
	.page_banner {
		margin-top: 0!important;
	}
	.detailImg-m{
		width: 76%!important;
	}
	.speakBottomImg2{
		display: block;
		width: 68%;
		margin: 0 auto;
		margin-top: 1.7rem;
	}
	.speakBottomImg2>li{
		width: 12.9%;
	}
	.detailImg1{
		height: 39vw;
		background: url(/images/detail/design/detailImg1_m.png?v=1.0.1?v=2) no-repeat center;
		background-size:contain; 
		margin-top: 4rem!important;
	}
	.page_banner .caption{text-align:center;padding-top:8.5rem;color:white;height: 100%;background: url(/images/detail/design/banner-img.png?v=1.0.1) no-repeat bottom center;   background-size: 77%; }
	.page_banner .caption .mainCaption{font-size:20px;    width: 46%;    margin: 0 auto;}
	.mainCaption>img{
		width: 100%;
	}
	.scroll{position:fixed;top:84px;left:0;z-index:5000;background: #25282f!important;}
	.topFixed .changeTab span{font-family:"Noto Sans S Chinese Regular","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important;margin-right:6px;font-family:"Noto Sans S Chinese Regular","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important;color:#9797a4;display:inline-block;font-size:12px;}
	.topFixed .changeTab span.act{color:#656565;}

	.page_banner .caption .subCaption{ font-size: 2rem;margin-top:0.7rem;font-family:"Noto Sans S Chinese Regular","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important;}
	.page_banner {
		height: 138vw;
		width: 100%;
		/* background: url(/images/detail/design/craneM2_banner_m.png?v=1.0.1) no-repeat center; */
		background: -webkit-linear-gradient(#121216, #1b1b25 64%, #121216); 
		background: -o-linear-gradient(#121216, #1b1b25 64%, #121216); 
		background: -moz-linear-gradient(#121216, #1b1b25 64%, #121216); 
		background: linear-gradient(#121216, #1b1b25 64%, #121216);
		background-size: cover;
	}
	.boxOuter .picture {
		margin: 0 auto;
	}
	.s_auto {
		width: 100%;
		padding: 0 2%;
	}
	/* .twoTr>div {
		width: 100%;
		height: auto;
		padding-bottom: 3rem;
		margin-right: 0px;
		float: none;
		margin-bottom: 1rem;
	} */
	.twoTr>.twoImage {
		height: 20rem!important;
	}
	.bottomTr {
		margin-bottom: 0rem;
	}
	.boxOuter .designDetail .sumThree {
		/* height: 550px;
		background: url(/images/detail/design/design_m_03.png?v=1.0.1) #FAFAFA no-repeat center bottom;
		background-size: 100%; */
	}
	.top-images {
		width: 28.2667rem;
	}
	.detailContent,
	.detailImg,
	.top-images {
		width: 90%;
	}
	.right-img {
		float: none;
		padding-top: 2rem;
		width: 68%;
		margin: 0 auto;
	}
	.right-img3{
		position: relative;
		left: 3%;
	}
	.speakCommon .description {
		width: 90%;
		float: none;
		margin: 0 auto;
		text-align: center;
		padding-top: 3rem;
	}
	.b_auto {
		width: auto
    }
    .speakDList>li {
        margin-right: 2.2rem;
	}
	.soniAdd{margin-top:30px;color:#f0f0f0;text-align:center;}
	.soniAdd .soniLink{padding-bottom:3px;border-bottom:1px solid #fff;color:#f0f0f0;}
	.boxOuter .sumDetail{margin-bottom:0!important;}
	.packLast{width:100%;background-color:#1a191f;padding:40px 0;}
	.packLast .pack_title{text-align:center;padding-bottom:30px;border-bottom:2px solid #746c6a;}
	.packLast .pack_title img{width:130px;}
	.packLast .pack_title .officialPack{height:100%;line-height:40px;vertical-align:middle;color:#fff;font-size:20px;margin-left:20px;}

	.packTotal .packCommon{border-bottom:2px solid #746c6a;padding:30px 15px;margin:0 auto;text-align:center;}
	.packCommon .pack_text{margin-top:20px;}
	.pack_text .pack_bot{margin:0 auto;display:inline-block;text-align:center;}
	.pack_text .pack_top p{margin-top:10px;font-size:26px;margin-bottom:30px;color:#fff;font-family:"Noto Sans S Chinese Medium","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important; }
	.pack_text .pack_bot .pack_list{text-align:left;line-height:20px;font-size:16px;color:#9797a4;font-family:"Noto Sans S Chinese regular","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important;}
	.pack_text .pack_bot .bot{margin-right:6px;margin-top:-15px;display:inline-block;width:8px;height:8px;background-color:#9797a4;}
	
	
}
.topVideo .mask{position: absolute;top:0;left:0;width:100%;height:100%;background:#1d1d26!important;
	-webkit-opacity: .8;
	-moz-opacity: .8;
	opacity: .8;
	filter:alpha(opacity=80);
}

@media screen and (min-width:769px) {
	.topframe .topDiv{
		width: 100%;
		padding-top:150px;
		height:1280px;
		background:linear-gradient(to bottom, #1f2025, #16151b);
		/*background: url(/images/detail/design/fixbg.png?v=1.0.1)  no-repeat center top;
		background-size:cover;*/
	}
	.topframe .topDiv img{width:100%;}
	.topVideo{
		height:490px;
		position:relative;
		width:100%;
		overflow:hidden;
	}
	.topVideo video{width:100%;height:100%;
		position:absolute;top:0;left:0;/*top:50%;left:50%;transform:translate(-50%,-50%);*/-o-object-fit:cover;-ms-object-fit:cover;object-fit:cover;min-width:100%;min-height:100%;text-align:center;}
	.topVideo i{
		position: absolute;
		z-index:1000;
		top: 50%;
		left: 50%;
		margin-left: -53px;
		margin-top: -53px;
		cursor: pointer;
	}
	.topVideo .videoText{
		position: absolute;
		z-index:1000;
		top:66%;
		left:50%;
		width:300px;
		margin-left: -150px;
		text-align:center;
		font-size:24px;
		color:#f1f1f1;
		font-family:"Noto Sans S Chinese Regular","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important;
	}
	.videoOuter{width:830px!important;height:600px!important;margin:0 auto;max-height:800px;background:black;}
	.videoOuter .mfp-close{
		position: absolute;
		top: -30px!important;
		right: 22%!important;
		border-radius: 50%;
		color: #fff!important;
	}

	.speakBottomImg1{
		display: block;
	}
	.pcimg_m{
		display: none;
	}
	.detailImg1{
		width: 45.233rem;
		height: 15.8rem;
		background: url(/images/detail/design/detailImg1.png?v=1.0.1?v=2) no-repeat center;
	}
	.m_auto {
		width: 1178px;
		margin: 0 auto;
	}
	.s_auto{width:1200px;margin:0 auto;}
	.scroll{position:fixed;top:0;left:0;z-index:16666;background: #25282f!important;}
	.topFixed{background:#1a191f;}
	.topFixed .changeTab span{font-family:"Noto Sans S Chinese Regular","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important;margin:0 20px;color:#9797a4;font-size:14px;display:inline-block;cursor:pointer;}
	.topFixed .changeTab span.act{color:#656565;}
    .boxOuter,.topframe,.page_banner,#head{
        min-width: 1280px;
    }
	.page_banner {
		background: url(/images/detail/design/craneM2_banner.png?v=1.0.1) no-repeat center;
		background-size: cover;
		height: 860px!important;
	}
	.page_banner .caption {
		padding-top: 286px;
		color: white;
		width: 1057px;
		margin: 0 auto;
		text-align: left;
		height: 100%;
        background: url(/images/detail/design/banner-img.png?v=1.0.1) no-repeat right bottom;
        background-size:24.3rem  21.5rem;
	}
	.boxOuter .designDetail .description {
		width: 410px;
	}
	.boxOuter .designDetail .sumThree {
		height: 700px;
		background: url(/images/detail/design/design_l_03.png?v=1.0.1) #FAFAFA no-repeat right top;
		background-size: contain;
	}
	.boxOuter .designDetail .sumThree .description {
		float: left;
		padding-top: 200px;
	}
	.partsDetail .partsType .pName{min-width:170px!important;}
	.soniAdd{margin-top:100px;font-size:14px;color:#f0f0f0;font-family:"Noto Sans S Chinese Bold","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important;}
	.soniAdd .soniLink{padding-bottom:3px;border-bottom:1px solid #fff;font-size:14px;color:#f0f0f0;}
	.boxOuter .sumDetail{margin-bottom:0!important;}
	.packLast{width:100%;background-color:#1a191f;padding:80px 0;}
	.packLast .pack_title{text-align:center;height:40px;padding-bottom:80px;border-bottom:2px solid #746c6a;}
	.packLast .pack_title .officialPack{height:100%;line-height:40px;vertical-align:middle;color:#fff;font-size:40px;margin-left:20px;}

	.packTotal .packCommon{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:center;justify-content:center;border-bottom:2px solid #746c6a;padding:50px 0 60px;margin:0 auto;}
	.packCommon .pack_pic,.packCommon .pack_text{float:left;}
	.packCommon .pack_pic{/*margin-right:100px;*/min-width:36%;}
	.pack_text .pack_top p{margin-top:10px;font-size:36px;margin-bottom:30px;color:#fff;font-family:"Noto Sans S Chinese Medium","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important; }
	.pack_text .pack_bot .pack_list{text-align:left;height:30px;line-height:30px;font-size:16px;color:#9797a4;font-family:"Noto Sans S Chinese regular","Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",Arial,sans-serif!important;}
	.pack_text .pack_bot .bot{margin-right:6px;margin-top:-15px;display:inline-block;width:8px;height:8px;background-color:#9797a4;}
}
