@charset "UTF-8";

@keyframes bounce{0%,20%,50%,80%,100%{transform:translateY(0)}40%{transform:translateY(5px)}60%{transform:translateY(3px)}}
@keyframes scrollUp-desc{0%{opacity:0;transform:translateY(10vh)}30%{opacity:0.3;transform:translateY(5vh)}100%{opacity:0.8;transform:translateY(0vh)}}
@keyframes scrollUp{0%{opacity:0;transform:translateY(10vh)}30%{opacity:0.3;transform:translateY(5vh)}100%{opacity:1;transform:translateY(0vh)}}

/* ¶¯»­ */
.js-m {
	opacity: 0;
	-webkit-transform: translate(0, 30px);
	-ms-transform: translate(0, 30px);
	transform: translate(0, 30px);
	-webkit-transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82);
	transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82);
}
.delay1 {
	-webkit-transition-delay: .4s !important;
	transition-delay: .4s !important;
}
.delay2 {
	-webkit-transition-delay: .8s !important;
	transition-delay: .8s !important;
}
.delay3 {
	-webkit-transition-delay: 1.2s !important;
	transition-delay: 1.2s !important;
}
.delay4 {
	-webkit-transition-delay: 1.6s !important;
	transition-delay: 1.6s !important;
}
.delay5 {
	-webkit-transition-delay: 2s !important;
	transition-delay: 2s !important;
}
.js-m.animate {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	transform: translate(0, 0);
}

.footer .img{ display: inline-block !important; width: 15px !important; height: auto !important;}
.H2-swiper .swiper-container{ width: 100%; height: 100% !important;}
.H2-swiper .swiper-slide .img{ display: block; width: 100%; height: 100%; object-fit: cover;}
.H2-swiper .swiper-slide .to-next{ width: 36px; position: absolute; bottom: 3.5%; left: 50%; margin-left: -18px; z-index: 9; animation: bounce 2s ease-in-out normal infinite;}
.H2-swiper .swiper-slide .to-next img{ display: block; width: 100%;}
.H2-swiper .swiper-slide .to-next{ width: 36px; position: absolute; bottom: 3.5%; left: 50%; margin-left: -18px; animation: bounce 2s ease-in-out normal infinite; cursor: pointer;}
.H2-swiper .swiper-slide .to-next img{ display: block; width: 100%;}

.H2-swiper .edit-container{ width: 1200px;}

.icon-element{ position: absolute;}
.icon-element img{ display: block; width: 100%;}
.icon-element1{ width: 256px; left: -4%; bottom: 5%;}
.icon-element2{ width: 290px; right: -1.5%; top: 30%;}
.icon-element3{ width: 162px; right: 0.8%; top: 3%;}
.icon-element4{ width: 294px; left: 0.8%; top: 3%;}
.icon-element5{ width: 294px; right: -4%; top: 3%;}
.icon-element6{ width: 180px; left: -1.5%; top: 1%;}

.banner{ width: 100%; height: 100%; position: relative;}

.H2-logo{ width: 100%; position: absolute; left: 0; top: 12.4%;}
.H2-logo img{ display: block; width: 400px;}

.section-1{ background: url(/honda/futuretech/hydrogen/images/section-bg1.jpg) center no-repeat; background-size: cover;}
.H2-brief{ width: 100%; position: absolute; left: 0; top: 50%; transform:translateY(-50%); color: #fff;}
.H2-brief .title-box{ text-align: center; font-weight: bold; line-height: 1;}
.H2-brief .title-box .title1{ font-size: 50px; position: relative;}
.H2-brief .title-box .title1::before{ content: ''; width: 100%; height: 40px; background: url(/honda/futuretech/hydrogen/images/guang1.png) center no-repeat; background-size: auto 100%; position: absolute; left: 0; bottom: -40%; z-index: -1;}
.H2-brief .title-box .title2{ font-size: 24px; line-height: 1.5; margin-top: 20px;}
.H2-brief .cont-txt{ font-size: 18px; text-align: center; margin-top: 30px;}
.H2-brief .pic-box{ margin-top: 30px;}
.H2-brief .pic-box img{ display: block; width: 55%; margin: 0 auto;}

.base-title-box{ font-size: 50px; font-weight: bold; color: #fff; line-height: 1; position: relative;}
.base-title-box-bg{ height: 100px; position: absolute; top: 50%; transform:translateY(-50%); left: -48%; opacity: 0.5;}
.base-title-box-bg img{ display: block; height: 100%;}
.base-title-box .title1{ position: relative; z-index: 9;}
.base-title-box .title1 span{ display: inline-block; position: relative;}
.base-title-box .title1 span::before{ content: ''; width: 100%; height: 4px; background-color: #fff; position: absolute; left: 0; bottom: -15%;}
.base-title-box .title1::before{ content: ''; width: 100%; height: 40px; background: url(/honda/futuretech/hydrogen/images/guang2.png) center no-repeat; background-size: auto 100%; position: absolute; left: -48%; bottom: -50%; z-index: -1;}

.section-2{ background: url(/honda/futuretech/hydrogen/images/section-bg2.jpg) center no-repeat; background-size: cover;}
.H2-characteristic{ width: 100%; position: absolute; left: 0; top: 50%; transform:translateY(-50%);}

.H2-characteristic .list-inner{ margin-top: 50px; position: relative;}
.H2-characteristic .list-inner ul{ margin: 0 -30px;}
.H2-characteristic .list-inner li{ float: left; width: 33.333%; padding: 0 30px;}
.H2-characteristic .list-inner li .block-box{ background-color: #fff; border-radius: 40px; overflow: hidden; box-shadow:0 0 30px rgba(47, 186, 207, 0.5);}
.H2-characteristic .list-inner li .block-box .title{ line-height: 70px; font-size: 24px; font-weight: bold; text-align: center; color: #fff; border-radius: 0 0 100% 100%;}
.H2-characteristic .list-inner li .block-box .pic-box img{ display: block; width: 100%;}
.H2-characteristic .list-inner li.li1 .block-box .title{ background-color: #b2ca8d; color: #fff;}
.H2-characteristic .list-inner li.li2 .block-box .title{ background-color: #e2eff3; color: #4a75a2;}
.H2-characteristic .list-inner li.li3 .block-box .title{ background-color: #ebedf0; color: #5c617a;}

.section-3{ background: url(/honda/futuretech/hydrogen/images/section-bg3.jpg) center no-repeat; background-size: cover;}
.H2-use{ width: 100%; position: absolute; left: 0; top: 50%; transform:translateY(-50%);}

.H2-use .cont-txt{ font-size: 24px; text-align: center; margin-top: 50px; color: #fff; text-decoration: underline;}
.H2-use .pic-box{ margin-top: 50px;}
.H2-use .pic-box img{ display: block; width: 100%; margin: 0 auto;}
.H2-use .base-title-box{ left: 45%;}
.H2-use .base-title-box-bg{ left: -24%;}
.H2-use .base-title-box .title1::before{ left: -24%;}

.section-4{ background: url(/honda/futuretech/hydrogen/images/section-bg4.jpg) center no-repeat; background-size: cover;}
.H2-history{ width: 100%; position: absolute; left: 0; top: 50%; transform:translateY(-50%);}
/* .H2-history .base-title-box{ font-size: 65px;}
.H2-history .base-title-box-bg{ left: 0; height: 129px;} */
.H2-history .base-title-box-bg{ left: 0; opacity: 0.3;}
.H2-history .base-title-box .title1::before{ left: -24%;}
.H2-history .cont-txt{ font-size: 24px; margin-top: 50px; color: #fff; text-decoration: underline;}

.history-inner{ height: 615px; position: relative; margin-top: 20px;}
.history-inner .line{ width: 100%; height: 1px; background-color: #fff; position: absolute; left: 0; top: 50%; margin-top: -0.5px;}
.history-inner .middle{ min-width: 100%; height: 10px; position: absolute; top: 0; bottom: 0; margin: auto 0;}
.history-inner .history-item{ float: left; height: 100%; position: relative; z-index: 5; width: 16.666%;}
.history-inner .history-item .content-box{ /* float: left; width: 100%; */}
.history-inner .history-item .content-box li{ /* float: left; width: 220px; */ height: 10px; position: relative;}
.history-inner .history-item .content-box li .hr-line{ width: 10px; height: 10px; background-color: #fff; border-radius: 100%; margin: 0 auto;}
.history-inner .history-item .content-box li .block{ width: 360px; position: absolute; left: 0; bottom: 13px;}
.history-inner .history-item .content-box li .block .year{ font-size: 50px; line-height: 1; color: #fff; position: absolute; left: 40px; bottom: 0; text-shadow: 0 0 8px rgba(49, 152, 208, 0.88);}
.history-inner .history-item .content-box li .cont-box{ width: 100%; min-height: 165px; background: url(/honda/futuretech/hydrogen/images/H2-history-libg.png) bottom center repeat-x; background-size: auto 100%; position: absolute; left: -50%; bottom: 60px; border-radius: 15px; box-shadow:0 0 18px rgba(49, 152, 208, 0.76);}
.history-inner .history-item .content-box li .cont-box .cont{ padding: 40px 15px 15px 15px; font-size: 13px; color: #0c3c7e;}
.history-inner .history-item .content-box li .cont-box .cont p{ line-height: 1.5; /* font-size: 12px; */ }
.history-inner .history-item .content-box li .cont-box .cont strong{ font-weight: bold; }
.history-inner .history-item .content-box li .cont-box .cont .title{ font-size: 18px; color: #0c3c7e; font-weight: bold; margin-bottom: 5px;}
.history-inner .history-item .content-box li .cont-box .car{ position: absolute; left: 50%; transform:translateX(-50%); top: -75px; width: 70%; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}

.history-inner .history-item .content-box li.todown .block{ width: 360px; bottom: auto; top: 13px;}
.history-inner .history-item .content-box li.todown .block .year{ bottom: auto; top: 0;}
.history-inner .history-item .content-box li.todown .cont-box{ bottom: auto; top: 60px; left: 0;}
.history-inner .history-item .content-box li.todown .cont-box .car{ top: auto; bottom: -75px;}
.history-inner .history-item .content-box li.todown .cont-box .cont{ padding: 15px 15px 40px 15px;}

.history-inner .history-item6 .content-box li .cont-box .cont .title{ font-size: 22px; text-align: center; margin: 20px 0 0 0;}
.history-inner .history-item6 .content-box li .cont-box .cont p{ text-align: right; margin-top: 30px;}

.history-inner .history-item .content-box li .cont-box::before{ content: ''; width: 20px; height: 11px; background: url(/honda/futuretech/hydrogen/images/H2-history-triangle-down.png) center no-repeat; background-size: cover; position: absolute; bottom: -10px; right: 20%;}
.history-inner .history-item .content-box li.todown .cont-box::before{ background-image: url(/honda/futuretech/hydrogen/images/H2-history-triangle-top.png); bottom: auto; right: auto; left: 25%; top: -10px; transform: rotateY(180deg);}

/* .history-inner .history-item:hover .content-box li .cont-box .car{ -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -o-transform:scale(1.1);} */

.section-5{ background: url(/honda/futuretech/hydrogen/images/section-bg5.jpg) bottom center no-repeat; background-size: cover;}
.H2-territoryp{ width: 100%; position: absolute; left: 0; top: 50%; transform:translateY(-50%);}
.H2-territoryp .base-title-box{ left: 32%;}
.H2-territoryp .base-title-box-bg{ left: -4.5%; opacity: 0.3;}
.H2-territoryp .base-title-box .title1::before{ left: -24%;}
.H2-territoryp-inner{ height: 600px; position: relative; margin-top: 50px;}
.H2-territoryp-inner .line{ width: 12%; position: absolute;}
.H2-territoryp-inner .line img{ display: block; width: 100%;}
.H2-territoryp-inner .line1{ top: 25%; left: 25%;}
.H2-territoryp-inner .line2{ top: 25%; right: 25%;}
.H2-territoryp-inner .line3{ bottom: 25%; left: 25%;}
.H2-territoryp-inner .line4{ bottom: 25%; right: 25%;}

.H2-territoryp-inner .child-item{ width: 27%; position: absolute; cursor: pointer;}
.H2-territoryp-inner .child-item .pic-box{ position: relative;}
.H2-territoryp-inner .child-item .pic-box img{ display: block; width: 100%;}
.H2-territoryp-inner .child-item .pic-box::before{ content: ''; width: 24px; height: 24px; background: url(/honda/futuretech/hydrogen/images/icon-zoom.png) center no-repeat; background-size: cover; position: absolute; bottom: 0%; right: 5%;}
.H2-territoryp-inner .child-item1{ top: 0; left: 0;}
.H2-territoryp-inner .child-item2{ top: 0; right: 0;}
.H2-territoryp-inner .child-item3{ bottom: 0; left: 0;}
.H2-territoryp-inner .child-item4{ bottom: 0; right: 0;}
.H2-territoryp-inner .main-item{ width: 47%; position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); cursor: pointer; padding-top: 78px;}
.H2-territoryp-inner .main-item .item-logo{ height: 78px;}
.H2-territoryp-inner .main-item .item-logo img{ display: block; height: 100%; margin: 0 auto;}
.H2-territoryp-inner .main-item .pic-box{ width: 390px; margin: 30px auto 0 auto; position: relative;}
.H2-territoryp-inner .main-item .pic-box img{ display: block; width: 100%;}
.H2-territoryp-inner .main-item .pic-box::before{ content: ''; width: 24px; height: 24px; background: url(/honda/futuretech/hydrogen/images/icon-zoom.png) center no-repeat; background-size: cover; position: absolute; bottom: 20%; right: 15%;}
.H2-territoryp-inner .main-item .title-box{ font-size: 0; text-align: center;}
.H2-territoryp-inner .main-item .title-box .icon{ display: inline-block; vertical-align: middle; height: 30px;}
.H2-territoryp-inner .main-item .title-box .icon img{ display: block; height: 100%;}
.H2-territoryp-inner .main-item .title-box span{ display: inline-block; vertical-align: middle; font-size: 30px; font-weight: bold; color: #0064ad; margin: 0 15px;}

.territoryp-layer{ width: 100%; height: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 999; display: none;}
.territoryp-layer .opacity{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(204, 219, 233, 0.7);}
.territoryp-layer .layer-container{ width: 1200px; position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); z-index: 9; padding: 25px;}
.territoryp-layer .layer-close{ width: 36px; height: 36px; background: url(/honda/futuretech/hydrogen/images/territoryp-layer-close.png) center no-repeat; background-size: cover; position: absolute; top: 40px; right: 40px; cursor: pointer;}
.territoryp-layer .layer-container .border-horn{ width: 25px; position: absolute;}
.territoryp-layer .layer-container .border-horn img{ display: block; width: 100%;}
.territoryp-layer .layer-container .border-horn-top{ top: 0; left: 0;}
.territoryp-layer .layer-container .border-horn-right{ top: 0; right: 0;}
.territoryp-layer .layer-container .border-horn-bottom{ bottom: 0; right: 0;}
.territoryp-layer .layer-container .border-horn-left{ bottom: 0; left: 0;}
.territoryp-layer .layer-container .border-line{ position: absolute;}
.territoryp-layer .layer-container .border-line-top,.territoryp-layer .layer-container .border-line-bottom{ width: calc(100% - 50px); height: 25px; left: 50%; transform:translateX(-50%);}
.territoryp-layer .layer-container .border-line-top img,.territoryp-layer .layer-container .border-line-bottom img{ display: block; width: 100%; height: 100%;}
.territoryp-layer .layer-container .border-line-top{ top: 0;}
.territoryp-layer .layer-container .border-line-bottom{ bottom: 0;}
.territoryp-layer .layer-container .border-line-left,.territoryp-layer .layer-container .border-line-right{ width: 25px; height: calc(100% - 50px); top: 50%; transform:translateY(-50%);}
.territoryp-layer .layer-container .border-line-left img,.territoryp-layer .layer-container .border-line-right img{ display: block; width: 100%; height: 100%;}
.territoryp-layer .layer-container .border-line-left{ left: 0;}
.territoryp-layer .layer-container .border-line-right{ right: 0;}
.territoryp-layer .layer-inner{ border: 1px solid #296490;}
.territoryp-layer .layer-inner img{ display: block; width: 100%;}









@media (max-width: 1680px){
	.H2-swiper .swiper-slide .to-next{ width: 28px; margin-left: -14px;}
	.H2-swiper .edit-container{ width: 960px;}
	
	.icon-element1{ width: 204px;}
	.icon-element2{ width: 232px;}
	.icon-element3{ width: 130px;}
	.icon-element4{ width: 235px;}
	.icon-element5{ width: 235px;}
	.icon-element6{ width: 144px;}
	
	.H2-logo img{ width: 320px;}
	
	.H2-brief .title-box .title1{ font-size: 40px;}
	.H2-brief .title-box .title1::before{ height: 32px;}
	.H2-brief .title-box .title2{ font-size: 20px; margin-top: 15px;}
	.H2-brief .cont-txt{ font-size: 16px; margin-top: 25px;}
	.H2-brief .pic-box{ margin-top: 25px;}
	
	.base-title-box{ font-size: 40px;}
	.base-title-box-bg{ height: 80px;}
	.base-title-box .title1 span::before{ height: 3px;}
	.base-title-box .title1::before{ height: 32px;}
	
	.H2-characteristic .list-inner{ margin-top: 40px;}
	.H2-characteristic .list-inner ul{ margin: 0 -25px;}
	.H2-characteristic .list-inner li{ padding: 0 25px;}
	.H2-characteristic .list-inner li .block-box{ border-radius: 32px;}
	.H2-characteristic .list-inner li .block-box .title{ line-height: 56px; font-size: 20px;}
	
	.H2-use .cont-txt{ font-size: 20px; margin-top: 40px;}
	.H2-use .pic-box{ margin-top: 40px;}
	
	.H2-history .cont-txt{ font-size: 20px; margin-top: 40px;}
	.history-inner{ height: 492px; margin-top: 15px;}
	.history-inner .history-item .content-box li .block{ width: 288px;}
	.history-inner .history-item .content-box li .block .year{ font-size: 30px; left: 45px;}
	.history-inner .history-item .content-box li .cont-box{ bottom: 35px; min-height: 145px;}
	.history-inner .history-item .content-box li .cont-box .cont{ padding: 32px 12px 12px 12px; font-size: 12px;}
	.history-inner .history-item .content-box li .cont-box .cont .title{ font-size: 16px; margin-bottom: 0;}
	.history-inner .history-item .content-box li .cont-box .car{ top: -60px;}
	
	.history-inner .history-item .content-box li.todown .block{ width: 288px;}
	.history-inner .history-item .content-box li.todown .cont-box{ top: 35px;}
	.history-inner .history-item .content-box li.todown .cont-box .cont{ padding: 12px 12px 32px 12px;}
	.history-inner .history-item .content-box li.todown .cont-box .car{ bottom: -60px;}
	
	.history-inner .history-item .content-box li .cont-box::before{ width: 14px; height: 7px; bottom: -7px;}
	.history-inner .history-item .content-box li.todown .cont-box::before{ top: -7px;}
	
	.H2-territoryp-inner{ height: 480px; margin-top: 40px;}
	.H2-territoryp-inner .child-item .pic-box::before{ width: 18px; height: 18px;}
	.H2-territoryp-inner .main-item{ padding-top: 62px;}
	.H2-territoryp-inner .main-item .item-logo{ height: 62px;}
	.H2-territoryp-inner .main-item .pic-box{ width: 312px; margin-top: 25px;}
	.H2-territoryp-inner .main-item .pic-box::before{ width: 18px; height: 18px;}
	.H2-territoryp-inner .main-item .title-box .icon{ height: 24px;}
	.H2-territoryp-inner .main-item .title-box span{ font-size: 24px; margin: 0 10px;}
	
	.history-inner .history-item6 .content-box li .cont-box .cont .title{ margin-top: 25px;}
	.history-inner .history-item6 .content-box li .cont-box .cont p{ margin-top: 25px;}
	
	.territoryp-layer .layer-container{ width: 960px; padding: 20px;}
	.territoryp-layer .layer-container .border-horn{ width: 20px;}
	.territoryp-layer .layer-container .border-line-top, .territoryp-layer .layer-container .border-line-bottom{ width: calc(100% - 40px); height: 20px;}
	.territoryp-layer .layer-container .border-line-left, .territoryp-layer .layer-container .border-line-right{ width: 20px; height: calc(100% - 40px);}
	.territoryp-layer .layer-close{ width: 28px; height: 28px; top: 32px; right: 32px;}
	
	
	
	
	
}

@media (max-width: 1440px){
	.H2-swiper .swiper-slide .to-next{ width: 25px; margin-left: -12.5px;}
	.H2-swiper .edit-container{ width: 840px;}
	
	.icon-element1{ width: 179px;}
	.icon-element2{ width: 203px;}
	.icon-element3{ width: 113px;}
	.icon-element4{ width: 205px;}
	.icon-element5{ width: 205px;}
	.icon-element6{ width: 126px;}
	
	.H2-logo img{ width: 280px;}
	
	.H2-brief .title-box .title1{ font-size: 32px;}
	.H2-brief .title-box .title1::before{ height: 28px; bottom: -45%;}
	.H2-brief .title-box .title2{ font-size: 18px;}
	.H2-brief .cont-txt{ font-size: 14px; margin-top: 20px;}
	
	.base-title-box{ font-size: 32px;}
	.base-title-box-bg{ height: 64px;}
	.base-title-box .title1 span::before{ height: 3px;}
	.base-title-box .title1::before{ height: 28px;}
	
	.H2-characteristic .list-inner{ margin-top: 30px;}
	.H2-characteristic .list-inner ul{ margin: 0 -20px;}
	.H2-characteristic .list-inner li{ padding: 0 20px;}
	.H2-characteristic .list-inner li .block-box{ border-radius: 28px;}
	.H2-characteristic .list-inner li .block-box .title{ line-height: 48px; font-size: 18px;}
	
	.H2-use .cont-txt{ font-size: 18px; margin-top: 30px;}
	/* .H2-use .pic-box{ margin-top: 30px;} */
	
	.H2-history .cont-txt{ font-size: 18px; margin-top: 30px;}
	.history-inner{ height: 430px; margin: 20px -50px 0 -50px;}
	.history-inner .history-item .content-box li .block{ width: 290px;}
	.history-inner .history-item .content-box li .block .year{ font-size: 24px; left: 45px;}
	.history-inner .history-item .content-box li .cont-box{ bottom: 30px; min-height: 132px;}
	.history-inner .history-item .content-box li .cont-box::before{ bottom: -6px;}
	.history-inner .history-item .content-box li .cont-box .cont{ padding: 25px 12px 12px 12px}
	.history-inner .history-item .content-box li .cont-box .cont .title{ margin-bottom: 0;}
	.history-inner .history-item .content-box li .cont-box .car{ top: -55px; width: 60%;}
	
	.history-inner .history-item .content-box li.todown .block{ width: 290px;}
	.history-inner .history-item .content-box li.todown .cont-box{ top: 30px;}
	.history-inner .history-item .content-box li.todown .cont-box::before{ top: -6px;}
	.history-inner .history-item .content-box li.todown .cont-box .cont{ padding: 12px 12px 25px 12px}
	.history-inner .history-item .content-box li.todown .cont-box .car{ bottom: -55px;}
	
	.history-inner .history-item6 .content-box li .cont-box .cont .title{ margin-top: 30px;}
	
	.H2-territoryp-inner{ height: 420px; margin-top: 30px;}
	.H2-territoryp-inner .main-item{ padding-top: 54px;}
	.H2-territoryp-inner .main-item .item-logo{ height: 50px;}
	.H2-territoryp-inner .main-item .pic-box{ width: 270px; margin-top: 20px;}
	.H2-territoryp-inner .child-item .pic-box::before{ width: 16px; height: 16px;}
	.H2-territoryp-inner .main-item .pic-box::before{ width: 16px; height: 16px;}
	.H2-territoryp-inner .main-item .title-box .icon{ height: 20px;}
	.H2-territoryp-inner .main-item .title-box span{ font-size: 20px;}
	
	
	
	
}


@media (max-width: 1280px){
	
}

@media (max-width: 1200px){
	
}

@media (max-width: 992px){
	.js-m{ 
		opacity: 1;
		-webkit-transform: translate(0, 0);
		-ms-transform: translate(0, 0);
		transform: translate(0, 0);
	}
	
	.H2-swiper .swiper-container{ height: auto !important;}
	.H2-swiper .swiper-wrapper{ display: block; box-sizing: initial;}
	.H2-swiper .swiper-slide{ box-sizing: initial;}
	
	.H2-swiper .swiper-slide .to-next{ width: 0.4rem; margin-left: -0.2rem; display: none;}
	.H2-swiper .swiper-slide .heightfull .edit-container{ width: 100%;}
	
	.icon-element1{ width: 1.79rem;}
	.icon-element2{ width: 2.03rem;}
	.icon-element3{ width: 1.13rem;}
	.icon-element4{ width: 2.05rem;}
	.icon-element5{ width: 2.05rem;}
	.icon-element6{ width: 1.26rem;}
	
	.H2-logo{ padding: 0 0.4rem;}
	.H2-logo img{ width: 3.2rem;}
	
	.H2-brief{ position: initial; transform: translateY(0); padding: 0.8rem 0.4rem;}
	.H2-brief .title-box .title1{ font-size: 0.48rem;}
	.H2-brief .title-box .title1::before{ height: 0.4rem;}
	.H2-brief .title-box .title2{ font-size: 0.3rem; margin-top: 0.3rem;}
	.H2-brief .cont-txt{ font-size: 0.26rem; margin-top: 0.4rem;}
	.H2-brief .pic-box{ margin-top: 0.4rem;}
	.H2-brief .pic-box img{ width: 100%;}
	
	.base-title-box{ font-size: 0.48rem;}
	.base-title-box-bg{ height: 1rem;}
	.base-title-box .title1::before{ height: 0.4rem; left: -24%; bottom: -54%; background-size: 100% auto;}
	
	.H2-characteristic{ position: initial; transform: translateY(0); padding: 0.8rem 0.4rem;}
	.H2-characteristic .list-inner{ margin-top: 0.6rem;}
	.H2-characteristic .list-inner ul{ margin: 0 -0.05rem;}
	.H2-characteristic .list-inner li{ padding: 0 0.05rem;}
	.H2-characteristic .list-inner li .block-box{ border-radius: 0.3rem;}
	.H2-characteristic .list-inner li .block-box .title{ line-height: 0.7rem; font-size: 0.3rem;}
	
	.H2-use{ position: initial; transform: translateY(0); padding: 0.8rem 0.4rem;}
	.H2-use .base-title-box{ left: 0; font-size: 0.36rem;}
	.H2-use .base-title-box .title1::before{ bottom: -62%;}
	.H2-use .cont-txt{ font-size: 0.28rem; margin-top: 0.6rem;}
	.H2-use .pic-box{ margin-top: 0.6rem;}
	
	.H2-history{ position: initial; transform: translateY(0); padding: 0.8rem 0;}
	.H2-history .base-title-box{ font-size: 0.36rem; padding: 0 0.4rem;}
	.H2-history .base-title-box-bg{ left: -48%;}
	.H2-history .base-title-box .title1::before{ bottom: -62%;}
	.H2-history .cont-txt{ font-size: 0.28rem; margin-top: 0.6rem; padding: 0 0.4rem;}
	
	.historynew-slide{ width: 100%; margin-top: 0.6rem;}
	
	.historynew-slide .swiper-wrapper{ display: flex; box-sizing: content-box;}
	.historynew-slide .swiper-slide{ box-sizing: border-box;}
	
	.historynew-slide .swiper-container-n{ width: 100%; height: 100%;}
	.historynew-slide .swiper-wrapper-n{ display: flex; transition-property: transform; box-sizing: content-box;}
	.historynew-slide .swiper-slide-n{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; flex-shrink: 0;}
	
	
	.historynew-slide .year{ text-align: center; color: #fff; font-size: 0.48rem; font-weight: bold;}
	.historynew-slide .hr-line{ width: 100%; border-bottom: #fff solid 0.05rem; position: relative; display: block; margin: 0.3rem 0;}
	.historynew-slide .hr-line:before { content: '';width: 0.3rem;height: 0.3rem;background-color: #fff;position: absolute;left: 50%;top: 50%;border-radius: 100%;margin-left: -0.15rem;margin-top: -0.15rem;}
	.historynew-slide .carha{width: 60%; margin: 0.2rem auto; text-align: center;}
	.historynew-slide .carha img{ width:100%;-moz-user-select: none; 
	-webkit-user-select: none; 
	-ms-user-select: none; 
	-khtml-user-select: none; 
	user-select: none; }
	.historynew-slide .cont-box{ padding: 0 0.8rem;}
	.historynew-slide .cont-box .cont{ color: #fff; font-size: 0.26rem;}
	.historynew-slide .cont-box .cont .title{ font-size: 0.28rem; font-weight: bold; text-align: center; margin: 0.3rem 0;}
	.historynew-slide .cont-box .cont p{ }
	
	.historynew-slide .swiper-button-next{ background: url(/honda/futuretech/hydrogen/images/right_arrowon.png) no-repeat; z-index: 999; width: 14px;height: 28px;margin-top: -14px; left: auto; right: 0.4rem;background-size: 100%;}
	
	.historynew-slide .swiper-button-prev{ background: url(/honda/futuretech/hydrogen/images/left_arrowon.png) no-repeat; z-index: 999; width: 14px;height: 28px;margin-top: -14px; right: auto; left: 0.4rem;background-size: 100%;}
	.historynew-slide .swiper-button-prev:after, .historynew-slide .swiper-container-rtl .swiper-button-next:after{ display: none;}
	.historynew-slide .swiper-button-next:after, .historynew-slide .swiper-container-rtl .swiper-button-prev:after{ display: none;}
	
	.H2-territoryp{ position: initial; transform: translateY(0); padding: 0.8rem 0.4rem;}
	.H2-territoryp .base-title-box{ left: 0;}
	.H2-territoryp .base-title-box-bg{ left: -48%;}
	.H2-territoryp-inner{ height: 10.5rem; margin: 0.6rem -0.4rem 0 -0.4rem;}
	.H2-territoryp-inner .line1{ left: 15%;}
	.H2-territoryp-inner .line2{ right: 15%;}
	.H2-territoryp-inner .line3{ left: 15%;}
	.H2-territoryp-inner .line4{ right: 15%;}
	.H2-territoryp-inner .child-item{ width: 42%;}
	.H2-territoryp-inner .child-item .pic-box::before{ width: 0.24rem; height: 0.24rem;}
	.H2-territoryp-inner .main-item{ width: 50%; padding-top: 0.78rem;}
	.H2-territoryp-inner .main-item .item-logo{ height: 0.7rem;}
	.H2-territoryp-inner .main-item .pic-box{ width: 100%; margin-top: 0.3rem;}
	.H2-territoryp-inner .main-item .pic-box::before{ width: 0.24rem; height: 0.24rem;}
	.H2-territoryp-inner .main-item .title-box{ margin: 0 -50%;}
	.H2-territoryp-inner .main-item .title-box .icon{ height: 0.3rem;}
	.H2-territoryp-inner .main-item .title-box span{ font-size: 0.28rem;}
	
	.territoryp-layer .layer-container{ width: 100%; padding: 0.2rem;}
	.territoryp-layer .layer-close{ width: 0.4rem; height: 0.4rem; top: 0.3rem; right: 0.3rem;}
	.territoryp-layer .layer-container .border-horn{ width: 0.2rem;}
	.territoryp-layer .layer-container .border-line-top, .territoryp-layer .layer-container .border-line-bottom{ width: calc(100% - 0.4rem); height: 0.2rem;}
	.territoryp-layer .layer-container .border-line-left, .territoryp-layer .layer-container .border-line-right{ width: 0.2rem; height: calc(100% - 0.4rem);}
	
	
	
	
	
}
<!--ºÄʱ1764554364.0577Ãë-->