*,
:after,
:before {
	box-sizing: border-box;
	backface-visibility: hidden;
	margin: 0;
	padding: 0;
	font-family: "Noto Sans SC", Microsoft JhengHei, Source Han Sans CN, PingFang SC, Source Han Serif SC, Microsoft YaHei, sans-serif
}

ol,
ul,
li {
	vertical-align: middle;
	list-style-type: none
}

img {
	vertical-align: middle;
	border: 0
}

input,
select,
textarea,
button {
	vertical-align: middle
}

textarea,
input {
	text-indent: 10px
}

input[type=submit],
input[type=button],
button {
	text-indent: 0;
	text-align: center;
	cursor: pointer
}

label,
button,
a {
	cursor: pointer
}

ins,
em,
b,
i {
	font-style: normal;
	text-decoration: none
}

select:focus,
textarea:focus,
input:focus,
button {
	outline: none
}

.disable-hover {
	pointer-events: none
}

.scroll-animate.animated,
.scroll-animate:not(.father) {
	visibility: hidden
}

.animated {
	animation-duration: 1.2s;
	animation-fill-mode: both
}

.font-fadeIn font {
	display: inline-block
}

/* ::-webkit-scrollbar {
	width: 8px;
	background-color: #000
}

::-webkit-scrollbar-thumb {
	width: 8px;
	background-color: #e27402;
	border: 1px solid #000;
	border-radius: 4px
} */

::-webkit-scrollbar-corner {
	background-color: transparent
}

::-webkit-scrollbar:horizontal {
	height: 9px
}

::-webkit-selection {
	color: transparent;
	background: 0 0
}

::-moz-selection {
	color: transparent;
	background: 0 0
}

::selection {
	color: #fff;
	-webkit-text-fill-color: #fff;
	background-color: #1c509c
}

input::-webkit-input-placeholder,
input::-moz-input-placeholder,
textarea::-webkit-textarea-placeholder,
textarea::-moz-textarea-placeholder {
	color: #999;
	transition: color .5s
}

input:focus::-webkit-input-placeholder,
input:focus::-moz-input-placeholder,
input:hover::-webkit-input-placeholder,
input:hover::-moz-input-placeholder,
textarea:focus::-webkit-input-placeholder,
textarea:focus::-moz-input-placeholder,
textarea:hover::-webkit-input-placeholder,
textarea:hover::-moz-input-placeholder {
	color: #c2c2c2
}

a {
	color: inherit;
	text-decoration: none
}

a[href] {
	cursor: pointer
}

a:hover {
	cursor: pointer;
	text-decoration: none
}

a:focus {
	background-color: transparent
}

audio,
canvas,
progress,
video {
	vertical-align: baseline;
	display: inline-block
}

body {
	-webkit-tap-highlight-color: transparent
}

html {
	width: 100%;
	scroll-behavior: initial;
	font-size: 5.20833vw;
	overflow-x: hidden
}

a:focus,
input:focus,
p:focus,
div:focus {
	-webkit-tap-highlight-color: transparent
}

img[src=""],
img:not([src]) {
	opacity: 0
}

b {
	font-size: inherit;
	color: inherit;
	font-family: inherit
}

font {
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
	font-family: inherit;
	font-style: inherit;
	text-transform: inherit
}

h1,
h2,
h3,
h4,
h5 {
	font-weight: 400
}

.iconfont {
	font-size: .16rem
}

.grayscale {
	filter: grayscale()
}

.fl {
	float: left
}

.fr {
	float: right
}

.fw-100 {
	font-weight: 100
}

.fw-400 {
	font-weight: 400
}

.fw-600 {
	font-weight: 600
}

.cl:after {
	content: " ";
	height: 0;
	clear: both;
	visibility: hidden;
	font-size: 0;
	line-height: 0;
	display: block
}

.hide {
	display: none
}

.show {
	display: block
}

.text_overflow {
	white-space: nowrap;
	text-overflow: ellipsis;
	display: block;
	overflow: hidden
}

[data-ahref] {
	cursor: pointer
}

.f-left {
	text-align: left
}

.f-center {
	text-align: center
}

.f-right {
	text-align: right
}

.up-word {
	text-transform: uppercase
}

.v-show {
	visibility: visible
}

.v-hide {
	visibility: hidden
}

.pr {
	position: relative
}

.pa {
	position: absolute
}

.back-cover {
	background-size: cover
}

.back-contain {
	background-size: contain
}

.wid-10 {
	width: 10%
}

.wid-15 {
	width: 15%
}

.wid-20 {
	width: 20%
}

.wid-25 {
	width: 25%
}

.wid-30 {
	width: 30%
}

.wid-35 {
	width: 35%
}

.wid-40 {
	width: 40%
}

.wid-45 {
	width: 45%
}

.wid-50 {
	width: 50%
}

.wid-55 {
	width: 55%
}

.wid-60 {
	width: 60%
}

.wid-65 {
	width: 65%
}

.wid-70 {
	width: 70%
}

.wid-75 {
	width: 75%
}

.wid-80 {
	width: 80%
}

.wid-85 {
	width: 85%
}

.wid-90 {
	width: 90%
}

.wid-95 {
	width: 95%
}

.wid-100 {
	width: 100%
}

.op-0 {
	opacity: 0
}

.op-1 {
	opacity: .1
}

.op-2 {
	opacity: .2
}

.op-3 {
	opacity: .3
}

.op-4 {
	opacity: .4
}

.op-5 {
	opacity: .5
}

.op-6 {
	opacity: .6
}

.op-7 {
	opacity: .7
}

.op-8 {
	opacity: .8
}

.op-9 {
	opacity: .9
}

.op-10 {
	opacity: 1
}

.layout-v-middle,
#service .r2 .inner .items>li .icon,
#searchResult .banner .btm .line,
#searchResult .banner .inner .group .right .part .box .btnIcon,
#about .r6 .inner .btm .line,
.solarInner .AT_r1 .bg .img,
#reference .banner .btm .line,
#blog .banner .btm .line,
#newDetail .r1 .inner .mid .line:after,
#news .banner .btm .line,
#news .banner .inner .top .yearBox .yearDown .arrow,
.imgPopup .popCon .nextBtn,
.imgPopup .popCon .prevBtn,
.layout-middle,
#about .r1 .inner .part .right .player,
#resource .banner .inner .mid .group .box-3 .box .msg .play,
#resource .banner .inner .top .part .typeBox .items .list .dot:after,
#solartrack .r8 .inner .right .midIcon,
#roofSolution .r10 .inner .mid .tab .mask:after,
#roofSolution .r10 .inner .mid .group .right .part .dot .img,
#roofSolution .r1 .inner .clip .svgIcon,
#loading .svgIcon,
.bigPop .imgBox,
.layer-appBigBtn {
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0
}

.layout-h-middle {
	margin: auto;
	position: absolute;
	left: 0;
	right: 0
}

.layout-middle,
#about .r1 .inner .part .right .player,
#resource .banner .inner .mid .group .box-3 .box .msg .play,
#resource .banner .inner .top .part .typeBox .items .list .dot:after,
#solartrack .r8 .inner .right .midIcon,
#roofSolution .r10 .inner .mid .tab .mask:after,
#roofSolution .r10 .inner .mid .group .right .part .dot .img,
#roofSolution .r1 .inner .clip .svgIcon,
#loading .svgIcon,
.bigPop .imgBox,
.layer-appBigBtn {
	left: 0;
	right: 0
}

.pa-v {
	position: absolute;
	top: 50%;
	transform: translateY(-50%)
}

.pa-h {
	position: absolute;
	left: 50%;
	transform: translate(-50%)
}

.pa-mid,
.solarInner .simple_r1 .inner .cv {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%)
}

.pic {
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover
}

.fxc,
#groundSolution .r4 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo,
#searchResult .banner .inner .top .searchBox .subSearch,
#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til .btnIcon,
#about .r2 .group .mapBox .left .mid .list .icon,
#about .r2 .inner .upSide,
#about .r1 .inner .part .right .player,
#about .r1 .inner .part .right,
.solarInner .rowMore .inner .mid .part .note,
.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo,
.solarInner .simple_r2 .inner .part,
.solarInner .AT_r3 .inner .mid .chunk,
.solarInner .AT_r2 .inner .mid .group .col .box .pic,
#contact .banner .inner .mid .left .box .list .icon,
#resource .banner .inner .mid .group .box-2 .box .arrow,
#resource .banner .inner .til .searchBox .subSearch,
#reference .banner .inner .mid .box .photo,
#blog .banner .inner .top .searchBox .subSearch,
#newDetail .r1 .inner .mid .set .col .arrow,
#newDetail .r1 .inner .mid .line,
#newDetail .r1 .inner .left .return .arrow,
#news .banner .inner .mid .box .msg .note .btnIcon,
#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo,
#solartrack .r5 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo,
#solartrack .r3 .btm,
#solartrack .r3 .mid .part .col .box .pic,
#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo,
#roofDetail .r1 .inner .mid .group .part .box .msg .items>li .chunk,
#roofSolution .r11 .inner .group .part,
#roofSolution .r10 .inner .mid .tab .lists>a,
#roofSolution .r10 .inner .mid .tab .lists,
#roofSolution .r4 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo,
#roofSolution .r1 .inner .group .box .items>li .part>small,
#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide,
.imgPopup .popCon .pager,
.imgPopup .popCon .nextBtn,
.imgPopup .popCon .prevBtn,
.imgPopup,
.packagePop,
.bigPop .close,
#Popup,
#app .pop,
#app footer .mid .shareBox .share,
.layer-map .left .mid .list .icon,
.layer-logoSw .swiper-wrapper .swiper-slide .photo,
.layer-btn,
.layer-icon {
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

.fxs,
#service .r4 .inner .group .items>li,
#about .r2 .group .mapBox .left .mid .list,
.solarInner .simple_r7 .inner .mid .box,
.solarInner .AT_r4 .inner .group .msg .items .list,
.solarInner .AT_r3 .inner .mid .chunk h3,
.solarInner .AT_r1 .inner,
#contact .banner .inner .mid .left .box .list,
#resource .banner .inner .top .part .typeBox .items .list,
#newDetail .r1 .inner .mid .set .col,
#roofDetail .r1 .inner .mid .group .part .box .msg .items,
#roofSolution .r5 .inner .group .items>li,
#roofSolution .banner_Snapfit .inner .group .col,
.layer-map .left .mid .list,
.layer-item .list {
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

.fxb,
#epc .r3 .inner .items>li .msg,
#epc .r3 .inner .top,
#service .r3 .inner .group .items>li .msg,
#searchResult .banner .btm,
#about .r6 .inner .btm,
#resource .banner .inner .mid .group .box-2 .box,
#reference .banner .btm,
#blog .banner .btm,
#blog .banner .inner .mid .box .msg .items .note,
#news .banner .btm,
#news .banner .inner .mid .box .msg .note,
#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li,
#app header nav.appNav .inner_mid .nav-items>.child_first>.firstList {
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

.layer-photo {
	position: relative
}

.sticky {
	width: 100%;
	height: 100vh;
	position: sticky;
	top: 0;
	left: 0
}

.over-3 {
	-webkit-line-clamp: 3;
	height: 3.9em;
	-webkit-box-orient: vertical;
	line-height: 1.3;
	display: -webkit-box;
	overflow: hidden
}

.over-2 {
	-webkit-line-clamp: 2;
	height: 2.6em;
	-webkit-box-orient: vertical;
	line-height: 1.3;
	display: -webkit-box;
	overflow: hidden
}

.max-wid {
	width: calc(100% - 1.2rem);
	margin: 0 auto
}

.maxSize {
	width: 80%;
	max-width: 78.125vw;
	margin: 0 auto
}

.full,
#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after,
#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask,
#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after,
#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask,
#service .r4 .bg .pic:after,
#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after,
#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask,
#groundSolution .r7 .bg .pic:after,
#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after,
#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask,
#searchResult .banner .inner .group .right .part .box .btnIcon .mask:after,
#searchResult .banner .inner .group .right .part .box .btnIcon .mask,
#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til .btnIcon .mask:after,
#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til .btnIcon .mask,
#about .r5 .inner .group .box .pic>.mask,
#at-3 .banner .bg .mask:after,
#at-3 .banner .bg .mask:before,
#at-3 .banner .bg .mask,
.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask:after,
.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask,
.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo:after,
.solarInner .simple_r2 .inner .group .box .mask,
.solarInner .simple_r1 .inner .group .cvPart,
.solarInner .simple_r1 .inner .cv .proCv,
.solarInner .AT_r5 .bg .mask:after,
.solarInner .AT_r5 .bg .mask:before,
.solarInner .AT_r5 .bg .mask,
#contact .r1 .inner .group .tabBox:nth-of-type(2),
#contact .r1 .inner .group .tabBox .form .loadMk,
#resource .banner .inner .mid .group .box-3 .box .msg .play:after,
#resource .banner .inner .mid .group .box-3 .box .msg,
#resource .banner .inner .mid .group .box-3 .box .pic:after,
#resource .banner .inner .mid .group .box-3 .box .pic:before,
#resource .banner .inner .mid .group .box-2 .box .arrow:after,
#resource .banner .inner .mid .group .box-1 .box .msg .btnIcon .mask:after,
#resource .banner .inner .mid .group .box-1 .box .msg .btnIcon .mask,
#reference .banner .inner .mid .box .photo .btnIcon>.mask:after,
#reference .banner .inner .mid .box .photo .btnIcon>.mask,
#reference .banner .inner .mid .box .photo:after,
#blog .banner .inner .mid .box .msg .items .note .btnIcon .mask:after,
#blog .banner .inner .mid .box .msg .items .note .btnIcon .mask,
#newDetail .r1 .inner .mid .set .col .arrow:after,
#newDetail .r1 .inner .left .return .arrow:after,
#news .banner .inner .mid .box .msg .note .btnIcon .mask:after,
#news .banner .inner .mid .box .msg .note .btnIcon .mask,
#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask:after,
#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask,
#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo:after,
#solartrack .r8 .inner .right .group .mask,
#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after,
#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask,
#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask:after,
#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask,
#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo:after,
#roofDetail .banner .bg .pic:after,
#roofSolution .r11 .inner .group .part,
#roofSolution .r11 .inner .group .fn_r11 .cvBox,
#roofSolution .r8 .inner .right .form .loadMk,
#roofSolution .r7 .bg .pic:after,
#roofSolution .r5 .bg .pic:after,
#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after,
#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask,
#roofSolution .banner_Snapfit>.bg .shadow:after,
#home .r5 .bg,
#home .banner .part .head:after,
#home .banner .part .mask,
#home .banner .bg:after,
#home .row>.bg,
#loading .bgMask,
.imgPopup .popCon .msg .photo .pic,
.imgPopup .mask,
.packagePop .mask,
#app .pop .mask,
#app main .rowContact .inner .form .col .loadMk,
#app main .row>.bg,
.layer-btnIcon .mask:after,
.layer-btn .mk,
.layer-photo .pic {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0
}

.f-160 {
	font-size: 1.2rem
}

.f-120 {
	letter-spacing: -.04em;
	font-size: 1.2rem
}

.f-100 {
	letter-spacing: -.04em;
	font-size: 1rem
}

.f-90 {
	font-size: .9rem
}

.f-80 {
	font-size: .8rem
}

.f-70 {
	font-size: .7rem
}

.f-64 {
	font-size: .64rem
}

.f-60,
.solarInner .simple_r2 .inner .group .box>p sub {
	font-size: .6rem
}

.f-56 {
	font-size: .56rem
}

.f-54 {
	font-size: .54rem
}

.f-50 {
	font-size: .5rem
}

.f-48 {
	font-size: .48rem
}

.f-46 {
	font-size: .46rem
}

.f-44 {
	font-size: .44rem
}

.f-42 {
	font-size: .42rem
}

.f-40 {
	font-size: .4rem
}

.f-38 {
	font-size: .38rem
}

.f-36,
#searchResult .banner .btm .pager>a.on,
#about .r6 .inner .btm .pager>a.on,
#reference .banner .btm .pager>a.on,
#blog .banner .btm .pager>a.on,
#news .banner .btm .pager>a.on {
	font-size: .36rem
}

.f-34 {
	font-size: .34rem
}

.f-32 {
	font-size: .32rem
}

.f-30 {
	font-size: .3rem
}

.f-28 {
	font-size: .28rem
}

.f-26 {
	font-size: .26rem
}

.f-24,
#searchResult .banner .btm .pager>a,
#about .r6 .inner .btm .pager>a,
#reference .banner .btm .pager>a,
#blog .banner .btm .pager>a,
#news .banner .btm .pager>a {
	font-size: .24rem
}

.f-22 {
	font-size: .22rem
}

.f-20 {
	font-size: .2rem
}

.f-18 {
	font-size: .18rem
}

.f-16,
#Popup>span {
	font-size: .16rem
}

.f-14,
#newDetail .r1 .inner .mid .detail * {
	font-size: .14rem
}

.f-12 {
	font-size: .12rem
}

.mb-90 {
	margin-bottom: .9rem
}

.mb-80 {
	margin-bottom: .8rem
}

.mb-70 {
	margin-bottom: .7rem
}

.mb-60 {
	margin-bottom: .6rem
}

.mb-50 {
	margin-bottom: .5rem
}

.mb-40 {
	margin-bottom: .4rem
}

.mb-30 {
	margin-bottom: .3rem
}

.mb-20 {
	margin-bottom: .2rem
}

.mb-10 {
	margin-bottom: .1rem
}

@keyframes fadeInUpSmall {
	0% {
		opacity: 0;
		transform: translateY(30%)
	}

	to {
		opacity: 1;
		transform: translateY(0%)
	}
}

@font-face {
	font-family: iconfont;
	src: url(../fonts/font_4640056_uavfz20zxb.woff2)format("woff2"), url(../fonts/font_4640056_uavfz20zxb.woff)format("woff"), url(../fonts/font_4640056_uavfz20zxb.ttf)format("truetype")
}

@font-face {
	font-family: AlibabaPuHuiTi_2_35_Thin;
	src: url(../fonts/alibabapuhuiti-3-35-thin.e0836d37.ttf)format("truetype");
	font-display: swap
}

@font-face {
	font-family: AlibabaPuHuiTi_2_45_Light;
	src: url(../fonts/alibabapuhuiti-3-45-light.c809a744.ttf)format("truetype");
	font-display: swap
}

@font-face {
	font-family: AlibabaPuHuiTi_2_55_Regular;
	src: url(../fonts/alibabapuhuiti-3-55-regular.02f0dba1.ttf)format("truetype");
	font-display: swap
}

@font-face {
	font-family: AlibabaPuHuiTi_2_85_Bold;
	src: url(../fonts/alibabapuhuiti-3-85-bold.a7f822d4.ttf)format("truetype");
	font-display: swap
}

@font-face {
	font-family: AlibabaPuHuiTi_2_95_ExtraBold;
	src: url(../fonts/alibabapuhuiti-3-95-extrabold.0a882f8a.ttf)format("truetype");
	font-display: swap
}

@font-face {
	font-family: AlibabaPuHuiTi_2_105_Heavy;
	src: url(../fonts/alibabapuhuiti-3-105-heavy.c2d5aff9.ttf)format("truetype");
	font-display: swap
}

.iconfont {
	font-family: iconfont
}

.word-t,
#taiSimple .banner .inner .topic h1>small,
#roofDetail .r1 .inner .mid .group .part .box h4,
#home .r5 .inner .mid .r5Sw .swiper-pagination .swiper-pagination-total,
#home .r5 .inner .mid .r5Sw .swiper-pagination,
#home .banner .inner .group .list h2 small {
	font-family: Noto Sans SC;
	font-weight: 100
}

.word-t.wc,
#taiSimple .banner .inner .topic h1>small.wc,
#roofDetail .r1 .inner .mid .group .part .box h4.wc,
#home .r5 .inner .mid .r5Sw .swiper-pagination .wc.swiper-pagination-total,
#home .r5 .inner .mid .r5Sw .wc.swiper-pagination,
#home .banner .inner .group .list h2 small.wc {
	color: rgba(255, 255, 255, .8)
}

.word-t.bc,
#taiSimple .banner .inner .topic h1>small.bc,
#roofDetail .r1 .inner .mid .group .part .box h4.bc,
#home .r5 .inner .mid .r5Sw .swiper-pagination .bc.swiper-pagination-total,
#home .r5 .inner .mid .r5Sw .bc.swiper-pagination,
#home .banner .inner .group .list h2 small.bc {
	color: rgba(35, 38, 38, .8)
}

.word-l {
	font-family: Noto Sans SC;
	font-weight: 100
}

.word-l.wc {
	color: rgba(255, 255, 255, .8)
}

.word-l.bc {
	color: rgba(35, 38, 38, .8)
}

.word-r,
#app header .pcNav .items>li .child>li>a {
	font-family: Noto Sans SC;
	font-weight: 400
}

.word-b,
#roofSolution .r1 .inner .group p b,
#home .r5 .inner .mid .r5Sw .swiper-pagination .swiper-pagination-current {
	font-family: Noto Sans SC;
	font-weight: 600
}

.word-xb {
	letter-spacing: -.03em;
	font-family: Noto Sans SC;
	font-weight: 600
}

.word-h,
#searchResult .banner .btm .pager>a,
#about .r6 .inner .btm .pager>a,
#reference .banner .btm .pager>a,
#blog .banner .btm .pager>a,
#news .banner .btm .pager>a,
#solartrack .r5 .inner .mid>p b,
#roofDetail .r1 .inner .mid .group .part .box.fill h4,
#roofDetail .r1 .inner .mid .group .part .box.active h4,
#roofSolution .r10 .inner .mid .tab .lists.on>a {
	letter-spacing: -.03em;
	font-family: Noto Sans SC;
	font-weight: 700
}

.num-t {
	font-family: AlibabaPuHuiTi_2_35_Thin
}

.num-l {
	font-family: AlibabaPuHuiTi_2_45_Light
}

.num-r {
	font-family: AlibabaPuHuiTi_2_55_Regular
}

.num-b,
.solarInner .simple_r2 .inner .group .box>p sub {
	letter-spacing: -.02em;
	font-family: AlibabaPuHuiTi_2_85_Bold
}

.num-xb {
	letter-spacing: -.02em;
	font-family: AlibabaPuHuiTi_2_95_ExtraBold
}

.num-h {
	letter-spacing: -.02em;
	font-family: AlibabaPuHuiTi_2_105_Heavy
}

.en p,
.en h4 {
	text-align: justify
}

.mc {
	color: #e27402
}

.bc {
	color: #232626
}

.gray {
	color: #3c4141
}

.wc {
	color: #fff
}

.move,
#home .r1 .inner .group .list .right .photo .pic,
.dotFn .txt .letter {
	transition: opacity 1s cubic-bezier(.38, 0, 0, 1), width 1s cubic-bezier(.38, 0, 0, 1), transform 1s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1)
}

p {
	line-height: 1.35
}

.noTouch {
	touch-action: none
}

.letter {
	min-width: .2em;
	color: inherit;
	font-size: inherit;
	font-family: inherit;
	display: inline-block
}

.childLetter {
	font-size: inherit;
	color: inherit;
	margin-right: .2em;
	font-family: inherit;
	display: inline-block
}

.alanFn {
	transform-origin: -50%;
	perspective: 26.0417vw;
	backface-visibility: hidden
}

.layer-icon .icon {
	display: block
}

.layer-icon .mr-10 {
	margin-right: .1rem
}

.layer-icon .mr {
	margin-right: .83333vw
}

.layer-btn {
	height: .6rem;
	cursor: pointer;
	border-radius: 1rem;
	padding: 0 .35rem;
	position: relative;
	overflow: hidden
}

.layer-btn.bc {
	background-color: #232626;
	transition: box-shadow 1s cubic-bezier(.38, 0, 0, 1)
}

.layer-btn .mr-5 {
	margin-right: .3rem
}

.layer-btn .mr {
	margin-right: .2rem
}

.layer-btn .txt,.layer-btn .txt2 {
	z-index: 5;
	transition: color .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

.layer-btn .mk {
	width: 200%;
	transition: opacity 1s cubic-bezier(.38, 0, 0, 1), transform .8s cubic-bezier(.38, 0, 0, 1)
}

.layer-btn.color .mk {
	background: linear-gradient(90deg, #e27402 0%, #e27402 50%, #e27402 100%)
}

.layer-btn.bc .mk {
	background-color: #e27402;
	border-radius: 1rem;
	transform: translate(-100%)
}

.layer-btn.wc {
	background-color: #fff
}

.layer-btn.wc .mk {
	background-color: #e27402;
	border-radius: 1rem;
	transform: translate(-100%)
}

.layer-btn .iconfont {
	transform-origin: 0 100%;
	z-index: 5;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform .8s cubic-bezier(.38, 0, 0, 1), color .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	.layer-btn:hover.bc {
		background-color: #e27402;
		transition: background-color 1s cubic-bezier(.38, 0, 0, 1) .3s, box-shadow 1s cubic-bezier(.38, 0, 0, 1)
	}

	.layer-btn:hover .mk {
		transform: translate(-50%)
	}

	.layer-btn:hover .txt {
		color: #232626
	}

	.layer-btn:hover .iconfont:not(.mv) {
		color: #232626;
		opacity: 1;
		transform: rotate(45deg)translate(-.1rem)
	}
}

.layer-btnIcon {
	cursor: pointer;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

.layer-btnIcon .mask {
	height: .5rem;
	width: .5rem;
	transform-origin: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	right: 0;
	overflow: hidden
}

.layer-btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

.layer-btnIcon .txt {
	text-align: center;
	z-index: 9;
	white-space: nowrap;
	padding: 0 .3rem 0 .4rem;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1), color .5s cubic-bezier(.38, 0, 0, 1)
}

.layer-btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	width: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

.layer-btnIcon.mc .mask {
	background-color: #e27402
}

.layer-btnIcon.mc:hover .txt {
	color: #232626
}

@media screen and (orientation:landscape) {
	.layer-btnIcon:hover .mask {
		width: 100%
	}

	.layer-btnIcon:hover .mask:after {
		opacity: 1
	}

	.layer-btnIcon:hover .layer-icon {
		transform: translate(-.15rem)rotate(45deg)
	}
}

.alanBox .ani,
.alanBox .letter,
.aniBox .ani,
.aniBox .letter {
	opacity: 0;
	transform-origin: 0;
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1), transform .8s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	transform: translateY(30%)
}

.alanBox .ani:nth-child(1),
.alanBox .letter:nth-child(1),
.aniBox .ani:nth-child(1),
.aniBox .letter:nth-child(1) {
	transition-delay: 50ms
}

.alanBox .ani:nth-child(2),
.alanBox .letter:nth-child(2),
.aniBox .ani:nth-child(2),
.aniBox .letter:nth-child(2) {
	transition-delay: .1s
}

.alanBox .ani:nth-child(3),
.alanBox .letter:nth-child(3),
.aniBox .ani:nth-child(3),
.aniBox .letter:nth-child(3) {
	transition-delay: .15s
}

.alanBox .ani:nth-child(4),
.alanBox .letter:nth-child(4),
.aniBox .ani:nth-child(4),
.aniBox .letter:nth-child(4) {
	transition-delay: .2s
}

.alanBox .ani:nth-child(5),
.alanBox .letter:nth-child(5),
.aniBox .ani:nth-child(5),
.aniBox .letter:nth-child(5) {
	transition-delay: .25s
}

.alanBox .ani:nth-child(6),
.alanBox .letter:nth-child(6),
.aniBox .ani:nth-child(6),
.aniBox .letter:nth-child(6) {
	transition-delay: .3s
}

.alanBox .ani:nth-child(7),
.alanBox .letter:nth-child(7),
.aniBox .ani:nth-child(7),
.aniBox .letter:nth-child(7) {
	transition-delay: .35s
}

.alanBox .ani:nth-child(8),
.alanBox .letter:nth-child(8),
.aniBox .ani:nth-child(8),
.aniBox .letter:nth-child(8) {
	transition-delay: .4s
}

.alanBox .ani:nth-child(9),
.alanBox .letter:nth-child(9),
.aniBox .ani:nth-child(9),
.aniBox .letter:nth-child(9) {
	transition-delay: .45s
}

.alanBox .ani:nth-child(10),
.alanBox .letter:nth-child(10),
.aniBox .ani:nth-child(10),
.aniBox .letter:nth-child(10) {
	transition-delay: .5s
}

.alanBox .ani:nth-child(11),
.alanBox .letter:nth-child(11),
.aniBox .ani:nth-child(11),
.aniBox .letter:nth-child(11) {
	transition-delay: .55s
}

.alanBox .ani:nth-child(12),
.alanBox .letter:nth-child(12),
.aniBox .ani:nth-child(12),
.aniBox .letter:nth-child(12) {
	transition-delay: .6s
}

.alanBox .ani:nth-child(13),
.alanBox .letter:nth-child(13),
.aniBox .ani:nth-child(13),
.aniBox .letter:nth-child(13) {
	transition-delay: .65s
}

.alanBox .ani:nth-child(14),
.alanBox .letter:nth-child(14),
.aniBox .ani:nth-child(14),
.aniBox .letter:nth-child(14) {
	transition-delay: .7s
}

.alanBox .ani:nth-child(15),
.alanBox .letter:nth-child(15),
.aniBox .ani:nth-child(15),
.aniBox .letter:nth-child(15) {
	transition-delay: .75s
}

.alanBox .ani:nth-child(16),
.alanBox .letter:nth-child(16),
.aniBox .ani:nth-child(16),
.aniBox .letter:nth-child(16) {
	transition-delay: .8s
}

.alanBox .ani:nth-child(17),
.alanBox .letter:nth-child(17),
.aniBox .ani:nth-child(17),
.aniBox .letter:nth-child(17) {
	transition-delay: .85s
}

.alanBox .ani:nth-child(18),
.alanBox .letter:nth-child(18),
.aniBox .ani:nth-child(18),
.aniBox .letter:nth-child(18) {
	transition-delay: .9s
}

.alanBox .ani:nth-child(19),
.alanBox .letter:nth-child(19),
.aniBox .ani:nth-child(19),
.aniBox .letter:nth-child(19) {
	transition-delay: .95s
}

.alanBox .ani:nth-child(20),
.alanBox .letter:nth-child(20),
.aniBox .ani:nth-child(20),
.aniBox .letter:nth-child(20) {
	transition-delay: 1s
}

.alanBox.active .ani,
.alanBox.active .letter,
.alanBox.go .ani,
.alanBox.go .letter,
.aniBox.active .ani,
.aniBox.active .letter,
.aniBox.go .ani,
.aniBox.go .letter {
	opacity: 1;
	transform: translate(0, 0)
}

.layer-item .list {
	width: 100%;
	padding: 5px 0 5px .2rem;
	position: relative
}

.layer-item .list .dot {
	width: 6px;
	height: 6px;
	background-color: #000;
	border-radius: 50%;
	position: absolute;
	top: calc(.7em + 2px);
	left: 0
}

.layer-item .list .dot.gray {
	background-color: #3c4141
}

.layer-item .list .dot.wc {
	background-color: #fff
}

.layer-item .list .dot.mc {
	background-color: #e27402
}

.layer-item .list p {
	line-height: 1.3
}

.error {
	border: 1px solid red !important
}

.layer-logoSw {
	width: 100%;
	grid-auto-flow: column;
	padding: .5rem 0 .2rem;
	display: grid
}

.layer-logoSw .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

.layer-logoSw .swiper-wrapper .swiper-slide {
	padding-right: .5rem
}

.layer-logoSw .swiper-wrapper .swiper-slide .photo {
	height: .8rem
}

.layer-logoSw .swiper-wrapper .swiper-slide .photo>img {
	height: .8rem;
	opacity: .3;
	width: 1.4rem;
	object-fit: contain;
	display: block
}

.layer-logoSw.go .swiper-wrapper {
	animation: 15s linear infinite logoSw
}

.layer-map {
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

.layer-map .left .top {
	margin-bottom: .4rem
}

.layer-map .left .mid {
	grid-auto-flow: row;
	gap: .2rem 0;
	display: grid
}

.layer-map .left .mid .list {
	height: 1rem;
	width: 3.6rem;
	background-color: #fff;
	border-radius: .16rem
}

.layer-map .left .mid .list .mr {
	margin-right: .1rem
}

.layer-map .left .mid .list .gray {
	color: gray
}

.layer-map .left .mid .list .icon {
	width: 1.05rem;
	height: 100%;
	position: relative
}

.layer-map .left .mid .list .icon .dot {
	width: 6px;
	height: 6px;
	background-color: #000;
	border: 1px solid #000;
	border-radius: 50%;
	position: absolute;
	top: .15rem;
	left: .15rem
}

.layer-map .left .mid .list .icon .dot.mc {
	background-color: #e27402;
	border-color: #e27402
}

.layer-map .left .mid .list .icon .dot.gray {
	background-color: #a5a5a5;
	border-color: #a5a5a5
}

.layer-map .left .mid .list .icon .dot.clear {
	background-color: transparent;
	border-color: #101010
}

.layer-map .left .mid .list .icon>img {
	width: 42%;
	height: 30%;
	object-fit: contain
}

.layer-map .left .mid .list .f-50 {
	line-height: 1
}

.layer-map .left .mid .list>em {
	line-height: .9
}

.layer-map .left .mid .list>.f-60:first-of-type,
.layer-map .left .mid .solarInner .simple_r2 .inner .group .box>p .list>sub:first-of-type,
.solarInner .simple_r2 .inner .group .box>p .layer-map .left .mid .list>sub:first-of-type {
	padding-left: .3rem
}

.layer-map .left .mid .list>small {
	height: 3em;
	line-height: 5em;
	font-size: inherit;
	color: inherit;
	font-family: inherit
}

.layer-map .right {
	height: 6.3rem;
	position: relative
}

.layer-map .right .map {
	height: 6.3rem;
	position: absolute;
	top: 0;
	left: -1.5rem
}

.layer-appBigBtn {
	pointer-events: auto;
	width: 1.2rem;
	height: 1.2rem;
	background-color: #fff;
	border-radius: 50%;
	box-shadow: 0 0 .1rem -1px rgba(0, 0, 0, .15)
}

#app header {
	width: 100%;
	pointer-events: none;
	z-index: 200;
	transition: all .6s cubic-bezier(.38, 0, 0, 1);
	position: fixed;
	top: 0;
	left: 0
}

#app header .navMask {
	z-index: 1;
	width: 100%;
	height: 5rem;
	transform-origin: 50% 0;
	background-color: rgba(0, 0, 0, .8);
	transition: transform .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0;
	transform: scaleY(0)
}

#app header .pcNav {
	height: 1.4rem;
	pointer-events: none;
	z-index: 2;
	transform-origin: 50% 0;
	padding-top: .2rem;
	transition: height .6s cubic-bezier(.38, 0, 0, 1), opacity .8s cubic-bezier(.38, 0, 0, 1), transform .8s cubic-bezier(.38, 0, 0, 1), padding-top .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#app header .pcNav .logoBox {
	pointer-events: auto
}

#app header .pcNav .logoBox .line {
	height: .6rem;
	width: 2px;
	background-color: #fff;
	margin: 0 .25rem
}

#app header .pcNav .logoBox .logo_w {
	height: .9rem;
	display: block
}

#app header .pcNav .items {
	pointer-events: auto;
	-ms-flex: 1;
	flex: 1;
	-ms-flex-pack: end;
	justify-content: flex-end;
	padding-right: 3%;
	display: -ms-flexbox;
	display: flex
}

#app header .pcNav .items>li {
	padding-right: .32rem;
	position: relative
}

#app header .pcNav .items>li:last-of-type {
	padding-right: 0
}

#app header .pcNav .items>li>a {
	padding: 0 .24rem;
	line-height: 1rem;
	transition: color .3s cubic-bezier(.38, 0, 0, 1);
	display: block
}

#app header .pcNav .items>li:hover>a,
#app header .pcNav .items>li.on>a {
	color: #e27402
}

#app header .pcNav .items>li .child {
	width: 100%;
	pointer-events: none;
	opacity: 0;
	padding-top: .2rem;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 100%;
	left: .24rem
}

#app header .pcNav .items>li .child>li>a {
	font-size: inherit;
	color: #fff;
	padding: .05rem .2rem .05rem 0;
	line-height: 1.2;
	transition: color .3s cubic-bezier(.38, 0, 0, 1);
	display: block
}

#app header .pcNav .items>li .child>li>a:hover {
	color: #e27402
}

#app header .pcNav .items>li .child.active {
	pointer-events: auto;
	opacity: 1
}

#app header .pcNav .set .search {
	pointer-events: auto;
	width: .6rem;
	height: .6rem;
	margin-right: .1rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#app header .pcNav .set .search .layer-icon {
	width: .6rem;
	cursor: pointer;
	height: .6rem;
	z-index: 10;
	background: rgba(255, 255, 255, .3);
	border-radius: 1rem;
	transition: background .3s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#app header .pcNav .set .search .layer-icon .iconfont {
	transition: color .3s cubic-bezier(.38, 0, 0, 1)
}

#app header .pcNav .set .search .putIn {
	width: 2.3rem;
	height: 100%;
	opacity: 0;
	z-index: 3;
	transform-origin: 100%;
	background: #fff;
	border: none;
	border-top-right-radius: 1rem;
	border-bottom-right-radius: 1rem;
	padding: 0 .3rem;
	transition: transform .6s cubic-bezier(.38, 0, 0, 1), opacity .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	right: 0;
	transform: scaleX(0)
}

#app header .pcNav .set .search:hover {
	width: 2.6rem
}

#app header .pcNav .set .search:hover .layer-icon {
	background: #e27402
}

#app header .pcNav .set .search:hover .layer-icon .iconfont {
	color: #000
}

#app header .pcNav .set .search:hover .putIn {
	opacity: 1;
	transform: scaleX(1)
}

#app header .pcNav .set .quote {
	cursor: pointer;
	pointer-events: auto
}

#app header .pcNav .other {
	height: .4rem;
	z-index: 10;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	padding: .1rem 0;
	display: -ms-flexbox;
	display: flex;
	position: absolute;
	top: 0;
	right: 0
}

#app header .pcNav .other .line {
	width: 1px;
	height: .16rem;
	background-color: rgba(255, 255, 255, .5);
	margin: 0 .2rem
}

#app header .pcNav .other .layer-icon {
	pointer-events: auto;
	cursor: pointer
}

#app header .pcNav .other .layer-icon .iconfont {
	width: .26rem;
	margin-right: 0
}

#app header .pcNav .other .layer-icon .txt {
	cursor: pointer;
	color: rgba(255, 255, 255, .5);
	transition: color .5s cubic-bezier(.38, 0, 0, 1), font-weight .5s cubic-bezier(.38, 0, 0, 1)
}

#app header .pcNav .other .layer-icon:hover .txt {
	color: #fff;
	font-weight: 600
}

#app header .pcNav .other .langDown {
	position: relative
}

#app header .pcNav .other .langDown .iconfont,
#app header .pcNav .other .langDown .txt {
	z-index: 10;
	position: relative
}

#app header .pcNav .other .langDown .child {
	width: calc(100% + .8rem);
	opacity: 0;
	pointer-events: none;
	background-color: rgba(0, 0, 0, .8);
	border-radius: .12rem 0 0 .12rem;
	padding: .4rem 0 .1rem;
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: -.1rem;
	left: -.2rem
}

#app header .pcNav .other .langDown .child>li {
	opacity: 0;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	transform: translateY(20%)
}

#app header .pcNav .other .langDown .child>li:nth-child(1) {
	transition-delay: 20ms
}

#app header .pcNav .other .langDown .child>li:nth-child(2) {
	transition-delay: 40ms
}

#app header .pcNav .other .langDown .child>li:nth-child(3) {
	transition-delay: 60ms
}

#app header .pcNav .other .langDown .child>li:nth-child(4) {
	transition-delay: 80ms
}

#app header .pcNav .other .langDown .child>li:nth-child(5) {
	transition-delay: .1s
}

#app header .pcNav .other .langDown .child>li:nth-child(6) {
	transition-delay: .12s
}

#app header .pcNav .other .langDown .child>li:nth-child(7) {
	transition-delay: .14s
}

#app header .pcNav .other .langDown .child>li:nth-child(8) {
	transition-delay: .16s
}

#app header .pcNav .other .langDown .child>li:nth-child(9) {
	transition-delay: .18s
}

#app header .pcNav .other .langDown .child>li:nth-child(10) {
	transition-delay: .2s
}

#app header .pcNav .other .langDown .child>li:nth-child(11) {
	transition-delay: .22s
}

#app header .pcNav .other .langDown .child>li:nth-child(12) {
	transition-delay: .24s
}

#app header .pcNav .other .langDown .child>li:nth-child(13) {
	transition-delay: .26s
}

#app header .pcNav .other .langDown .child>li:nth-child(14) {
	transition-delay: .28s
}

#app header .pcNav .other .langDown .child>li:nth-child(15) {
	transition-delay: .3s
}

#app header .pcNav .other .langDown .child>li:nth-child(16) {
	transition-delay: .32s
}

#app header .pcNav .other .langDown .child>li:nth-child(17) {
	transition-delay: .34s
}

#app header .pcNav .other .langDown .child>li:nth-child(18) {
	transition-delay: .36s
}

#app header .pcNav .other .langDown .child>li:nth-child(19) {
	transition-delay: .38s
}

#app header .pcNav .other .langDown .child>li:nth-child(20) {
	transition-delay: .4s
}

#app header .pcNav .other .langDown .child>li>a {
	white-space: nowrap;
	padding: 2px 0 2px .46rem;
	line-height: .4rem;
	transition: color .5s cubic-bezier(.38, 0, 0, 1);
	display: block
}

#app header .pcNav .other .langDown .child>li>a:hover {
	color: #e27402
}

@media screen and (orientation:landscape) {
	#app header .pcNav .other .langDown:hover .child {
		opacity: 1;
		pointer-events: auto
	}

	#app header .pcNav .other .langDown:hover .child>li {
		opacity: 1;
		transform: none
	}
}

#app header nav.appNav {
	width: 100%;
	height: 1.2rem;
	z-index: 2000;
	pointer-events: auto;
	transition: all .5s
}

#app header nav.appNav .inner_top {
	height: 1.2rem;
	width: 100%;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: 0 5%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex
}

#app header nav.appNav .inner_top .logoBox {
	position: relative
}

#app header nav.appNav .inner_top .logoBox .white {
	height: .54rem;
	display: block
}

#app header nav.appNav .inner_top .Solaraid {
	height: .8rem;
	cursor: pointer;
	position: absolute;
	top: .2rem;
	right: 2.7rem
}

#app header nav.appNav .inner_top .langDownApp {
	height: .8rem;
	cursor: pointer;
	position: absolute;
	top: .2rem;
	right: 1.2rem
}

#app header nav.appNav .inner_top .langDownApp .iconfont,
#app header nav.appNav .inner_top .langDownApp .txt {
	z-index: 10;
	position: relative
}

#app header nav.appNav .inner_top .langDownApp .child {
	width: calc(100% + 1.4rem);
	opacity: 0;
	pointer-events: none;
	background-color: rgba(0, 0, 0, .8);
	border-radius: .12rem 0 0 .12rem;
	padding: 1.1rem 0 .3rem;
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: -.2rem;
	left: -.2rem
}

#app header nav.appNav .inner_top .langDownApp .child>li {
	opacity: 0;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	transform: translateY(20%)
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(1) {
	transition-delay: 20ms
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(2) {
	transition-delay: 40ms
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(3) {
	transition-delay: 60ms
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(4) {
	transition-delay: 80ms
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(5) {
	transition-delay: .1s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(6) {
	transition-delay: .12s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(7) {
	transition-delay: .14s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(8) {
	transition-delay: .16s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(9) {
	transition-delay: .18s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(10) {
	transition-delay: .2s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(11) {
	transition-delay: .22s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(12) {
	transition-delay: .24s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(13) {
	transition-delay: .26s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(14) {
	transition-delay: .28s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(15) {
	transition-delay: .3s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(16) {
	transition-delay: .32s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(17) {
	transition-delay: .34s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(18) {
	transition-delay: .36s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(19) {
	transition-delay: .38s
}

#app header nav.appNav .inner_top .langDownApp .child>li:nth-child(20) {
	transition-delay: .4s
}

#app header nav.appNav .inner_top .langDownApp .child>li>a {
	white-space: nowrap;
	padding: 4px 0 4px .58rem;
	line-height: .5rem;
	transition: color .5s cubic-bezier(.38, 0, 0, 1);
	display: block
}

#app header nav.appNav .inner_top .langDownApp.active .child {
	opacity: 1;
	pointer-events: auto
}

#app header nav.appNav .inner_top .langDownApp.active .child>li {
	opacity: 1;
	transform: none
}

#app header nav.appNav .inner_top #app-menu {
	z-index: 10;
	display: inline-block;
	position: relative
}

#app header nav.appNav .inner_top #app-menu .line {
	padding-top: 3px;
	padding-bottom: 3px;
	transition: all .4s;
	display: block
}

#app header nav.appNav .inner_top #app-menu .line:before {
	content: "";
	height: 2px;
	width: .4rem;
	background-color: #fff;
	border-top-right-radius: 2px;
	border-bottom-left-radius: 2px;
	transition: transform .4s .2s, background-color .5s;
	display: block
}

#app header nav.appNav .inner_top #app-menu .line:nth-of-type(2):before {
	width: .3rem;
	margin-left: .1rem
}

#app header nav.appNav .inner_mid {
	width: 100%;
	height: calc(100% - 1.2rem);
	background-color: #000;
	position: absolute;
	top: 1.2rem;
	left: 0;
	overflow: hidden
}

#app header nav.appNav .inner_mid .firstList {
	opacity: 0;
	transition: background-color .3s, opacity 1s cubic-bezier(.38, 0, 0, 1), transform 1s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	transform: translateY(.25rem)
}

#app header nav.appNav .inner_mid .firstList:nth-child(1) {
	transition-delay: 50ms
}

#app header nav.appNav .inner_mid .firstList:nth-child(2) {
	transition-delay: .1s
}

#app header nav.appNav .inner_mid .firstList:nth-child(3) {
	transition-delay: .15s
}

#app header nav.appNav .inner_mid .firstList:nth-child(4) {
	transition-delay: .2s
}

#app header nav.appNav .inner_mid .firstList:nth-child(5) {
	transition-delay: .25s
}

#app header nav.appNav .inner_mid .firstList:nth-child(6) {
	transition-delay: .3s
}

#app header nav.appNav .inner_mid .firstList:nth-child(7) {
	transition-delay: .35s
}

#app header nav.appNav .inner_mid .firstList:nth-child(8) {
	transition-delay: .4s
}

#app header nav.appNav .inner_mid .firstList:nth-child(9) {
	transition-delay: .45s
}

#app header nav.appNav .inner_mid .firstList:nth-child(10) {
	transition-delay: .5s
}

#app header nav.appNav .inner_mid .firstList:nth-child(11) {
	transition-delay: .55s
}

#app header nav.appNav .inner_mid .firstList:nth-child(12) {
	transition-delay: .6s
}

#app header nav.appNav .inner_mid .firstList:nth-child(13) {
	transition-delay: .65s
}

#app header nav.appNav .inner_mid .firstList:nth-child(14) {
	transition-delay: .7s
}

#app header nav.appNav .inner_mid .firstList:nth-child(15) {
	transition-delay: .75s
}

#app header nav.appNav .inner_mid .firstList:nth-child(16) {
	transition-delay: .8s
}

#app header nav.appNav .inner_mid .firstList:nth-child(17) {
	transition-delay: .85s
}

#app header nav.appNav .inner_mid .firstList:nth-child(18) {
	transition-delay: .9s
}

#app header nav.appNav .inner_mid .firstList:nth-child(19) {
	transition-delay: .95s
}

#app header nav.appNav .inner_mid .firstList:nth-child(20) {
	transition-delay: 1s
}

#app header nav.appNav .inner_mid .nav-items {
	padding-top: .1rem
}

#app header nav.appNav .inner_mid .nav-items>.child_first>.firstList {
	padding: 0 5%;
	position: relative
}

#app header nav.appNav .inner_mid .nav-items>.child_first>.firstList>a {
	height: 1.2rem;
	white-space: nowrap;
	min-width: 50%;
	border-bottom: 1px solid rgba(0, 0, 0, .09);
	-ms-flex-align: center;
	align-items: center;
	line-height: 1.2rem;
	display: -ms-flexbox;
	display: flex
}

#app header nav.appNav .inner_mid .nav-items>.child_first>.firstList>i {
	height: .48rem;
	width: 50%;
	text-align: right;
	font-size: .24rem;
	line-height: .48rem;
	transition: transform .5s ease-in-out;
	display: inline-block
}

#app header nav.appNav .inner_mid .nav-items>.child_first>.firstList.active>i {
	transform: scaleY(-1)
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second {
	max-height: 0;
	background-color: #e27402;
	transition: all .5s;
	overflow: hidden
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li {
	padding: 0 9%;
	transition: background-color .3s, opacity 1s cubic-bezier(.38, 0, 0, 1), transform 1s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li:first-of-type {
	padding-top: .2rem
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li:last-of-type {
	padding-bottom: .2rem
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li>a {
	width: 72%;
	padding: .2rem 0;
	display: block
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li>i {
	height: .48rem;
	width: .54rem;
	text-align: center;
	font-size: .24rem;
	line-height: .48rem;
	transition: transform .5s ease-in-out;
	display: inline-block
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li.active {
	background-color: #042819
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li.active>i {
	transform: scaleY(-1)
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second>li.down_el>a {
	pointer-events: none
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_second.active {
	max-height: 100vh
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_three {
	max-height: 0;
	background-color: #022819;
	transition: all .5s;
	overflow: hidden
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_three>li {
	padding: 0 15%;
	position: relative
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_three>li:last-of-type {
	padding-bottom: .2rem
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_three>li>a {
	color: #fff;
	padding: .2rem 0;
	font-size: 13px;
	display: block
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_three>li.active {
	background-color: #f0f1f2
}

#app header nav.appNav .inner_mid .nav-items>.child_first .child_three.active {
	max-height: 100vh
}

#app header nav.appNav.on {
	height: 100vh
}

#app header nav.appNav.on .inner_top {
	background-color: #000
}

#app header nav.appNav.on .inner_top #app-menu .line:nth-of-type(1) {
	transform: translateY(8px)
}

#app header nav.appNav.on .inner_top #app-menu .line:nth-of-type(1):before {
	transform: rotate(45deg)
}

#app header nav.appNav.on .inner_top #app-menu .line:nth-of-type(2) {
	opacity: 0
}

#app header nav.appNav.on .inner_top #app-menu .line:nth-of-type(3) {
	transform: translateY(-8px)
}

#app header nav.appNav.on .inner_top #app-menu .line:nth-of-type(3):before {
	transform: rotate(-45deg)
}

#app header nav.appNav.on .inner_mid .firstList {
	opacity: 1;
	transform: none
}

#app header.open .appNav .inner_mid {
	opacity: 1;
	pointer-events: auto
}

#app header.open .appNav .inner_mid .nav-items>.child_first>.firstList {
	opacity: 1;
	transform: none
}

#app header.down {
	background-color: rgba(0, 0, 0, .8)
}

#app header.down .pcNav {
	height: 1.2rem
}

#app header.down+.pageTree {
	background-color: rgba(26, 28, 31, .6);
	top: 1.2rem
}

#app header.open {
	background-color: transparent
}

#app header.open .navMask {
	opacity: 1;
	transform: scaleY(1)
}

#app header.black {
	background-color: #000
}

#app header.black+.pageTree {
	background-color: rgba(26, 28, 31, .4)
}

#app .pageTree {
	height: .4rem;
	width: 100%;
	z-index: 180;
	transition: top .6s cubic-bezier(.38, 0, 0, 1), background-color .5s cubic-bezier(.38, 0, 0, 1);
	position: fixed;
	top: 1.4rem;
	left: 0
}

#app .pageTree .group {
	height: 100%
}

#app .pageTree .group .items .iconfont {
	margin: 0 .15rem
}

#app .pageTree .group .items .downIcon {
	padding-right: .22rem;
	position: relative
}

#app .pageTree .group .items .downIcon .arrow {
	width: 0;
	height: 0;
	transform-origin: 0 20%;
	z-index: 10;
	border: 5px solid transparent;
	border-top-color: #fff;
	margin: auto 0;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 6px;
	bottom: 0;
	right: 0
}

#app .pageTree .group .items>li {
	position: relative
}

#app .pageTree .group .tab {
	-ms-flex-pack: end;
	justify-content: flex-end
}

#app .pageTree .group .tab>a {
	color: rgba(255, 255, 255, .5);
	padding: 0 .3rem;
	transition: color .3s cubic-bezier(.38, 0, 0, 1)
}

#app .pageTree .group .tab>a:last-of-type {
	padding-right: 0
}

#app .pageTree .group .tab>a:hover,
#app .pageTree .group .tab>a.on {
	color: #fff
}

#app main .row {
	position: relative
}

#app main .row>.line {
	height: 1px;
	background-color: rgba(60, 65, 65, .3)
}

#app main .row>.bg {
	z-index: 1
}

#app main .row>.bg>.pic[data-scroll] {
	height: calc(100% + 2rem);
	top: -1rem
}

#app main .row>.inner {
	z-index: 10;
	position: relative
}

#app main .rowContact {
	background: linear-gradient(90deg, #ffeb00, #e27402);
	padding: 1rem 0 .85rem
}

#app main .rowContact .inner .form {
	-ms-flex-align: start;
	align-items: flex-start
}

#app main .rowContact .inner .form h2 {
	line-height: 2rem
}

#app main .rowContact .inner .form .col {
	width: 9.3rem;
	position: relative
}

#app main .rowContact .inner .form .col .inRow {
	width: 100%;
	grid-template-columns: repeat(var(--col), 1fr);
	gap: .1rem;
	margin-bottom: .1rem;
	display: grid;
	position: relative
}

#app main .rowContact .inner .form .col .inRow:nth-of-type(2) {
	z-index: 5
}

#app main .rowContact .inner .form .col .inRow .inTxt {
	height: .5rem;
	background-color: rgba(255, 255, 255, .9);
	border-radius: .12rem;
	padding: 0 .2rem;
	position: relative
}

#app main .rowContact .inner .form .col .inRow .inTxt>input[type=text] {
	width: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none;
	padding: 0;
	line-height: .5rem;
	display: block
}

#app main .rowContact .inner .form .col .inRow .inTxt>input[type=text]::-ms-input-placeholder {
	color: #1c1f1f;
	font-size: 12px
}

#app main .rowContact .inner .form .col .inRow .inTxt>input[type=text]::placeholder {
	color: #1c1f1f;
	font-size: 12px
}

#app main .rowContact .inner .form .col .inRow .inTxt .must {
	color: #000;
	font-size: .2rem;
	position: absolute;
	top: .04rem;
	left: .12rem
}

#app main .rowContact .inner .form .col .inRow .inDown {
	height: .5rem;
	position: relative
}

#app main .rowContact .inner .form .col .inRow .inDown .input-text {
	height: .5rem;
	width: 100%;
	cursor: pointer;
	background-color: rgba(255, 255, 255, .9);
	border: none;
	border-radius: .12rem;
	padding: 0 .2rem;
	position: relative
}

#app main .rowContact .inner .form .col .inRow .inDown .input-text .must {
	color: #000;
	font-size: .2rem;
	position: absolute;
	top: .04rem;
	left: .12rem
}

#app main .rowContact .inner .form .col .inRow .inDown .input-text>input[type=text] {
	height: 100%;
	text-indent: 0;
	width: 100%;
	pointer-events: none;
	background-color: transparent;
	border: none
}

#app main .rowContact .inner .form .col .inRow .inDown .input-text .arrow {
	width: 0;
	height: 0;
	transform-origin: 0 20%;
	z-index: 10;
	border: 5px solid transparent;
	border-top-color: #1c1f1f;
	margin: auto 0;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 5px;
	bottom: 0;
	right: .2rem
}

#app main .rowContact .inner .form .col .inRow .inDown .childDown {
	width: 100%;
	max-height: calc(1.04167vw + 2rem);
	background-color: rgba(255, 255, 255, .9);
	border-bottom-right-radius: .18rem;
	border-bottom-left-radius: .18rem;
	padding: .1rem .2rem;
	display: none;
	position: absolute;
	top: calc(100% - .09rem);
	left: 0;
	overflow: auto
}

#app main .rowContact .inner .form .col .inRow .inDown .childDown>li {
	width: 100%
}

#app main .rowContact .inner .form .col .inRow .inDown .childDown>li>a,
#app main .rowContact .inner .form .col .inRow .inDown .childDown>li>span {
	width: 100%;
	cursor: pointer;
	line-height: .4rem;
	display: block
}

#app main .rowContact .inner .form .col .inRow .inArea {
	width: 100%;
	background-color: rgba(255, 255, 255, .9);
	border-radius: .12rem;
	padding: .2rem
}

#app main .rowContact .inner .form .col .inRow .inArea textarea {
	width: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none;
	display: block
}

#app main .rowContact .inner .form .col .inRow .inArea textarea::-ms-input-placeholder {
	color: rgba(28, 31, 31, .5);
	font-size: 12px
}

#app main .rowContact .inner .form .col .inRow .inArea textarea::placeholder {
	color: rgba(28, 31, 31, .5);
	font-size: 12px
}

#app main .rowContact .inner .form .col .inRow .btm {
	padding: 5px 0 5px .2rem
}

#app main .rowContact .inner .form .col .inRow .btm .layer-btn {
	width: 2.4rem
}

#app main .rowContact .inner .form .col .inRow .btm .layer-btn .mk {
	background-color: #fff
}

#app main .rowContact .inner .form .col .inRow .btm .layer-btn:hover {
	box-shadow: 0 .1rem .2rem -4px rgba(35, 38, 38, .3)
}

#app main .rowContact .inner .form .col .loadMk {
	z-index: 50;
	opacity: 0;
	pointer-events: none;
	background-color: rgba(255, 255, 255, .8);
	border-radius: .18rem;
	transition: opacity .3s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden
}

#app main .rowContact .inner .form .col .loadMk .loader {
	width: 1rem
}

#app main .rowContact .inner .form .col .loadMk.active {
	opacity: 1
}

#app main .rowMap {
	background-color: #efefef;
	padding: 1rem 0 1.7rem
}

#app main .rowMap .inner {
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

#app main .Foot .btm {
	height: 1.5rem;
	z-index: 10;
	background-color: #fff;
	position: relative
}

#app main .Foot .btm .putIn .inRow {
	width: 6.2rem;
	height: .6rem;
	text-align: center;
	background-color: #f2f2f2;
	border: none;
	border-radius: 1rem;
	margin-right: .1rem
}

#app main .Foot .btm .putIn .sub .iconfont {
	transform: none !important
}

#app footer {
	background-color: #1c1f1f;
	padding-top: 1.2rem
}

#app footer .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

#app footer .top .logo>img {
	height: .84rem;
	display: block
}

#app footer .top .items {
	width: 55%;
	grid-template-columns: repeat(6, auto);
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding-top: .2rem;
	padding-right: 1rem;
	display: grid
}

#app footer .top .items>li {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-right: .8rem;
	display: -ms-flexbox;
	display: flex
}

#app footer .top .items>li:last-of-type {
	margin-right: 0
}

#app footer .top .items>li .f-16,
#app footer .top .items>li #Popup>span {
	margin-bottom: .2rem
}

#app footer .top .items>li .f-14,
#app footer .top .items>li #newDetail .r1 .inner .mid .detail *,
#newDetail .r1 .inner .mid .detail #app footer .top .items>li * {
	color: rgba(255, 255, 255, .5);
	line-height: .3rem
}

#app footer .top .items>li .f-14:hover,
#app footer .top .items>li #newDetail .r1 .inner .mid .detail :hover,
#newDetail .r1 .inner .mid .detail #app footer .top .items>li :hover {
	color: #fff
}

#app footer .mid {
	-ms-flex-align: end;
	align-items: flex-end;
	padding-bottom: .6rem
}

#app footer .mid .items {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	display: -ms-flexbox;
	display: flex
}

#app footer .mid .items>li {
	width: 3.4rem;
	padding: .12rem 0
}

#app footer .mid .items>li .iconfont {
	margin-right: .2rem
}

#app footer .mid .box {
	width: 50%;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-right: 1rem
}

#app footer .mid .box .sendBox .putIn .inRow {
	height: .54rem;
	text-align: center;
	width: 3.2rem;
	background-color: #f2f2f2;
	border: none;
	border-radius: 1rem;
	margin-right: .1rem
}

#app footer .mid .box .sendBox .putIn .sub {
	height: .54rem
}

#app footer .mid .box .sendBox .putIn .sub .iconfont {
	transform: none !important
}

#app footer .mid .shareBox .share {
	width: .44rem;
	height: .44rem;
	background: #efefef;
	border: 1px solid #e27402;
	border-radius: 50%;
	margin-right: .12rem
}

#app footer .mid .shareBox .share.face .iconfont {
	color: #3c5a99
}

#app footer .mid .shareBox .share.twi .iconfont {
	color: #000
}

#app footer .mid .shareBox .share.tuBe .iconfont {
	color: #d81e06
}

#app footer .mid .shareBox .share.liIn .iconfont {
	color: #0077b5
}

#app footer .btm {
	border-top: 1px solid rgba(242, 242, 242, .15);
	grid-template-columns: 50% 2fr 1fr;
	padding: .3rem 0 .6rem;
	display: flex;
	justify-content: space-between;
}

#app footer .btm .c1 {
	color: #efefef
}

#app footer .btm .c2 {
	color: rgba(239, 239, 239, .8)
}

#app footer .btm .c3 {
	color: rgba(239, 239, 239, .3);
	text-align: right
}
#app footer .btm .c3 img{margin-left: 20px;}
#app footer .btm .line {
	margin: 0 .1rem
}

#app .pop {
	width: 100%;
	height: 100%;
	z-index: 1000;
	display: none;
	position: fixed;
	top: 0;
	left: 0
}

#app .pop .mask {
	background-color: rgba(0, 0, 0, .8)
}

#app .pop .popCon {
	width: 68vw;
	z-index: 10;
	opacity: 0;
	position: relative;
	transform: translateY(15%)
}

#app .pop .popCon .media {
	width: 100%;
	object-fit: cover;
	display: block
}

#app .pop .popCon .closePop {
	color: #fff;
	transition: transform .3s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: calc(100% + .1rem)
}

@media screen and (orientation:landscape) {
	#app .pop .popCon .closePop:hover {
		transform: rotate(90deg)
	}
}

#app .pop.on {
	display: -ms-flexbox;
	display: flex
}

#Popup {
	width: 100%;
	height: 2rem;
	z-index: 200;
	pointer-events: none;
	opacity: 0;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1);
	position: fixed;
	bottom: 30%;
	left: 0;
	transform: translateY(.3rem)
}

#Popup>span {
	color: #fff;
	background-color: #000;
	border-radius: .12rem;
	padding: .1rem .3rem
}

#Popup.on {
	opacity: 1;
	transform: translateY(0)
}

.bigPop {
	width: 100%;
	height: 100%;
	z-index: 1000;
	opacity: 0;
	pointer-events: none;
	background-color: rgba(0, 0, 0, .8);
	position: fixed;
	top: 0;
	left: 0;
	overflow: hidden
}

.bigPop .close {
	width: .64rem;
	height: .64rem;
	border: 1px solid #fff;
	border-radius: 50%;
	position: absolute;
	top: 5vw;
	right: 5vw
}

.bigPop .imgBox {
	width: 100%;
	height: 50%;
	overflow: auto
}

.bigPop .imgBox .img {
	max-width: 100%;
	max-height: 100%;
	margin: auto;
	display: block
}

.bigPop .imgBox #canvas {
	background-color: #f2f2f2
}

.bigPop.active {
	opacity: 1;
	pointer-events: auto
}

.packagePop {
	width: 100%;
	height: 100%;
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	display: -ms-flexbox;
	display: flex;
	position: fixed;
	top: 0;
	left: 0
}

.packagePop .mask {
	background-color: rgba(0, 0, 0, .8)
}

.packagePop .popCon {
	width: 80vw;
	z-index: 10;
	opacity: 0;
	height: 39.1949vw;
	background-color: #000;
	border-radius: .2rem;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	transform: translateY(15%)
}

.packagePop .popCon .box {
	height: 95%;
	width: 100%;
	overflow: auto
}

.packagePop .popCon .box>img {
	width: 100%;
	display: block
}

.packagePop .popCon .closePackagePop {
	color: #fff;
	transition: transform .3s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: calc(100% + .1rem)
}

.packagePop .popCon .closePackagePop:hover {
	transform: rotate(90deg)
}

.packagePop.on {
	pointer-events: auto
}

.imgPopup {
	width: 100%;
	height: 100%;
	z-index: 1000;
	display: none;
	position: fixed;
	top: 0;
	left: 0
}

.imgPopup.on {
	display: -ms-flexbox;
	display: flex
}

.imgPopup .mask {
	background-color: rgba(0, 0, 0, .8)
}

.imgPopup .popCon {
	width: 55vw;
	opacity: 0;
	position: relative;
	transform: translateY(15%)
}

.imgPopup .popCon .msg {
	width: 100%;
	border-radius: .2rem;
	overflow: hidden;
	transform: translateZ(0)
}

.imgPopup .popCon .msg .photo {
	width: 100%;
	padding-bottom: 55%;
	display: block;
	position: relative
}

.imgPopup .popCon .msg .photo .pic {
	opacity: 0;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1)
}

.imgPopup .popCon .msg .photo .pic.on {
	opacity: 1
}

.imgPopup .popCon .msg .box {
	width: 100%;
	background: linear-gradient(0deg, #000 0, transparent 100%);
	grid-template-columns: repeat(4, auto);
	gap: 0 1rem;
	padding: 0 .4rem;
	display: grid;
	position: absolute;
	bottom: 0;
	left: 0
}

.imgPopup .popCon .msg .box .list {
	height: 2.2rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-top: .8rem;
	padding-bottom: .4rem;
	display: -ms-flexbox;
	display: flex
}

.imgPopup .popCon .msg .box .list>small {
	color: rgba(255, 255, 255, .5);
	display: block
}

.imgPopup .popCon .msg .box .list>h4 {
	text-align: left;
	line-height: 1
}

.imgPopup .popCon .prevBtn {
	width: .55rem;
	height: .55rem;
	z-index: 9;
	-webkit-backdrop-filter: blur(.1rem);
	-webkit-backdrop-filter: blur(.1rem);
	backdrop-filter: blur(.1rem);
	background-color: rgba(0, 0, 0, .1);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1);
	left: .32rem
}

@media screen and (orientation:landscape) {
	.imgPopup .popCon .prevBtn:hover {
		background-color: rgba(0, 0, 0, .6)
	}
}

.imgPopup .popCon .nextBtn {
	width: .55rem;
	height: .55rem;
	z-index: 9;
	-webkit-backdrop-filter: blur(.1rem);
	-webkit-backdrop-filter: blur(.1rem);
	backdrop-filter: blur(.1rem);
	background-color: rgba(0, 0, 0, .1);
	border-radius: 50%;
	right: .32em
}

@media screen and (orientation:landscape) {
	.imgPopup .popCon .nextBtn:hover {
		background-color: rgba(0, 0, 0, .6)
	}
}

.imgPopup .popCon .pager {
	width: 100%;
	height: .6rem;
	position: absolute;
	top: 0;
	left: 0
}

.imgPopup .popCon .pager>li {
	width: 7px;
	height: 7px;
	background-color: rgba(255, 255, 255, .3);
	border-radius: 50%;
	margin: 0 .05rem
}

.imgPopup .popCon .pager>li.on {
	background-color: #fff
}

.imgPopup .popCon .closeImgPop {
	width: .32rem;
	height: .32rem;
	color: #fff;
	margin: 0 auto;
	transition: transform .3s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: calc(100% + .2rem);
	left: 0;
	right: 0
}

.imgPopup .popCon .closeImgPop:hover {
	transform: rotate(90deg)
}

#loading {
	width: 100%;
	height: 100%;
	z-index: 210;
	pointer-events: none;
	position: fixed;
	top: 0;
	left: 0
}

#loading .svgIcon {
	width: 100vw;
	z-index: 2;
	pointer-events: none
}

#loading .svgIcon .cls-w {
	fill: #fff;
}

#loading .svgIcon .cls-b {
	fill: #000;
	transition: transform 1s cubic-bezier(.38, 0, 0, 1);
	transform-origin: 50% 50% !important
}

#loading .svgIcon .cls-b.active {
	transform: scale(90);
}

#loading .group {
	z-index: 5;
	width: 100%;
	height: 100%;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	padding-top: 5vw;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#loading .group .img {
	height: 1em;
	margin-top: -.5em
}

#loading .group .txt {
	opacity: 0;
	text-transform: uppercase;
	padding-left: 1%
}

#loading .group .txt .letter {
	margin: 0 .2em
}

#loading .loadMask {
	height: 50%;
	width: 100%;
	z-index: 1;
	background: linear-gradient(#e27402 0%, rgba(254, 219, 0, 0) 100%);
	transition: transform 1.8s cubic-bezier(.38, 0, 0, 1) .5s, opacity .5s cubic-bezier(.38, 0, 0, 1) 1.6s;
	position: absolute;
	top: 80%;
	left: 0
}

#loading .bgMask {
	z-index: 0;
	background-color: #000;
	transition: opacity 1.6s cubic-bezier(.38, 0, 0, 1) .5s
}

#loading.active .group .txt {
	opacity: 1
}

#loading.active .loadMask {
	opacity: 0;
	transform: translateY(-200%)
}

#loading.active .bgMask {
	opacity: 0
}

.dotFn {
	margin-left: .15rem;
	position: relative
}

.dotFn:before {
	content: "";
	width: .12rem;
	max-width: .8rem;
	height: 100%;
	max-height: .4rem;
	transform-origin: 0;
	opacity: 0;
	background-color: #e27402;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), width .7s cubic-bezier(.38, 0, 0, 1), transform .7s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	left: -.07rem;
	transform: skew(-10deg)
}

.dotFn .txt {
	z-index: 10;
	white-space: nowrap;
	line-height: 1em;
	position: relative
}

.dotFn .txt .letter {
	opacity: 0;
	margin-right: .3em
}

.dotFn .txt .letter:nth-of-type(1) {
	transform: translate(.3rem)
}

.dotFn .txt .letter:nth-of-type(2) {
	transform: translate(.4rem)
}

.dotFn .txt .letter:nth-of-type(3) {
	transform: translate(.5rem)
}

.dotFn .txt .letter:nth-of-type(4) {
	transform: translate(.6rem)
}

.dotFn .txt .letter:nth-of-type(5) {
	transform: translate(.7rem)
}

.dotFn .txt .letter:nth-of-type(6) {
	transform: translate(.8rem)
}

.dotFn .txt .letter:nth-of-type(7) {
	transform: translate(.9rem)
}

.dotFn .txt .letter:nth-of-type(8) {
	transform: translate(1rem)
}

.dotFn .txt .letter:nth-of-type(9) {
	transform: translate(1.1rem)
}

.dotFn .txt .letter:nth-of-type(10) {
	transform: translate(1.2rem)
}

.dotFn .txt .letter:nth-of-type(11) {
	transform: translate(1.3rem)
}

.dotFn .txt .letter:nth-of-type(12) {
	transform: translate(1.4rem)
}

.dotFn .txt .letter:nth-of-type(13) {
	transform: translate(1.5rem)
}

.dotFn .txt .letter:nth-of-type(14) {
	transform: translate(1.6rem)
}

.dotFn .txt .letter:nth-of-type(15) {
	transform: translate(1.7rem)
}

.dotFn .txt .letter:nth-of-type(16) {
	transform: translate(1.8rem)
}

.dotFn .txt .letter:nth-of-type(17) {
	transform: translate(1.9rem)
}

.dotFn .txt .letter:nth-of-type(18) {
	transform: translate(2rem)
}

.dotFn .txt .letter:nth-of-type(19) {
	transform: translate(2.1rem)
}

.dotFn .txt .letter:nth-of-type(20) {
	transform: translate(2.2rem)
}

.dotFn.go:before {
	opacity: 1
}

.dotFn.go .txt .letter {
	opacity: 1;
	transform: translate(0, 0)
}

.startBody {
	height: 100vh;
	width: 100vw;
	overflow: hidden
}

#home {
	width: 100%;
	background-color: #efefef;
	display: block
}

#home .row {
	width: 100%
}

#home .row>.line {
	height: 1px;
	background-color: rgba(60, 65, 65, .3)
}

#home .row>.inner {
	z-index: 4;
	position: relative
}

#home .banner {
	width: 100%;
	display: block
}

#home .banner .bg {
	background-color: #000;
	transition: transform 1.2s cubic-bezier(.38, 0, 0, 1)
}

#home .banner .bg:after {
	content: "";
	pointer-events: none;
	z-index: 20;
	background-color: rgba(0, 0, 0, .15)
}

#home .banner .bg .pic {
	opacity: 0;
	transition: opacity .7s cubic-bezier(.38, 0, 0, 1), transform 2.4s cubic-bezier(.38, 0, 0, 1);
	transform: scale(1.1)
}

#home .banner .bg .pic .media {
	width: 100%;
	height: 100vh;
	object-fit: cover;
	display: block
}

#home .banner .bg .pic .bannerMediaApp {
	height: 100%;
	width: 278.4vw;
	position: absolute;
	top: 0;
	left: -89.2vw
}

#home .banner .bg .pic.active {
	opacity: 1;
	transform: scale(1)
}

#home .banner .inner {
	position: relative
}

#home .banner .inner .group {
	height: calc(100vh - 10vw);
	width: 100%;
	max-height: 78vh;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: 0 .6rem .6rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#home .banner .inner .group .list {
	pointer-events: none;
	position: absolute;
	bottom: .6rem;
	left: .6rem
}

#home .banner .inner .group .list .set .tab {
	text-align: center;
	border: 3px solid #e27402;
	border-radius: 1rem;
	margin-right: .2rem;
	padding: .12rem .3rem;
	position: relative;
	overflow: hidden
}

#home .banner .inner .group .list .set .tab:after {
	content: "";
	width: 120%;
	height: 100%;
	background-color: #e27402;
	border-radius: 1rem;
	transition: transform .8s cubic-bezier(.38, 0, 0, 1), background-color .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: -10%;
	transform: translate(-100%)
}

#home .banner .inner .group .list .set .tab>span {
	z-index: 10;
	line-height: 1;
	transition: color .5s cubic-bezier(.38, 0, 0, 1);
	display: block;
	position: relative
}

#home .banner .inner .group .list .set .tab:hover,
#home .banner .inner .group .list .set .tab.on {
	background-color: #e27402;
	transition: background-color .8s cubic-bezier(.38, 0, 0, 1) .3s
}

#home .banner .inner .group .list .set .tab:hover:after,
#home .banner .inner .group .list .set .tab.on:after {
	transform: translate(0, 0)
}

#home .banner .inner .group .list .set .tab:hover>span,
#home .banner .inner .group .list .set .tab.on>span {
	color: #232626
}

#home .banner .inner .group .list h2 {
	line-height: 1
}

#home .banner .inner .group .list h2 small {
	font-weight: 100;
	font-size: inherit;
	text-transform: uppercase
}

#home .banner .inner .group .list p {
	line-height: 2
}

#home .banner .inner .group .list:first-of-type {
	position: relative;
	bottom: 0;
	left: 0
}

#home .banner .inner .group .list.active {
	pointer-events: auto
}

#home .banner .inner .group h1 {
	line-height: 1.18
}

#home .banner .inner .group h1 .letter {
	display: block;
	overflow: hidden
}

#home .banner .inner .group h1 .letter .childLetter {
	margin-right: .2em
}

#home .banner .inner .group .bannerPage {
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	padding-top: .6rem;
	display: -ms-flexbox;
	display: flex;
	position: absolute;
	top: 0;
	right: .6rem
}

#home .banner .inner .group .bannerPage .bannerDot {
	cursor: pointer;
	width: .12rem;
	height: .12rem;
	border: 1px solid rgba(255, 255, 255, .8);
	border-radius: 50%;
	margin: .12rem 0;
	transition: background-color .6s cubic-bezier(.38, 0, 0, 1), border-color .6s cubic-bezier(.38, 0, 0, 1)
}

#home .banner .inner .group .bannerPage .bannerDot.active {
	background-color: #fff;
	border-color: #fff
}

#home .banner .part {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: 1.1rem .6rem 1.2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#home .banner .part .mask {
	background-color: #efefef;
	transition: transform 1s cubic-bezier(.38, 0, 0, 1);
	transform: translateY(15vw)
}

#home .banner .part .head {
	width: .9rem;
	height: .9rem;
	z-index: 2;
	opacity: 0;
	background-color: #fff;
	border-radius: 50%;
	transition: opacity 1s cubic-bezier(.38, 0, 0, 1), transform 1s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: -.45rem;
	right: .6rem;
	transform: translateY(.25rem);
	box-shadow: 10px .83333vw 3.125vw rgba(0, 0, 0, .1)
}

#home .banner .part .head:after {
	content: "";
	background: linear-gradient(150deg, rgba(0, 0, 0, .35) 100%, transparent 0%);
	border-radius: 50%
}

#home .banner .part .head>p {
	width: calc(100% + 2rem);
	text-align: center;
	position: absolute;
	bottom: calc(100% + .12rem);
	left: -1rem
}

#home .banner .part .head .pic {
	z-index: 10;
	width: 100%;
	height: 100%;
	background-size: contain;
	border-radius: 50%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden
}

#home .banner .part .head.active {
	opacity: 1;
	transform: translate(0, 0)
}

#home .banner .part .topic {
	z-index: 3;
	position: relative
}

#home .banner .part .box {
	width: 100%;
	z-index: 4;
	grid-template-columns: 50% 50%;
	padding: 1rem 0;
	display: grid;
	position: relative
}

#home .banner .part .box .left {
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-right: 15%;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#home .banner .part .box .left .list:nth-of-type(1) {
	z-index: 12;
	position: relative
}

#home .banner .part .box .left h3 {
	z-index: 20;
	line-height: 1.1;
	position: relative
}

#home .banner .part .box .left h3 .letter {
	display: block;
	overflow: hidden
}

#home .banner .part .box .left .mk {
	z-index: 10;
	width: 8.6rem;
	position: absolute;
	top: -1.6rem;
	right: -8.5rem
}

#home .banner .part .box .left .mk .sign {
	height: 7.5rem
}

#home .banner .part .box .right {
	z-index: 10;
	grid-template-rows: repeat(2, 2.6rem);
	grid-template-columns: repeat(2, 1fr);
	gap: .2rem;
	padding-right: 8%;
	display: grid;
	position: relative
}

#home .banner .part .box .right .chunk {
	-webkit-backdrop-filter: blur(.15rem);
	-webkit-backdrop-filter: blur(.15rem);
	backdrop-filter: blur(.15rem);
	background-color: rgba(255, 255, 255, .8);
	border-radius: .16rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: .4rem .4rem .4rem .5rem;
	display: -ms-flexbox;
	display: flex
}

#home .banner .part .box .right .chunk .img {
	max-height: .5rem;
	display: block
}

#home .banner .part .box .right .chunk .col {
	width: 100%;
	text-align: right
}

#home .banner .part .box .right .chunk .col h4 {
	text-align: right
}

#home .banner .part .box .right .chunk .col h4 em {
	color: inherit;
	margin: 0 .1rem;
	font-family: inherit;
	line-height: 1
}

#home .banner .part .box .right .chunk .col p {
	color: rgba(35, 38, 38, .5);
	text-align: right
}

@media screen and (orientation:portrait) {
	#home .banner .part .box .left .list {
		opacity: 0
	}

	#home .banner .part .box.go .left .list {
		animation: .8s cubic-bezier(.38, 0, 0, 1) both fadeInUpSmall
	}

	#home .banner .part .box.go .left .list:nth-of-type(1) {
		animation-delay: .2s
	}

	#home .banner .part .box.go .left .list:nth-of-type(2) {
		animation-delay: .3s
	}
}

#home .banner.active .bg {
	transform: translateY(-10vw)
}

#home .banner.active .part .mask {
	transform: translate(0, 0)
}

#home .r1 {
	padding-bottom: .8rem
}

#home .r1 .inner {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-top: .5rem;
	display: -ms-flexbox;
	display: flex
}

#home .r1 .inner .group {
	width: 100%
}

#home .r1 .inner .group .list {
	margin-bottom: .4rem
}

#home .r1 .inner .group .list .left {
	width: 4.5rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: .3rem .6rem .3rem .3rem;
	display: -ms-flexbox;
	display: flex
}

#home .r1 .inner .group .list .left>.img {
	height: .55rem;
	margin-bottom: .2rem;
	display: block
}

#home .r1 .inner .group .list .left h3 {
	margin-bottom: .12rem;
	line-height: 1.2;
	overflow: hidden
}

#home .r1 .inner .group .list .left h3 .letter {
	transition-duration: .5s
}

#home .r1 .inner .group .list .left .layer-btn {
	margin-top: .4rem
}

#home .r1 .inner .group .list .right {
	width: calc(100% - 4.5rem);
	height: 6rem;
	background-color: #232626;
	border-radius: .2rem;
	padding: 0 .2rem .2rem;
	position: relative;
	overflow: hidden
}

#home .r1 .inner .group .list .right .photo {
	background-color: #232626;
	border-radius: .2rem;
	overflow: hidden
}

#home .r1 .inner .group .list .right .photo .media {
	z-index: 5;
	object-fit: cover;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#home .r1 .inner .group .list .right .photo .media.op-0+.MediaTs {
	opacity: 0
}

#home .r1 .inner .group .list .right .photo .MediaTs {
	z-index: 5;
	object-fit: cover;
	width: 100%;
	padding-bottom: 42.857%;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#home .r1 .inner .group .list .right .photo .pic {
	opacity: 0;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1)
}

#home .r1 .inner .group .list .right .photo .pic.on {
	opacity: 1
}

#home .r1 .inner .group .list .right .tree {
	z-index: 10;
	width: calc(100% - .4rem);
	position: absolute;
	bottom: .2rem;
	left: .2rem
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide {
	cursor: pointer;
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	height: .9rem;
	background-color: rgba(51, 51, 51, .5);
	border-radius: .12rem;
	-ms-flex-direction: column;
	flex-direction: column;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1), color .5s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide .layer-icon {
	height: 100%;
	width: 100%;
	opacity: 0;
	z-index: 10;
	pointer-events: none;
	margin: 0 auto;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1), opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0;
	right: 0
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide h5 {
	text-align: center;
	font-weight: 400;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1), opacity .5s cubic-bezier(.38, 0, 0, 1)
}

@media screen and (orientation:landscape) {
	#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide:hover {
		background-color: #fff
	}

	#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide:hover .layer-icon {
		opacity: 1;
		pointer-events: auto;
		transform: translateY(-.12rem)
	}

	#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide:hover h5 {
		color: #232626;
		font-weight: 600;
		transform: translateY(.12rem)
	}
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide.on {
	background-color: #fff
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide.on .layer-icon {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(-.16rem)
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide.on h5 {
	color: #232626;
	font-weight: 600;
	transform: translateY(.16rem)
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide.active {
	background-color: #fff
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide.active .layer-icon {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(-.16rem)
}

#home .r1 .inner .group .list .right .tree .swiper-wrapper .swiper-slide.active h5 {
	color: #232626;
	font-weight: 600;
	transform: translateY(.16rem)
}

#home .r1 .inner .group .list .right .tree.items-1 .swiper-wrapper {
	grid-template-columns: repeat(1, 1fr);
	gap: .2rem
}

#home .r1 .inner .group .list .right .tree.items-2 .swiper-wrapper {
	grid-template-columns: repeat(2, 1fr);
	gap: .2rem
}

#home .r1 .inner .group .list .right .tree.items-3 .swiper-wrapper {
	grid-template-columns: repeat(3, 1fr);
	gap: .2rem
}

#home .r1 .inner .group .list .right .tree.items-4 .swiper-wrapper {
	grid-template-columns: repeat(4, 1fr);
	gap: .2rem
}

#home .r1 .inner .group .list .right .tree.items-5 .swiper-wrapper {
	grid-template-columns: repeat(5, 1fr);
	gap: .2rem
}

#home .r1 .inner .group .list .right .tree.items-6 .swiper-wrapper {
	grid-template-columns: repeat(6, 1fr);
	gap: .2rem
}

#home .r1 .inner .group .btm {
	-ms-flex-direction: column;
	flex-direction: column;
	padding-top: .5rem;
	position: relative
}

#home .r1 .inner .group .btm>p {
	color: #3c4141;
	text-align: center;
	padding: .25rem 0
}

#home .r1 .inner .group .btm .set {
	z-index: 10;
	height: 1.4rem;
	width: calc(100% + 1.2rem);
	pointer-events: none;
	position: absolute;
	bottom: 0;
	left: -.6rem
}

#home .r1 .inner .group .btm .set .leftMk {
	width: 8rem;
	height: 100%;
	background: linear-gradient(-90deg, rgba(239, 239, 239, 0) 0%, #efefef 90%);
	position: absolute;
	bottom: 0;
	left: 0
}

#home .r1 .inner .group .btm .set .rightMk {
	width: 8rem;
	height: 100%;
	background: linear-gradient(90deg, rgba(239, 239, 239, 0) 0%, #efefef 90%);
	position: absolute;
	bottom: 0;
	right: 0
}

#home .r2 {
	padding-bottom: 1.5rem
}

#home .r2 .inner {
	padding-top: .5rem
}

#home .r2 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

#home .r2 .inner .top .topic {
	width: 25%
}

#home .r2 .inner .top>p {
	-ms-flex: 1;
	flex: 1
}

#home .r2 .inner .mid {
	position: relative
}

#home .r2 .inner .mid .r2Sw {
	width: 100%;
	transition-timing-function: cubic-bezier(.38, 0, 0, 1)
}

#home .r2 .inner .mid .r2Sw .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#home .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide {
	width: 46vw
}

#home .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide h3 {
	margin-bottom: .1rem;
	padding: 0 .4rem
}

#home .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo {
	height: 5rem;
	background-size: cover;
	border-radius: .2rem;
	transition: all .5s cubic-bezier(.38, 0, 0, 1);
	display: block;
	position: relative
}

#home .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo h4 {
	text-align: right;
	line-height: .74;
	position: absolute;
	bottom: 0;
	right: .4rem
}

#home .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo h4 small {
	margin-left: -.2em
}

#home .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide.swiper-slide-active .photo {
	box-shadow: 0 .3rem .8rem -5px rgba(35, 38, 38, .1)
}

#home .r2 .inner .mid .r2Sw .swiper-button-prev {
	height: 5rem;
	cursor: pointer;
	position: absolute;
	bottom: 0;
	left: 23%
}

#home .r2 .inner .mid .r2Sw .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%
}

#home .r2 .inner .mid .r2Sw .swiper-button-next {
	height: 5rem;
	cursor: pointer;
	position: absolute;
	bottom: 0;
	right: 23%
}

#home .r2 .inner .mid .r2Sw .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%
}

#home .r2 .inner .mid .set {
	z-index: 10;
	height: 100%;
	width: calc(100% + 1.2rem);
	pointer-events: none;
	position: absolute;
	bottom: 0;
	left: -.6rem
}

#home .r2 .inner .mid .set .leftMk {
	width: 6rem;
	height: 100%;
	background: linear-gradient(-90deg, rgba(239, 239, 239, 0) 0%, #efefef 100%);
	position: absolute;
	bottom: 0;
	left: 0
}

#home .r2 .inner .mid .set .rightMk {
	width: 6rem;
	height: 100%;
	background: linear-gradient(90deg, rgba(239, 239, 239, 0) 0%, #efefef 100%);
	position: absolute;
	bottom: 0;
	right: 0
}

#home .r3 {
	padding-bottom: 1.2rem
}

#home .r3 .inner {
	padding-top: .5rem
}

#home .r3 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .7rem
}

#home .r3 .inner .top>p {
	width: 75%;
	padding-right: 24%
}

#home .r3 .inner>.mid {
	padding: 0 .4rem
}

@media screen and (orientation:landscape) {
	#home .r3 .inner>.mid .right .map {
		max-width: 100vw
	}
}

#home .r3 .inner>.mid h3 {
	line-height: 1.1
}

#home .r3 .inner>.mid h3 .letter {
	display: block
}

#home .r4 {
	background-color: #fff;
	padding-bottom: 1.2rem;
	position: relative;
	overflow: hidden
}

#home .r4 .bg .pic {
	opacity: 0;
	transition: transform 1.5s cubic-bezier(.38, 0, 0, 1), opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#home .r4 .bg .pic.on {
	opacity: 1
}

#home .r4 .inner {
	padding-top: 1rem
}

#home .r4 .inner .top {
	z-index: 11;
	-ms-flex-align: start;
	align-items: flex-start;
	position: relative
}

#home .r4 .inner .top .col {
	width: 75%
}

#home .r4 .inner .top .col h3 {
	line-height: 1.2
}

#home .r4 .inner .top .col h3 .letter {
	display: block
}

#home .r4 .inner .clear {
	height: 4rem;
	z-index: 10;
	width: 100%;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#home .r4 .inner .clear .img {
	height: 4.7rem;
	z-index: 5;
	opacity: 0;
	transition: transform 2s cubic-bezier(.38, 0, 0, 1) .8s, opacity 2s cubic-bezier(.38, 0, 0, 1) .8s;
	position: absolute;
	bottom: -.4rem;
	right: 18%;
	transform: translate(-25%)
}

#home .r4 .inner .clear .img.go {
	opacity: 1;
	transform: translate(0, 0)
}

#home .r4 .inner .clear .signBox {
	z-index: 3;
	position: absolute;
	top: -1rem;
	right: -.5rem
}

#home .r4 .inner .clear .signBox .mk {
	width: 200%;
	height: 100%;
	z-index: 4;
	background: #fff;
	transition: transform 4s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(-50%)
}

#home .r4 .inner .clear .signBox .mk.go {
	transform: translate(50%)
}

#home .r4 .inner .clear .signBox .sign {
	width: 9.2rem;
	z-index: 3;
	opacity: 0;
	transition: transform 2s cubic-bezier(.38, 0, 0, 1), opacity 1s cubic-bezier(.38, 0, 0, 1);
	display: block;
	position: relative;
	transform: translate(-20%)
}

#home .r4 .inner .clear .signBox .sign.go {
	opacity: 1;
	transform: translate(0)
}

#home .r4 .inner .mid {
	width: 100%;
	z-index: 10;
	grid-template-columns: repeat(3, 1fr);
	gap: .2rem;
	display: grid;
	position: relative
}

#home .r4 .inner .mid .list {
	height: 2rem;
	cursor: pointer;
	padding: 0 .6rem;
	position: relative
}

#home .r4 .inner .mid .list .mk {
	-webkit-backdrop-filter: blur(.1rem);
	-webkit-backdrop-filter: blur(.1rem);
	backdrop-filter: blur(.1rem);
	background-color: rgba(245, 245, 245, .9);
	border-radius: .16rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1)
}

#home .r4 .inner .mid .list .txt {
	z-index: 10;
	position: relative
}

#home .r4 .inner .mid .list .layer-icon {
	width: .8rem;
	height: .8rem;
	z-index: 10;
	background-color: #fff;
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1);
	position: relative;
	transform: scale(.75)
}

#home .r4 .inner .mid .list .layer-icon .icon-1 {
	opacity: 1;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1)
}

#home .r4 .inner .mid .list .layer-icon .icon-2 {
	height: 100%;
	text-align: center;
	width: 100%;
	opacity: 0;
	line-height: .8rem;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	transform: scale(0)
}

@media screen and (orientation:landscape) {
	#home .r4 .inner .mid .list:hover .mk {
		background-color: #fff
	}

	#home .r4 .inner .mid .list:hover .layer-icon {
		background-color: #e27402;
		transform: scale(1)
	}

	#home .r4 .inner .mid .list:hover .layer-icon .icon-1 {
		opacity: 0;
		transform: scale(.5)
	}

	#home .r4 .inner .mid .list:hover .layer-icon .icon-2 {
		opacity: 1;
		transform: scale(1)
	}
}

@media screen and (orientation:portrait) {
	#home .r4 .inner .mid .list .layer-icon {
		background-color: #e27402;
		transform: scale(1)
	}

	#home .r4 .inner .mid .list .layer-icon .icon-1 {
		opacity: 0;
		transform: scale(.5)
	}

	#home .r4 .inner .mid .list .layer-icon .icon-2 {
		opacity: 1;
		transform: scale(1)
	}
}

#home .r4 .inner.white .top .bc,
#home .r4 .inner.white .top .gray {
	color: #fff
}

#home .r4 .inner.white .clear {
	opacity: 0
}

#home .r5 {
	position: relative;
	overflow: hidden
}

#home .r5 .bg>.sign {
	width: 20rem;
	position: absolute;
	top: 3.5rem;
	left: -11rem
}

#home .r5 .inner {
	z-index: 10;
	padding-top: 1.2rem;
	padding-bottom: 1.2rem;
	position: relative
}

#home .r5 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .9rem
}

#home .r5 .inner .top .col {
	width: 75%
}

#home .r5 .inner .top .col .tab {
	width: 1.8rem;
	height: .6rem;
	text-align: center;
	border: 1px solid rgba(41, 46, 46, .3);
	border-radius: 1rem;
	margin-right: .2rem;
	line-height: .6rem;
	position: relative;
	overflow: hidden
}

#home .r5 .inner .top .col .tab:after {
	content: "";
	width: 100%;
	height: 100%;
	background-color: #232626;
	border-radius: 1rem;
	transition: transform .8s cubic-bezier(.38, 0, 0, 1), background-color .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(-100%)
}

#home .r5 .inner .top .col .tab>span {
	z-index: 10;
	transition: color .3s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#home .r5 .inner .top .col .tab:hover:after,
#home .r5 .inner .top .col .tab.on:after {
	transform: translate(0, 0)
}

#home .r5 .inner .top .col .tab:hover>span,
#home .r5 .inner .top .col .tab.on>span {
	color: #fff
}

#home .r5 .inner .mid {
	position: relative;
	overflow: hidden
}

#home .r5 .inner .mid .r5Sw {
	opacity: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	padding-top: .6rem;
	padding-bottom: 1.5rem;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform 1s cubic-bezier(.38, 0, 0, 1);
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	transform: translateY(15%)
}

#home .r5 .inner .mid .r5Sw:nth-of-type(1) {
	position: relative
}

#home .r5 .inner .mid .r5Sw.on {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0)
}

#home .r5 .inner .mid .r5Sw .swiper-wrapper {
/* 	grid-auto-flow: column;
	display: grid */
}

#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide {
	display: inline-block;
	width: 30%;
	background-color: #f7f7f7;
	border-radius: .12rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden;
	margin: 0 10px;
}

#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide .msg {
	padding: .5rem
}

#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide .msg small {
	margin-bottom: .3rem;
	display: block
}

#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide .photo {
	height: 2.7rem;
	width: 100%;
	position: relative;
	overflow: hidden
}

#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide .photo .pic {
/* 	filter: grayscale(); */
	opacity: 1;
/* 	transition: all .5s cubic-bezier(.38, 0, 0, 1); */
	/* transform: translateY(50%) */
}

@media screen and (orientation:landscape) {

	#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide.swiper-slide-next,
	#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide.swiper-slide-duplicate-next {
		box-shadow: 0 .4rem .8rem rgba(35, 38, 38, .3)
	}

	#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide.swiper-slide-next .photo .pic,
	#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide.swiper-slide-duplicate-next .photo .pic {
		filter: grayscale(0%);
		opacity: 1;
		transform: translate(0, 0)
	}
}

@media screen and (orientation:portrait) {

	#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide.swiper-slide-active,
	#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active {
		box-shadow: 0 .4rem .8rem rgba(35, 38, 38, .3)
	}

	#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide.swiper-slide-active .photo .pic,
	#home .r5 .inner .mid .r5Sw .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .photo .pic {
		filter: grayscale(0%);
		opacity: 1;
		transform: translate(0, 0)
	}
}

#home .r5 .inner .mid .r5Sw .swiper-button-prev {
	cursor: pointer;
	position: absolute;
	bottom: 0;
	left: 25%
}

#home .r5 .inner .mid .r5Sw .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	background-color: #fff;
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#home .r5 .inner .mid .r5Sw .swiper-button-prev:hover .layer-icon {
	background-color: #e27402
}

#home .r5 .inner .mid .r5Sw .swiper-button-next {
	cursor: pointer;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: 0;
	left: calc(25% + 1.1rem)
}

#home .r5 .inner .mid .r5Sw .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	background-color: #fff;
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#home .r5 .inner .mid .r5Sw .swiper-button-next:hover .layer-icon {
	background-color: #e27402
}

#home .r5 .inner .mid .r5Sw .swiper-pagination {
	position: absolute;
	top: 0;
	right: 0
}

#home .r5 .inner .mid .r5Sw .swiper-pagination .swiper-pagination-current,
#home .r5 .inner .mid .r5Sw .swiper-pagination .swiper-pagination-total {
	color: #232626
}

#home .r5 .inner .mid .moreBox {
	height: .9rem;
	z-index: 10;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex;
	position: absolute;
	bottom: 0;
	right: 0
}

#home .r5 .inner .mid .moreBox .line {
	width: 50vw;
	height: 1px;
	border-top: 1px dashed #292e2e;
	margin-right: .18rem
}

#home .r5 .part {
	z-index: 10;
	padding-bottom: 1rem;
	position: relative
}

#home .r5 .part .box {
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	height: 4rem;
	background-color: rgba(0, 0, 0, .85);
	border-radius: .32rem;
	padding: 0 1.3rem
}

#home .r5 .part .box .col {
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	margin-right: .8rem;
	display: -ms-flexbox;
	display: flex
}

#home .r5 .part .box .col h2 {
	line-height: 1
}

#home .r5 .part .box .col h2 .letter {
	display: block
}

#home .r5 .part .box .col .layer-icon {
	height: .8em;
	margin-left: .2rem
}

#home .r5 .part .box .col .layer-icon .img {
	height: .32rem
}

#home .r5 .part .box .items {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	display: -ms-flexbox;
	display: flex
}

#home .r5 .part .box .items>li {
	width: 3.4rem;
	padding: .2rem 0
}

#home .r5 .part .box .items>li .iconfont {
	margin-right: .2rem
}

#home .r5 .btm {
	height: 1.5rem;
	z-index: 10;
	background-color: #fff;
	position: relative
}

#home .r5 .btm .putIn .inRow {
	width: 6.2rem;
	height: .6rem;
	text-align: left;
	background-color: #f2f2f2;
	border: none;
	border-radius: 1rem;
	margin-right: .1rem
}

#home .r5 .btm .putIn .sub .iconfont {
	transform: none !important
}

#roofSolution .banner {
	position: relative;
	overflow: hidden
}

#roofSolution .banner>.bg .pro {
	width: 106%;
	height: 100%;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 100%;
	position: absolute;
	bottom: -15%;
	left: -3%
}

#roofSolution .banner>.bg .shadow {
	z-index: 8;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 100%
}

#roofSolution .banner .inner {
	height: 12.8rem;
	width: 72%;
	-ms-flex-direction: column;
	flex-direction: column;
	margin: 0 auto;
	padding: 2rem 0 1.2rem
}

#roofSolution .banner .inner .topic h1 {
	margin-bottom: .4rem;
	line-height: .9
}

#roofSolution .banner .inner .group {
	grid-template-columns: repeat(2, 5.2rem);
	gap: 0 .8rem;
	display: grid
}

#roofSolution .banner .inner .group .col {
	padding: 0 2% 0 .6rem;
	position: relative
}

#roofSolution .banner .inner .group .col .icon {
	height: .4rem;
	z-index: 10;
	display: block;
	position: absolute;
	top: 0;
	left: 0
}

#roofSolution .banner .inner .group .col h2 {
	line-height: .4rem
}

#roofSolution .banner .inner .group .col p {
	color: rgba(255, 255, 255, .6)
}

#roofSolution .banner_Snapfit {
	position: relative;
	overflow: hidden
}

#roofSolution .banner_Snapfit>.bg .pro {
	width: 106%;
	height: 100%;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 100%;
	position: absolute;
	bottom: -15%;
	left: -3%
}

#roofSolution .banner_Snapfit>.bg .shadow {
	z-index: 8;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 100%
}

#roofSolution .banner_Snapfit>.bg .shadow:after {
	content: "";
	background: linear-gradient(rgba(23, 24, 26, 0) 60%, #17181a 100%)
}

#roofSolution .banner_Snapfit .inner {
	height: 12.8rem;
	-ms-flex-direction: column;
	flex-direction: column;
	padding: 2.8rem 0 1.6rem
}

#roofSolution .banner_Snapfit .inner .topic {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

#roofSolution .banner_Snapfit .inner .topic h1 {
	line-height: .9
}

#roofSolution .banner_Snapfit .inner .topic>.img {
	height: 1.15rem;
	margin: 0 auto .1rem;
	display: block
}

#roofSolution .banner_Snapfit .inner .topic p {
	color: #fff
}

#roofSolution .banner_Snapfit .inner .group {
	grid-template-columns: repeat(2, 5.2rem);
	gap: 0 1.5rem;
	display: grid
}

#roofSolution .banner_Snapfit .inner .group .col {
	padding: 0 2% 0 0;
	position: relative
}

#roofSolution .banner_Snapfit .inner .group .col .icon {
	height: .4rem;
	z-index: 10;
	margin-right: .4rem;
	display: block
}

#roofSolution .banner_Snapfit .inner .group .col h2 {
	margin-bottom: 0;
	line-height: 1.5
}

#roofSolution .banner_Snapfit .inner .group .col p {
	color: rgba(255, 255, 255, .6)
}

#roofSolution .banner_Snapfit .inner .group .col>.note {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	display: -ms-flexbox;
	display: flex
}

#roofSolution .banner_Snapfit .inner .group .col>.note .set {
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	display: -ms-flexbox;
	display: flex
}

#roofSolution .banner_Snapfit .inner .group .col>.note .set .upIcon {
	width: .3rem;
	opacity: 0;
	transform-origin: 50% 100%;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	transform: scale(.6)
}

#roofSolution .banner_Snapfit .inner .group .col>.note .set .upIcon path {
	fill: #fff
}

#roofSolution .banner_Snapfit .inner .group .col>.note .set .upIcon.go {
	opacity: 1;
	transform: rotate(-25deg)translate(.1rem, -.1rem)scale(1)
}

#roofSolution .banner_Snapfit .inner .group .col>.note .set em {
	line-height: 1
}

#roofSolution .banner_Snapfit .inner .group .col>.note .set sub {
	vertical-align: baseline
}

#roofSolution .banner_Snapfit .inner .btm {
	width: 100%;
	padding: .8rem 0 0;
	position: absolute;
	bottom: 0;
	left: 0
}

#roofSolution .r1 {
	width: 100%;
	height: 250vh
}

#roofSolution .r1 .inner {
	padding: 1.5rem 1.8rem 1rem;
	overflow: hidden;
	position: sticky !important
}

#roofSolution .r1 .inner .clip {
	background-color: #000;
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 1.5rem 1.8rem 1.2rem
}

#roofSolution .r1 .inner .clip h2 {
	background: linear-gradient(156deg, #fff 40%, #404040 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	-webkit-background-clip: text;
	-webkit-background-clip: text;
	background-clip: text;
	line-height: .9;
	display: inline-block
}

#roofSolution .r1 .inner .clip .svgIcon {
	width: 100vw;
	z-index: 2;
	pointer-events: none
}

#roofSolution .r1 .inner .clip .svgIcon .cls-w {
	fill: #000
}

#roofSolution .r1 .inner .clip .svgIcon .cls-b {
	fill: #fff;
	transform: scale(var(--scale));
	transform-origin: 50% 35% !important
}

#roofSolution .r1 .inner .group {
	width: 100%;
	height: 100%;
	z-index: 5;
	padding-top: 8vw;
	position: relative
}

#roofSolution .r1 .inner .group h3 {
	width: 40%;
	position: absolute;
	bottom: 0;
	left: 0
}

#roofSolution .r1 .inner .group h3 b {
	color: #e27402;
	display: block
}

#roofSolution .r1 .inner .group p {
	width: 50%;
	margin-left: 50%
}

#roofSolution .r1 .inner .group .box {
	width: 100%;
	position: absolute;
	bottom: -3vw;
	left: 0
}

#roofSolution .r1 .inner .group .box h4 {
	padding: .3rem;
	line-height: 1
}

#roofSolution .r1 .inner .group .box .items {
	grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
	gap: 0 .2rem;
	display: grid
}

#roofSolution .r1 .inner .group .box .items>li {
	grid-template-rows: .6rem 3fr;
	gap: .1rem 0;
	display: grid
}

#roofSolution .r1 .inner .group .box .items>li:first-of-type {
	grid-template-rows: repeat(4, .6rem)
}

#roofSolution .r1 .inner .group .box .items>li:first-of-type .chunk {
	text-align: left
}

#roofSolution .r1 .inner .group .box .items>li:last-of-type .chunk {
	-webkit-backdrop-filter: none;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	color: #232626;
	background: linear-gradient(90deg, #ffeb00, #e27402)
}

#roofSolution .r1 .inner .group .box .items>li:last-of-type .part {
	-webkit-backdrop-filter: none;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	background-color: #000
}

#roofSolution .r1 .inner .group .box .items>li:last-of-type .part>small {
	color: #e27402
}

#roofSolution .r1 .inner .group .box .items>li .chunk {
	height: .6rem;
	text-align: center;
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	background-color: rgba(0, 0, 0, .2);
	border-radius: .12rem;
	padding: 0 .32rem;
	line-height: .6rem
}

#roofSolution .r1 .inner .group .box .items>li .part {
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	background-color: rgba(0, 0, 0, .2);
	border-radius: .12rem;
	grid-template-rows: repeat(3, 1fr);
	gap: .1rem 0;
	display: grid
}

#roofSolution .r1 .inner .group .box .items>li .part>small {
	text-align: center
}

#roofSolution .r2 {
	background-color: #efefef;
	padding-top: 2.2rem;
	padding-bottom: 2rem
}

#roofSolution .r2 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: 1.5rem
}

#roofSolution .r2 .inner .top .topic {
	width: 50%
}

#roofSolution .r2 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#roofSolution .r2 .inner .mid {
	position: relative
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide {
	height: 5.6rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .6rem 0;
	transition: box-shadow .6s cubic-bezier(.38, 0, 0, 1), background-color .6s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide h3 {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide>img {
	width: 90%;
	margin: 0 auto;
	transition: transform .6s cubic-bezier(.38, 0, 0, 1)
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
	width: .5rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover h3 {
		color: #e27402
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover>img {
		transform: scale(1.2)
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon {
		width: 1.2rem
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .mask:after {
		opacity: 1
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

@media screen and (orientation:portrait) {
	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
		width: 2.2rem
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .txt {
		opacity: 1;
		line-height: .8rem;
		transform: translate(-.25rem)
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask {
		height: .8rem
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after {
		opacity: 1
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon {
		height: .8rem;
		transform: translate(.4rem)rotate(45deg)
	}

	#roofSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon i {
		font-size: 12px
	}
}

#roofSolution .r2 .inner .mid .swiper .swiper-button-prev {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(-90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: end;
	justify-content: flex-end;
	position: absolute;
	bottom: 0;
	right: calc(100% - .45rem)
}

#roofSolution .r2 .inner .mid .swiper .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#roofSolution .r2 .inner .mid .swiper .swiper-button-prev .layer-icon:hover {
	background-color: #000
}

#roofSolution .r2 .inner .mid .swiper .swiper-button-next {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: start;
	justify-content: flex-start;
	position: absolute;
	bottom: 0;
	left: calc(100% - .45rem)
}

#roofSolution .r2 .inner .mid .swiper .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#roofSolution .r2 .inner .mid .swiper .swiper-button-next .layer-icon:hover {
	background-color: #000
}

#roofSolution .r2 .inner .line {
	width: 100%;
	height: 1px;
	border-top: 1px dashed rgba(41, 46, 46, .3);
	margin: .5rem 0
}

#roofSolution .r2 .inner .btm {
	height: 2.4rem;
	background-color: #fff;
	border-radius: .18rem;
	overflow: hidden
}

#roofSolution .r2 .inner .btm>.pic {
	width: 50%;
	height: 100%;
	object-fit: cover;
	background-position: top;
	display: block
}

#roofSolution .r2 .inner .btm .col {
	width: 50%;
	height: 100%;
	position: relative
}

#roofSolution .r2 .inner .btm .col>.mask {
	height: 100%;
	width: 100%;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 25%);
	position: absolute;
	top: 0;
	left: -2rem
}

#roofSolution .r3 {
	padding-top: 1rem;
	padding-bottom: 1.2rem
}

#roofSolution .r3 .bg {
	overflow: hidden
}

#roofSolution .r3 .bg>.mask {
	-webkit-backdrop-filter: blur(.2rem);
	-webkit-backdrop-filter: blur(.2rem);
	backdrop-filter: blur(.2rem);
	z-index: 10;
	background-color: rgba(0, 0, 0, .5)
}

#roofSolution .r3 .inner .imgLogo {
	height: .64rem;
	margin: 0 auto;
	display: block
}

#roofSolution .r3 .inner .title {
	padding-right: 50%;
	position: relative
}

#roofSolution .r3 .inner .title .layer-btn {
	margin: auto 0;
	position: absolute;
	top: .4rem;
	bottom: 0;
	right: 0
}

#roofSolution .r3 .inner>.note {
	-ms-flex-align: end;
	align-items: flex-end;
	margin-top: .4rem;
	margin-bottom: .2rem
}

#roofSolution .r3 .inner>.note .set {
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	display: -ms-flexbox;
	display: flex
}

#roofSolution .r3 .inner>.note .set .upIcon {
	width: .3rem;
	opacity: 0;
	transform-origin: 50% 100%;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	transform: scale(.6)
}

#roofSolution .r3 .inner>.note .set .upIcon path {
	fill: #e27402
}

#roofSolution .r3 .inner>.note .set .upIcon.go {
	opacity: 1;
	transform: rotate(-25deg)translate(.1rem, -.1rem)scale(1)
}

#roofSolution .r3 .inner>.note .set em {
	line-height: 1
}

#roofSolution .r3 .inner>.note .set sub {
	vertical-align: baseline
}

#roofSolution .r3 .inner .group {
	grid-template-columns: repeat(2, 1fr);
	gap: 0 .4rem;
	margin-bottom: .3rem;
	display: grid
}

#roofSolution .r3 .inner .group .pic {
	height: 3.6rem;
	border-radius: .18rem;
	overflow: hidden
}

#roofSolution .r3 .inner .group .pic video {
	object-fit: cover
}

#roofSolution .r3 .inner .group .pic .MediaTs {
	width: 100%;
	height: 100%;
	display: block
}

#roofSolution .r4 {
	background-color: #efefef;
	padding-top: 1.6rem;
	padding-bottom: 1.7rem
}

#roofSolution .r4 .inner {
	margin-bottom: 1.5rem
}

#roofSolution .r4 .inner .mid {
	z-index: 4;
	position: relative
}

#roofSolution .r4 .inner .mid>p {
	width: 48%;
	padding-bottom: .8rem;
	line-height: 1.33
}

#roofSolution .r4 .inner .mid .imgBox {
	position: relative
}

#roofSolution .r4 .inner .mid .imgBox .img {
	height: 7.8rem;
	display: block
}

#roofSolution .r4 .inner .mid .imgBox .years {
	position: absolute;
	bottom: 27%;
	right: -8%
}

#roofSolution .r4 .inner .mid .imgBox .years>em {
	letter-spacing: -.2em;
	text-indent: -.92em;
	font-size: 4.6rem;
	line-height: .8;
	display: inline-block
}

#roofSolution .r4 .inner .mid .imgBox .years sub {
	vertical-align: baseline
}

#roofSolution .r4 .inner .btm {
	z-index: 2;
	margin-top: -1.2rem;
	position: relative
}

#roofSolution .r4 .inner .btm .note {
	margin-bottom: .6rem
}

#roofSolution .r4 .inner .btm .note .txt {
	padding-right: .2rem
}

#roofSolution .r4 .inner .btm .note .line {
	height: 1px;
	background-color: rgba(26, 26, 26, .3);
	-ms-flex: 1;
	flex: 1
}

#roofSolution .r4 .inner .btm .logoSw {
	width: 100%;
	grid-auto-flow: column;
	padding: .2rem 0;
	display: grid
}

#roofSolution .r4 .inner .btm .logoSw .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#roofSolution .r4 .inner .btm .logoSw .swiper-wrapper .swiper-slide {
	padding-right: 1rem
}

#roofSolution .r4 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo {
	height: .88rem
}

#roofSolution .r4 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo>img {
	max-height: .88rem;
	opacity: .2;
	display: block
}

#roofSolution .r4 .part .top {
	margin-bottom: .9rem
}

#roofSolution .r4 .part .mid {
	width: 100%
}

#roofSolution .r4 .part .mid .box {
	width: 100%;
	height: 6.8rem;
	background-color: #fff;
	border-radius: .3rem;
	margin-bottom: .6rem;
	overflow: hidden
}

#roofSolution .r4 .part .mid .box .left {
	width: 50%;
	height: 100%;
	z-index: 10;
	position: relative
}

#roofSolution .r4 .part .mid .box .left .pic {
	opacity: .6;
	background-position: 15%
}

#roofSolution .r4 .part .mid .box .left .layer-play {
	width: 1.2rem;
	height: 1.2rem;
	cursor: pointer;
	z-index: 5;
	background-color: rgba(28, 31, 31, .6);
	border-radius: 50%;
	-ms-flex-direction: column;
	flex-direction: column;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#roofSolution .r4 .part .mid .box .left .layer-play p {
	margin-top: .1rem
}

#roofSolution .r4 .part .mid .box .left .layer-play:hover {
	background-color: #232626
}

#roofSolution .r4 .part .mid .box .right {
	width: 50%;
	height: 100%;
	z-index: 11;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: 0 1rem 0 3%;
	position: relative
}

#roofSolution .r4 .part .mid .box .right>.mask {
	height: 100%;
	width: 100%;
	pointer-events: none;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 26%);
	position: absolute;
	top: 0;
	left: -2rem
}

#roofSolution .r4 .part .mid .box .right>.sign {
	z-index: 5;
	height: .96rem;
	margin-bottom: .3rem;
	position: relative
}

#roofSolution .r4 .part .mid .box .right h3 {
	z-index: 5;
	position: relative
}

#roofSolution .r4 .part .mid .box .right p {
	z-index: 5;
	margin-bottom: .5rem;
	position: relative
}

#roofSolution .r4 .part .mid .box .right .items {
	z-index: 5;
	-ms-flex-align: start;
	align-items: flex-start;
	position: relative
}

#roofSolution .r4 .part .mid .box .right .items>li {
	opacity: 0;
	transform-origin: 0;
	transition: opacity 1s cubic-bezier(.38, 0, 0, 1), transform 1s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden;
	transform: translate(60%)
}

#roofSolution .r4 .part .mid .box .right .items>li>img {
	height: .52rem;
	margin: 0 auto .2rem;
	display: block
}

#roofSolution .r4 .part .mid .box .right .items>li.layer-icon {
	height: 100%;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-right: .05rem;
	padding: 0 .25rem 0 .3rem;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	overflow: hidden
}

#roofSolution .r4 .part .mid .box .right .items>li.layer-icon>i {
	line-height: .52rem
}

#roofSolution .r4 .part .mid .box .right .items>li.layer-icon .lines {
	width: 4.7rem;
	display: block;
	position: absolute;
	bottom: .5em;
	left: .05rem
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(1) {
	transition-delay: 50ms
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(2) {
	transition-delay: .1s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(3) {
	transition-delay: .15s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(4) {
	transition-delay: .2s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(5) {
	transition-delay: .25s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(6) {
	transition-delay: .3s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(7) {
	transition-delay: .35s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(8) {
	transition-delay: .4s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(9) {
	transition-delay: .45s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(10) {
	transition-delay: .5s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(11) {
	transition-delay: .55s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(12) {
	transition-delay: .6s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(13) {
	transition-delay: .65s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(14) {
	transition-delay: .7s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(15) {
	transition-delay: .75s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(16) {
	transition-delay: .8s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(17) {
	transition-delay: .85s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(18) {
	transition-delay: .9s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(19) {
	transition-delay: .95s
}

#roofSolution .r4 .part .mid .box .right .items>li:nth-child(20) {
	transition-delay: 1s
}

#roofSolution .r4 .part .mid .box .right .items.go>li {
	opacity: 1;
	transform: translate(0)
}

#roofSolution .r4 .part .mid .box:first-of-type .right {
	padding-bottom: 6%
}

#roofSolution .r5 {
	height: 100vh;
	overflow: hidden
}

#roofSolution .r5 .bg .pic:after {
	content: "";
	background-color: rgba(0, 0, 0, .3)
}

#roofSolution .r5 .inner {
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start
}

#roofSolution .r5 .inner h2 {
	line-height: 1.2
}

#roofSolution .r5 .inner .group {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-top: 1.15rem
}

#roofSolution .r5 .inner .group .layer-btn {
	margin-bottom: .5rem
}

#roofSolution .r5 .inner .group .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#roofSolution .r5 .inner .group .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

#roofSolution .r5 .inner .group .layer-btn:hover .txt {
	transform: translate(-.15rem)
}

#roofSolution .r5 .inner .group .layer-btn:hover .iconfont {
	opacity: 1;
	transform: translate(.03rem)rotate(45deg)
}

#roofSolution .r5 .inner .group .items>li>em {
	margin-right: .1rem;
	font-size: .32rem
}

#roofSolution .r6 {
	background-color: #efefef;
	padding: 1.7rem 0
}

#roofSolution .r6 .inner {
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

#roofSolution .r7 {
	padding: 1.2rem 0 1.5rem;
	overflow: hidden
}

#roofSolution .r7 .bg .pic:after {
	content: "";
	background-color: rgba(0, 0, 0, .5)
}

#roofSolution .r7 .inner h2 {
	line-height: 1
}

#roofSolution .r7 .inner .col {
	width: 50%;
	margin-top: 1.8rem;
	margin-left: 50%
}

#roofSolution .r7 .inner .col>img {
	height: .72rem;
	margin-bottom: .5rem;
	display: block
}

#roofSolution .r8 {
	background-color: #efefef;
	padding: 1.2rem 0;
	overflow: hidden
}

#roofSolution .r8 .bg .sign {
	width: 14rem;
	position: absolute;
	top: -2.2rem;
	right: -3.6rem
}

#roofSolution .r8 .inner {
	grid-template-columns: 4fr 6fr;
	gap: 0 .2rem;
	display: grid
}

#roofSolution .r8 .inner .left {
	background-color: rgba(0, 0, 0, .9);
	border-radius: .28rem;
	-ms-flex-direction: column;
	flex-direction: column;
	padding: .7rem 0;
	overflow: hidden
}

#roofSolution .r8 .inner .left h2 {
	text-align: center;
	line-height: 1
}

#roofSolution .r8 .inner .left h2 .letter {
	color: #e27402
}

#roofSolution .r8 .inner .left .clear {
	height: 4.75rem;
	width: 100%;
	position: relative
}

#roofSolution .r8 .inner .left .clear .people {
	height: 5.56rem;
	margin: 0 auto;
	position: absolute;
	top: -.1rem;
	left: 0;
	right: 0
}

#roofSolution .r8 .inner .left .people {
	height: 8rem;
	margin: -.2rem auto 0;
	display: block
}

#roofSolution .r8 .inner .right {
	-webkit-backdrop-filter: blur(.4rem);
	-webkit-backdrop-filter: blur(.4rem);
	backdrop-filter: blur(.4rem);
	background-color: rgba(255, 255, 255, .9);
	border-radius: .28rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .7rem 0;
	display: -ms-flexbox;
	display: flex
}

#roofSolution .r8 .inner .right h2 {
	text-align: center;
	margin-bottom: .48rem;
	line-height: 1
}

#roofSolution .r8 .inner .right .form {
	background-color: #fff;
	border-radius: .18rem;
	margin: 0 auto;
	display: block;
	position: relative
}

#roofSolution .r8 .inner .right .form .loadMk {
	z-index: 50;
	opacity: 0;
	pointer-events: none;
	background-color: rgba(255, 255, 255, .8);
	border-radius: .18rem;
	transition: opacity .3s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden
}

#roofSolution .r8 .inner .right .form .loadMk .loader {
	width: 1rem
}

#roofSolution .r8 .inner .right .form .loadMk.active {
	opacity: 1
}

#roofSolution .r8 .inner .right .form .inRow {
	z-index: 5;
	grid-template-columns: 1fr;
	-ms-flex-pack: center;
	justify-content: center;
	gap: 0 .1rem;
	margin-bottom: .1rem;
	display: grid;
	position: relative
}

#roofSolution .r8 .inner .right .form .inRow>.note {
	text-align: center;
	color: #1c1f1f;
	width: 100%
}

#roofSolution .r8 .inner .right .form .inRow>.note small {
	vertical-align: middle;
	line-height: 1
}

#roofSolution .r8 .inner .right .form .inRow.half {
	grid-template-columns: 3rem 3rem
}

#roofSolution .r8 .inner .right .form .inRow>.part {
	background-color: #efefef;
	border-radius: .1rem;
	position: relative
}

#roofSolution .r8 .inner .right .form .inRow>.part textarea {
	text-indent: 0;
	width: 100%;
	background-color: transparent;
	border: none;
	padding: .2rem;
	display: block
}

#roofSolution .r8 .inner .right .form .inRow>.part textarea::-ms-input-placeholder {
	color: rgba(28, 31, 31, .7)
}

#roofSolution .r8 .inner .right .form .inRow>.part textarea::placeholder {
	color: rgba(28, 31, 31, .7)
}

#roofSolution .r8 .inner .right .form .inRow>.part>sup {
	color: gray;
	z-index: 2;
	position: absolute;
	top: .18em;
	left: .1rem
}

#roofSolution .r8 .inner .right .form .inRow>.part>.inTxt {
	height: .5rem;
	width: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none;
	padding: 0 .2rem;
	display: block
}

#roofSolution .r8 .inner .right .form .inRow>.part>.inTxt::-ms-input-placeholder {
	color: rgba(28, 31, 31, .7)
}

#roofSolution .r8 .inner .right .form .inRow>.part>.inTxt::placeholder {
	color: rgba(28, 31, 31, .7)
}

#roofSolution .r8 .inner .right .form .inRow>.part .inDown {
	width: 100%;
	position: relative
}

#roofSolution .r8 .inner .right .form .inRow>.part .inDown .input-text {
	height: .5rem;
	width: 100%;
	text-indent: 0;
	cursor: pointer;
	background-color: #efefef;
	border: none;
	border-radius: .1rem;
	padding: 0 .24rem 0 .2rem;
	position: relative
}

#roofSolution .r8 .inner .right .form .inRow>.part .inDown .input-text input[type=text] {
	height: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none
}

#roofSolution .r8 .inner .right .form .inRow>.part .inDown .input-text .arrow {
	width: 0;
	height: 0;
	transform-origin: 0 20%;
	z-index: 10;
	border: 5px solid transparent;
	border-top-color: #1c1f1f;
	margin: auto 0;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 5px;
	bottom: 0;
	right: .2rem
}

#roofSolution .r8 .inner .right .form .inRow>.part .inDown .childDown {
	width: 100%;
	max-height: 2.2rem;
	background-color: #efefef;
	border-bottom-right-radius: .18rem;
	border-bottom-left-radius: .18rem;
	padding: .1rem .2rem;
	display: none;
	position: absolute;
	top: calc(100% - .1rem);
	left: 0;
	overflow: auto
}

#roofSolution .r8 .inner .right .form .inRow>.part .inDown .childDown>li {
	width: 100%
}

#roofSolution .r8 .inner .right .form .inRow>.part .inDown .childDown>li>a {
	width: 100%;
	line-height: .4rem;
	display: block
}

#roofSolution .r8 .inner .right .form .inRow>.part .inDown .childDown>li:hover>a {
	color: #e27402
}

#roofSolution .r8 .inner .right .form .inRow:nth-of-type(4) {
	z-index: 6
}

#roofSolution .r8 .inner .right .form>.btm {
	width: 100%;
	margin-top: .3rem
}

#roofSolution .r8 .inner .right .form>.btm .layer-btn {
	padding: 0 .55rem
}

#roofSolution .r9 {
	background-color: #17181a;
	padding: 1.8rem 0
}

#roofSolution .r9 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .7rem
}

#roofSolution .r9 .inner .top .topic {
	width: 50%
}

#roofSolution .r9 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#roofSolution .r9 .inner .top>p small {
	color: #e27402;
	vertical-align: sub;
	padding: 0 .2em;
	line-height: .5em
}

#roofSolution .r9 .inner .mid {
	grid-template-rows: repeat(2, 3.2rem);
	grid-template-columns: repeat(2, 1fr);
	gap: .2rem;
	display: grid
}

#roofSolution .r9 .inner .mid .part {
	border: 1px solid #4d4d4d;
	border-radius: .16rem;
	position: relative;
	overflow: hidden
}

#roofSolution .r9 .inner .mid .part video {
	object-fit: cover
}

#roofSolution .r9 .inner .mid .part .MediaTs {
	width: 100%;
	height: 100%;
	display: block
}

#roofSolution .r10 {
	background-color: #17181a;
	padding: 1.4rem 0 1.8rem
}

#roofSolution .r10 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .7rem
}

#roofSolution .r10 .inner .top .topic {
	width: 50%
}

#roofSolution .r10 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#roofSolution .r10 .inner .top>p small {
	color: #e27402;
	vertical-align: sub;
	padding: 0 .2em;
	line-height: .5em
}

#roofSolution .r10 .inner .mid .group {
	grid-template-columns: 58% 42%;
	padding-bottom: .4rem;
	display: grid
}

#roofSolution .r10 .inner .mid .group .left {
	position: relative
}

#roofSolution .r10 .inner .mid .group .left>.photo {
	width: 100%;
	height: 100%;
	opacity: 0;
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
	position: absolute;
	top: 0;
	left: 0
}

#roofSolution .r10 .inner .mid .group .left>.photo:nth-of-type(1) {
	opacity: 1;
	position: relative
}

#roofSolution .r10 .inner .mid .group .right {
	grid-template-rows: repeat(2, 2.1rem);
	-ms-flex-pack: center;
	justify-content: center;
	gap: .95rem 0;
	display: grid
}

#roofSolution .r10 .inner .mid .group .right .part {
	position: relative
}

#roofSolution .r10 .inner .mid .group .right .part .pic {
	width: 3rem;
	height: 2.1rem;
	border-radius: .18rem;
	display: block
}

#roofSolution .r10 .inner .mid .group .right .part .dot {
	width: 1.1rem;
	height: 1.1rem;
	background-color: #1a1a1a;
	border-radius: 50%;
	position: absolute;
	bottom: -.55rem;
	left: -.55rem
}

#roofSolution .r10 .inner .mid .group .right .part .dot .img {
	width: 80%;
	height: 80%;
	object-fit: contain;
	opacity: 0;
	display: block
}

#roofSolution .r10 .inner .mid .group .right .part .dot .img:nth-of-type(1) {
	opacity: 1
}

#roofSolution .r10 .inner .mid .group .right .part .dot .mk {
	height: 100%;
	pointer-events: none;
	position: absolute;
	bottom: 0;
	right: 0
}

#roofSolution .r10 .inner .mid .tab {
	grid-template-columns: repeat(var(--col), 1fr);
	background-color: #222426;
	border-radius: .2rem;
	grid-template-rows: 1.2rem;
	margin: .8rem 0;
	display: grid;
	position: relative
}

#roofSolution .r10 .inner .mid .tab .lists {
	z-index: 10;
	position: relative
}

#roofSolution .r10 .inner .mid .tab .lists>a {
	width: calc(100% - .3rem);
	height: calc(100% - .3rem);
	text-align: center;
	font-size: inherit;
	transition: all .5s cubic-bezier(.38, 0, 0, 1)
}

#roofSolution .r10 .inner .mid .tab .lists.on>a {
	color: #1a1a1a
}

#roofSolution .r10 .inner .mid .tab .mask {
	width: calc(100%/var(--col));
	height: 100%;
	position: absolute;
	top: 0;
	left: 0
}

#roofSolution .r10 .inner .mid .tab .mask:after {
	content: "";
	width: calc(100% - .3rem);
	height: calc(100% - .3rem);
	background-color: #fff;
	border-radius: .2rem
}

#roofSolution .r10 .inner .mid .btm {
	height: 2.4rem;
	background-color: #222426;
	border-radius: .18rem;
	overflow: hidden
}

#roofSolution .r10 .inner .mid .btm>.pic {
	width: 50%;
	height: 100%;
	object-fit: cover;
	background-position: top;
	display: block
}

#roofSolution .r10 .inner .mid .btm .col {
	width: 50%;
	height: 100%;
	position: relative
}

#roofSolution .r10 .inner .mid .btm .col>.mask {
	height: 100%;
	width: 100%;
	background: linear-gradient(90deg, rgba(34, 36, 38, 0) 0%, #222426 25%);
	position: absolute;
	top: 0;
	left: -2rem
}

#roofSolution .r11 {
	background-color: #efefef;
	padding-top: 1.6rem
}

#roofSolution .r11 .top {
	margin-bottom: .5rem
}

#roofSolution .r11 .inner {
	width: 100%;
	height: 480vh;
	margin-top: -1rem;
	position: relative
}

#roofSolution .r11 .inner .group .fn_r11 {
	width: 100%;
	z-index: 10;
	height: 100%;
	display: block;
	position: relative
}

#roofSolution .r11 .inner .group .fn_r11 .cvBox {
	height: calc(100% - 1rem);
	z-index: 6;
	top: 1rem
}

#roofSolution .r11 .inner .group .fn_r11 .cvBox .proCv {
	width: 100%;
	height: 100%;
	display: block;
	position: relative
}

#roofSolution .r11 .inner .group .part {
	z-index: 12;
	-ms-flex-align: start;
	align-items: flex-start
}

#roofSolution .r11 .inner .group .part:nth-child(2) {
	z-index: 3
}

#roofSolution .r11 .inner .group .part:last-of-type {
	-ms-flex-align: center;
	align-items: center
}

#roofSolution .r11 .inner .group .part:last-of-type .msg {
	padding-top: 0
}

#roofSolution .r11 .inner .group .part .msg {
	width: 50%;
	margin-left: 50%;
	padding-top: 2.2rem
}

#roofSolution .r11 .inner .group .part .msg .f-320 {
	letter-spacing: -.03em;
	text-indent: -.05em;
	font-size: 3.2rem;
	line-height: .8;
	display: block
}

#roofSolution .r11 .inner .group .part .msg h2 {
	margin-bottom: .12rem;
	line-height: 1;
	display: block
}

#roofSolution .r11 .inner .group .part .msg p {
	display: block
}

#roofSolution .r11 .inner .group .part .msg p b {
	font-weight: 100;
	line-height: 1
}

#roofSolution .r11 .inner .group .part .img {
	width: 9.5rem;
	height: 5.2rem;
	object-fit: contain;
	z-index: 13;
	margin: auto 0;
	position: absolute;
	top: 2rem;
	bottom: 0;
	right: 40%
}

#roofDetail {
	background-color: #ededed
}

#roofDetail .banner {
	height: 100vh;
	overflow: hidden
}

#roofDetail .banner .bg .pic:after {
	content: "";
	background-color: rgba(0, 0, 0, .4)
}

#roofDetail .banner .inner {
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	padding-top: 1.6rem
}

#roofDetail .banner .inner .top {
	width: 100%;
	margin-bottom: 1.6rem
}

#roofDetail .banner .inner .top h1 {
	line-height: 1.1
}

#roofDetail .banner .inner .top small {
	display: block
}

#roofDetail .banner .inner .group {
	width: 100%
}

#roofDetail .banner .inner .group p {
	width: 7.2rem
}

#roofDetail .r1 {
	padding: 1.2rem 0
}

#roofDetail .r1 .inner .mid {
	width: 100%
}

#roofDetail .r1 .inner .mid .tabItem {
	width: 100%;
	grid-template-columns: repeat(var(--col), 1fr);
	gap: .2rem;
	margin-bottom: .8rem;
	display: grid
}

#roofDetail .r1 .inner .mid .tabItem .tab {
	height: 2rem;
	cursor: pointer;
	background-color: #1c1f1f;
	border-radius: .18rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#roofDetail .r1 .inner .mid .tabItem .tab .content {
	filter: grayscale();
	-webkit-filter: grayscale();
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	height: 100%;
	opacity: .5;
	grid-auto-flow: column;
	-ms-flex-line-pack: center;
	-ms-flex-pack: center;
	align-content: center;
	justify-content: center;
	gap: .2rem .5rem;
	transition: all .5s cubic-bezier(.38, 0, 0, 1);
	display: grid
}

#roofDetail .r1 .inner .mid .tabItem .tab .content .icon {
	max-width: 1.3rem;
	max-height: .7rem;
	object-fit: contain
}

#roofDetail .r1 .inner .mid .tabItem .tab .arrow {
	width: .4rem;
	opacity: 0;
	margin: 0 auto;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 98%;
	left: 0;
	right: 0
}

#roofDetail .r1 .inner .mid .tabItem .tab .arrow path {
	fill: #1c1f1f
}

#roofDetail .r1 .inner .mid .tabItem .tab:hover .content {
	opacity: 1;
	filter: grayscale(0%);
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%)
}

#roofDetail .r1 .inner .mid .tabItem .tab.on {
	box-shadow: 0 3.125vw 5.20833vw rgba(0, 0, 0, .25)
}

#roofDetail .r1 .inner .mid .tabItem .tab.on .content {
	opacity: 1;
	filter: grayscale(0%);
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%)
}

#roofDetail .r1 .inner .mid .tabItem .tab.on .arrow {
	opacity: 1
}

#roofDetail .r1 .inner .mid .tabItem .tab:after {
	content: ""
}

#roofDetail .r1 .inner .mid .group .part {
	display: none
}

#roofDetail .r1 .inner .mid .group .part .box {
	cursor: pointer;
	background-color: #f7f7f7;
	border-radius: .24rem;
	margin-bottom: .3rem;
	padding: .5rem 50% .5rem .7rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1);
	animation-name: fadeInUpSmall;
	animation-duration: .7s;
	animation-timing-function: cubic-bezier(.38, 0, 0, 1);
	animation-fill-mode: both;
	position: relative;
	overflow: hidden
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(1) {
	animation-delay: .1s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(2) {
	animation-delay: .2s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(3) {
	animation-delay: .3s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(4) {
	animation-delay: .4s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(5) {
	animation-delay: .5s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(6) {
	animation-delay: .6s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(7) {
	animation-delay: .7s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(8) {
	animation-delay: .8s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(9) {
	animation-delay: .9s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(10) {
	animation-delay: 1s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(11) {
	animation-delay: 1.1s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(12) {
	animation-delay: 1.2s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(13) {
	animation-delay: 1.3s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(14) {
	animation-delay: 1.4s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(15) {
	animation-delay: 1.5s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(16) {
	animation-delay: 1.6s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(17) {
	animation-delay: 1.7s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(18) {
	animation-delay: 1.8s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(19) {
	animation-delay: 1.9s
}

#roofDetail .r1 .inner .mid .group .part .box:nth-child(20) {
	animation-delay: 2s
}

#roofDetail .r1 .inner .mid .group .part .box h4 {
	font-size: .32rem;
	line-height: 1.2;
	transition: all .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r1 .inner .mid .group .part .box .msg {
	margin-top: .3rem;
	padding-left: .2rem
}

#roofDetail .r1 .inner .mid .group .part .box .msg p {
	max-width: 5.7rem;
	text-align: justify;
	margin-bottom: 4px;
	line-height: 1.7
}

#roofDetail .r1 .inner .mid .group .part .box .msg p:last-of-type {
	margin-bottom: 0
}

#roofDetail .r1 .inner .mid .group .part .box .msg .items {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-top: .3rem
}

#roofDetail .r1 .inner .mid .group .part .box .msg .items>li {
	width: .8rem;
	padding: 0 .1rem
}

#roofDetail .r1 .inner .mid .group .part .box .msg .items>li .chunk {
	width: .6rem;
	height: .6rem;
	background-color: #ededed;
	border-radius: .1rem;
	margin: 0 auto
}

#roofDetail .r1 .inner .mid .group .part .box .msg .items>li .chunk>img {
	width: 100%
}

#roofDetail .r1 .inner .mid .group .part .box .msg .items>li p {
	text-align: center;
	margin-top: .1rem;
	line-height: 1.1
}

#roofDetail .r1 .inner .mid .group .part .box .imgBox {
	height: calc(100% + .3rem);
	width: 50%;
	position: absolute;
	top: -.1rem;
	right: 2%
}

#roofDetail .r1 .inner .mid .group .part .box .imgBox>img {
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	margin: 0 auto;
	display: block;
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 20%, #000 80%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0%, #000 20%, #000 80%, transparent 100%)
}

#roofDetail .r1 .inner .mid .group .part .box .downIcon {
	width: .6rem;
	height: .6rem;
	background-color: #fff;
	border-radius: 50%;
	margin: auto 0;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .6rem;
	overflow: hidden
}

#roofDetail .r1 .inner .mid .group .part .box .downIcon .mask {
	z-index: 1;
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r1 .inner .mid .group .part .box .downIcon .layer-icon {
	z-index: 10;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r1 .inner .mid .group .part .box.active {
	box-shadow: 0 .5rem 1rem -.1rem rgba(0, 0, 0, .2)
}

#roofDetail .r1 .inner .mid .group .part .box.active h4 {
	font-size: .36rem
}

#roofDetail .r1 .inner .mid .group .part .box.active .msg {
	display: block
}

#roofDetail .r1 .inner .mid .group .part .box.active .downIcon .mask {
	opacity: 1
}

#roofDetail .r1 .inner .mid .group .part .box.active .downIcon .layer-icon {
	transform: scaleY(-1)
}

#roofDetail .r1 .inner .mid .group .part .box.fill h4 {
	font-size: .36rem
}

#roofDetail .r1 .inner .mid .group .part .box.fill .msg {
	display: block
}

#roofDetail .r1 .inner .mid .group .part .box.fill .downIcon {
	display: none
}

#roofDetail .r1 .inner .mid .group .part.on {
	display: block
}

#roofDetail .r2 {
	padding-top: .3rem
}

#roofDetail .r2 .inner {
	border-bottom: 1px solid rgba(26, 26, 26, .3);
	padding-bottom: 1.3rem
}

#roofDetail .r2 .inner .mid {
	overflow: hidden
}

#roofDetail .r2 .inner .mid .r2Sw {
	width: 100%;
	padding-top: 1rem;
	transition-timing-function: cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide {
	width: 46vw
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo {
	height: 3rem;
	background-size: cover;
	border-radius: .2rem;
	margin-bottom: .2rem;
	transition: all .8s cubic-bezier(.38, 0, 0, 1);
	position: relative;
	overflow: hidden
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo:after {
	content: "";
	pointer-events: none;
	opacity: 0;
	background-color: rgba(0, 0, 0, .2);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo>.mask {
	pointer-events: none;
	opacity: 0;
	z-index: 2;
	background: linear-gradient(30deg, #e27402 5%, rgba(254, 219, 0, 0) 28%);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1);
	top: auto;
	bottom: -2px;
	left: -2px
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo .btnIcon {
	width: .5rem;
	opacity: 0;
	z-index: 5;
	transition: width .6s cubic-bezier(.38, 0, 0, 1), opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .photo .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .msg {
	padding: 0 .15rem;
	position: relative
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .msg h3 {
	line-height: 1.2
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .msg h4 {
	text-align: right;
	color: #232626;
	line-height: .8;
	position: absolute;
	top: 0;
	right: 0
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide .msg h4 small {
	color: #232626;
	margin-left: -.2em
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide:hover .photo {
	box-shadow: 0 .3rem .6rem -5px rgba(35, 38, 38, .3)
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide:hover .photo:after,
#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide:hover .photo>.mask {
	opacity: 1
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide:hover .photo .btnIcon {
	width: 1.2rem;
	opacity: 1
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .txt {
	opacity: 1;
	transform: translate(-.15rem)
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .mask:after {
	opacity: 1
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .layer-icon {
	transform: translate(.2rem)
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-button-prev {
	height: .9rem;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 1.1rem
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	opacity: .4;
	background-color: #f5f5f5;
	border-radius: 50%;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-button-prev .layer-icon:hover {
	opacity: 1
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-button-next {
	height: .9rem;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	opacity: .4;
	background-color: #f5f5f5;
	border-radius: 50%;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r2 .inner .mid .r2Sw .swiper-button-next .layer-icon:hover {
	opacity: 1
}

#roofDetail .r3 {
	padding-top: 1rem;
	padding-bottom: 1.2rem
}

#roofDetail .r3 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

#roofDetail .r3 .inner .top .topic {
	width: 50%
}

#roofDetail .r3 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#roofDetail .r3 .inner .mid {
	position: relative
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide {
	height: 5.6rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .6rem 0;
	transition: box-shadow .6s cubic-bezier(.38, 0, 0, 1), background-color .6s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide h3 {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide>img {
	height: 2.09rem;
	transition: transform .6s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
	width: .5rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover h3 {
		color: #e27402
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover>img {
		transform: scale(1.05)
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon {
		width: 1.2rem
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .mask:after {
		opacity: 1
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

@media screen and (orientation:portrait) {
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
		opacity: 0
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active,
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active h3,
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active h3 {
		color: #e27402
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active>img,
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active>img {
		transform: scale(1.05)
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon,
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon {
		width: 3.2rem;
		opacity: 1
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .txt,
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .txt {
		opacity: 1;
		line-height: .8rem;
		transform: translate(-.15rem)
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .mask,
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .mask {
		height: .8rem
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .mask:after,
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .mask:after {
		opacity: 1
	}

	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .layer-icon,
	#roofDetail .r3 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .layer-icon {
		transform-origin: 46% 100%;
		line-height: .8rem;
		transform: translate(.7rem)rotate(45deg)
	}
}

#roofDetail .r3 .inner .mid .swiper .swiper-button-prev {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(-90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: end;
	justify-content: flex-end;
	position: absolute;
	bottom: 0;
	right: calc(100% - .45rem)
}

#roofDetail .r3 .inner .mid .swiper .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r3 .inner .mid .swiper .swiper-button-prev .layer-icon:hover {
	background-color: #000
}

#roofDetail .r3 .inner .mid .swiper .swiper-button-next {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: start;
	justify-content: flex-start;
	position: absolute;
	bottom: 0;
	left: calc(100% - .45rem)
}

#roofDetail .r3 .inner .mid .swiper .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#roofDetail .r3 .inner .mid .swiper .swiper-button-next .layer-icon:hover {
	background-color: #000
}

#roofDetail .r3 .inner .btm {
	height: 2.4rem;
	background-color: #fff;
	border-radius: .18rem;
	margin-top: .25rem;
	overflow: hidden
}

#roofDetail .r3 .inner .btm>.pic {
	width: 50%;
	height: 100%;
	object-fit: cover;
	background-position: top;
	display: block
}

#roofDetail .r3 .inner .btm .col {
	width: 50%;
	height: 100%;
	position: relative
}

#roofDetail .r3 .inner .btm .col>.mask {
	height: 100%;
	width: 100%;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 25%);
	position: absolute;
	top: 0;
	left: -2rem
}

#roofDetail .r4 {
	background: linear-gradient(90deg, #ffeb00, #e27402);
	padding: 1rem 0 .85rem
}

#roofDetail .r4 .inner .form {
	-ms-flex-align: start;
	align-items: flex-start
}

#roofDetail .r4 .inner .form h2 {
	line-height: 2rem
}

#roofDetail .r4 .inner .form .col {
	width: 9.3rem
}

#roofDetail .r4 .inner .form .col .inRow {
	width: 100%;
	grid-template-columns: repeat(var(--col), 1fr);
	gap: .1rem;
	margin-bottom: .1rem;
	display: grid;
	position: relative
}

#roofDetail .r4 .inner .form .col .inRow:nth-of-type(2) {
	z-index: 5
}

#roofDetail .r4 .inner .form .col .inRow .inTxt {
	height: .5rem;
	background-color: rgba(255, 255, 255, .9);
	border-radius: .12rem;
	padding: 0 .2rem;
	position: relative
}

#roofDetail .r4 .inner .form .col .inRow .inTxt>input[type=text] {
	width: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none;
	padding: 0;
	line-height: .5rem;
	display: block
}

#roofDetail .r4 .inner .form .col .inRow .inTxt>input[type=text]::-ms-input-placeholder {
	color: #1c1f1f;
	font-size: .625vw
}

#roofDetail .r4 .inner .form .col .inRow .inTxt>input[type=text]::placeholder {
	color: #1c1f1f;
	font-size: .625vw
}

#roofDetail .r4 .inner .form .col .inRow .inTxt .must {
	color: #000;
	font-size: .2rem;
	position: absolute;
	top: .04rem;
	left: .12rem
}

#roofDetail .r4 .inner .form .col .inRow .inDown {
	height: .5rem;
	position: relative
}

#roofDetail .r4 .inner .form .col .inRow .inDown .input-text {
	height: .5rem;
	width: 100%;
	cursor: pointer;
	background-color: rgba(255, 255, 255, .9);
	border: none;
	border-radius: .12rem;
	padding: 0 .2rem;
	position: relative
}

#roofDetail .r4 .inner .form .col .inRow .inDown .input-text .must {
	color: #000;
	font-size: .2rem;
	position: absolute;
	top: .04rem;
	left: .12rem
}

#roofDetail .r4 .inner .form .col .inRow .inDown .input-text>input[type=text] {
	height: 100%;
	text-indent: 0;
	width: 100%;
	pointer-events: none;
	background-color: transparent;
	border: none
}

#roofDetail .r4 .inner .form .col .inRow .inDown .input-text .arrow {
	width: 0;
	height: 0;
	transform-origin: 0 20%;
	z-index: 10;
	border: 5px solid transparent;
	border-top-color: #1c1f1f;
	margin: auto 0;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 5px;
	bottom: 0;
	right: .2rem
}

#roofDetail .r4 .inner .form .col .inRow .inDown .childDown {
	width: 100%;
	max-height: calc(1.04167vw + 2rem);
	background-color: rgba(255, 255, 255, .9);
	border-bottom-right-radius: .18rem;
	border-bottom-left-radius: .18rem;
	padding: .1rem .2rem;
	display: none;
	position: absolute;
	top: calc(100% - .09rem);
	left: 0;
	overflow: auto
}

#roofDetail .r4 .inner .form .col .inRow .inDown .childDown>li {
	width: 100%
}

#roofDetail .r4 .inner .form .col .inRow .inDown .childDown>li>a {
	width: 100%;
	line-height: .4rem;
	display: block
}

#roofDetail .r4 .inner .form .col .inRow .inArea {
	width: 100%;
	background-color: rgba(255, 255, 255, .9);
	border-radius: .12rem;
	padding: .2rem
}

#roofDetail .r4 .inner .form .col .inRow .inArea textarea {
	width: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none;
	display: block
}

#roofDetail .r4 .inner .form .col .inRow .inArea textarea::-ms-input-placeholder {
	color: rgba(28, 31, 31, .5);
	font-size: .625vw
}

#roofDetail .r4 .inner .form .col .inRow .inArea textarea::placeholder {
	color: rgba(28, 31, 31, .5);
	font-size: .625vw
}

#roofDetail .r4 .inner .form .col .inRow .btm {
	padding: 5px 0 5px .2rem
}

#roofDetail .r4 .inner .form .col .inRow .btm .layer-btn {
	width: 2.4rem
}

#roofDetail .r4 .inner .form .col .inRow .btm .layer-btn .mk {
	background-color: #fff
}

#roofDetail .r4 .inner .form .col .inRow .btm .layer-btn:hover {
	box-shadow: 0 .1rem .2rem -4px rgba(35, 38, 38, .3)
}

#roofDetail .r5 {
	overflow: hidden
}

#roofDetail .r5 .inner {
	padding: 1.6rem 40% 1.6rem 0
}

#roofDetail .r5 .inner .top {
	margin-bottom: .5rem
}

#roofDetail .r5 .inner>.box {
	grid-template-columns: repeat(2, 1fr);
	gap: 0 .3rem;
	display: grid
}

#roofDetail .r5 .inner>.box>li .photo {
	height: 2rem;
	border: 2px solid #fff;
	border-radius: .12rem;
	position: relative;
	overflow: hidden
}

#roofDetail .r5 .inner>.box>li:first-of-type h3 {
	color: #e27402
}

#roofDetail .r5 .inner>.box>li:first-of-type .photo {
	border-color: #e27402
}

#roofDetail .r5 .inner .items {
	padding-top: .4rem
}

#roofDetail .r6 {
	width: 100%;
	height: 56.25vw;
	overflow: hidden
}

#roofDetail .r6 .inner {
	height: 100%;
	padding: 1.6rem 0;
	position: relative
}

#roofDetail .r6 .inner .top {
	margin-bottom: .5rem
}

#roofDetail .r6 .inner .mid {
	width: 45%;
	position: absolute;
	bottom: 1.08rem;
	right: 0
}

#roofDetail .r7 {
	width: 100%;
	height: 56.25vw;
	overflow: hidden
}

#roofDetail .r7 .inner {
	height: 100%;
	padding: 1.6rem 0;
	position: relative
}

#roofDetail .r7 .inner .top {
	margin-bottom: .5rem
}

#roofDetail .r7 .inner .mid {
	width: 50%
}

#solartrack .banner {
	height: 10.6rem;
	position: relative;
	overflow: hidden
}

#solartrack .banner .bg {
	height: 10.6rem
}

#solartrack .banner .bg .pic {
	background-position: bottom
}

#solartrack .banner .inner {
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	padding-top: 1.8rem;
	padding-bottom: .7rem
}

#solartrack .banner .inner h1 {
	text-align: center;
	line-height: 1
}

#solartrack .banner .inner h1 .letter {
	display: block
}

#solartrack .banner .inner .group {
	width: 100%;
	grid-template-columns: repeat(3, auto);
	-ms-flex-pack: justify;
	justify-content: space-between;
	display: grid
}

#solartrack .banner .inner .group .part>img {
	height: .62rem;
	margin-right: .35rem
}

#solartrack .r1 {
	background-color: #efefef;
	padding-top: 1.1rem;
	padding-bottom: .9rem
}

#solartrack .r1 .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .75rem
}

#solartrack .r1 .top .topic {
	width: 50%
}

#solartrack .r1 .top>p {
	width: 50%;
	line-height: 1.33
}

#solartrack .r1 .mid {
	display: grid
}

@media screen and (orientation:landscape) {
	#solartrack .r1 .mid {
		grid-auto-flow: column;
		-ms-flex-pack: center;
		justify-content: center;
		gap: 0 .24rem
	}
}

#solartrack .r1 .mid .part {
	width: 4.8rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	padding-bottom: 1.8rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#solartrack .r1 .mid .part h2 {
	padding: .5rem .6rem .3rem;
	transition: all .5s cubic-bezier(.38, 0, 0, 1)
}

#solartrack .r1 .mid .part .pic {
	height: 2rem;
	width: 100%;
	background-size: auto 78%
}

#solartrack .r1 .mid .part h3 {
	margin-top: .2rem;
	margin-bottom: .2rem;
	padding: 0 .6rem
}

#solartrack .r1 .mid .part p {
	padding: 0 .6rem
}

#solartrack .r1 .mid .part .line {
	border-bottom: 1px dashed rgba(0, 0, 0, .5);
	margin: .2rem .6rem;
	display: block
}

#solartrack .r1 .mid .part .items {
	padding: 0 .6rem
}

#solartrack .r1 .mid .part .items>li {
	color: rgba(60, 65, 65, .8);
	padding: 5px 0 5px 1em;
	line-height: 1.2;
	position: relative
}

#solartrack .r1 .mid .part .items>li em {
	line-height: .8em;
	position: absolute;
	top: 0;
	left: 0
}

#solartrack .r1 .mid .part .layer-btn {
	width: 1.8rem;
	height: .64rem;
	border: 4px solid rgba(35, 38, 38, .2);
	margin: 0 auto;
	transition: border-color .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: .45rem;
	left: 0;
	right: 0
}

#solartrack .r1 .mid .part .layer-btn .mk {
	opacity: 0
}

#solartrack .r1 .mid .part .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#solartrack .r1 .mid .part .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

@media screen and (orientation:landscape) {
	#solartrack .r1 .mid .part:hover {
		transform: translateY(-2%);
		box-shadow: 0 80px 120px rgba(0, 0, 0, .2)
	}

	#solartrack .r1 .mid .part:hover h2 {
		letter-spacing: -.03em;
		font-weight: 700
	}

	#solartrack .r1 .mid .part:hover .layer-btn {
		border-color: rgba(35, 38, 38, 0)
	}

	#solartrack .r1 .mid .part:hover .layer-btn .mk {
		opacity: 1
	}

	#solartrack .r1 .mid .part:hover .layer-btn .txt {
		transform: translate(-.15rem)
	}

	#solartrack .r1 .mid .part:hover .layer-btn .iconfont {
		opacity: 1;
		transform: translate(.03rem)rotate(45deg)
	}
}

@media screen and (orientation:portrait) {
	#solartrack .r1 .mid .part {
		transform: scale(.9)
	}

	#solartrack .r1 .mid .part.swiper-slide-active,
	#solartrack .r1 .mid .part.swiper-slide-duplicate-active {
		transform: scale(1)
	}
}

#solartrack .r2 {
	padding: 1.5rem 0
}

#solartrack .r2 .inner .left {
	width: 50%
}

#solartrack .r2 .inner .left .topic {
	margin-bottom: .4rem
}

#solartrack .r2 .inner .left>p {
	margin-bottom: 1.5rem;
	line-height: 1.3
}

#solartrack .r2 .inner .left .items>li {
	margin-bottom: .45rem
}

#solartrack .r2 .inner .left .items>li:last-of-type {
	margin-bottom: 0
}

#solartrack .r2 .inner .left .items>li p {
	line-height: 2
}

#solartrack .r3 {
	padding: 1.3rem 0 1rem
}

#solartrack .r3 .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .9rem
}

#solartrack .r3 .top .topic {
	width: 50%
}

#solartrack .r3 .top>p {
	width: 50%;
	line-height: 1.33
}

#solartrack .r3 .mid .part {
	grid-template-columns: repeat(var(--col), 1fr);
	gap: 0 .2rem;
	display: grid;
	overflow: hidden
}

#solartrack .r3 .mid .part:nth-of-type(1) {
	margin-bottom: .3rem
}

#solartrack .r3 .mid .part .col {
	background-color: #1c1e21;
	border-radius: .28rem;
	padding: .55rem .45rem
}

#solartrack .r3 .mid .part .col h3 {
	margin-bottom: .3rem
}

#solartrack .r3 .mid .part .col .box {
	height: 3.2rem;
	border: 1px dashed rgba(255, 255, 255, .6);
	border-radius: .16rem;
	position: relative
}

#solartrack .r3 .mid .part .col .box .pic {
	background-size: auto 64%
}

#solartrack .r3 .mid .part .col .box .pic video {
	width: 72%;
	mix-blend-mode: lighten;
	display: block
}

#solartrack .r3 .mid .part .col .box .pic .MediaTs {
	width: 72%;
	height: 88%;
	mix-blend-mode: lighten;
	display: block
}

#solartrack .r3 .mid .part .col .box h4 {
	text-align: center;
	white-space: nowrap;
	background-color: #1c1e21;
	padding: 0 .2rem;
	position: absolute;
	bottom: -.5em;
	left: 50%;
	transform: translate(-50%)
}

#solartrack .r3 .mid .part .chunk {
	background-color: #1c1e21;
	border-radius: .28rem;
	padding: .6rem .5rem .5rem .6rem
}

#solartrack .r3 .mid .part .chunk .pic {
	height: 1.2rem;
	background-position: 0 100%;
	background-size: auto 100%;
	margin-bottom: .4rem
}

#solartrack .r3 .mid .part .chunk h3 {
	margin-bottom: .2rem
}

#solartrack .r3 .btm {
	padding-top: .5rem
}

#solartrack .r3 .btm .layer-btn .txt {
	margin-right: .15rem;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#solartrack .r4 {
	padding: 1.6rem 0 1.2rem
}

#solartrack .r4 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .9rem;
	position: relative
}

#solartrack .r4 .inner .top .topic,
#solartrack .r4 .inner .top .half {
	width: 50%
}

#solartrack .r4 .inner .top .half p {
	line-height: 1.33
}

#solartrack .r4 .inner .top .half>.note {
	-ms-flex-align: end;
	align-items: flex-end;
	margin-top: .05rem
}

#solartrack .r4 .inner .top .half>.note .set {
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	margin: 0 5px;
	display: -ms-flexbox;
	display: flex
}

#solartrack .r4 .inner .top .half>.note .set .upIcon {
	width: .3rem;
	opacity: 0;
	transform-origin: 50% 100%;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	transform: scale(.6)
}

#solartrack .r4 .inner .top .half>.note .set .upIcon path {
	fill: #e27402
}

#solartrack .r4 .inner .top .half>.note .set .upIcon.go {
	opacity: 1;
	transform: rotate(-25deg)translate(.1rem, -.1rem)scale(1)
}

#solartrack .r4 .inner .top .half>.note .set em {
	line-height: 1
}

#solartrack .r4 .inner .top .half>.note .set sub {
	vertical-align: baseline
}

#solartrack .r4 .inner .top>img {
	height: 2.6rem;
	opacity: .1;
	position: absolute;
	top: .75rem;
	left: 2.3rem
}

#solartrack .r4 .inner .mid {
	height: 5.25rem;
	width: 100%;
	position: relative
}

#solartrack .r4 .inner .mid>.img {
	width: 100%;
	display: block
}

#solartrack .r4 .inner .mid #proCv {
	width: 100%
}

#solartrack .r5 {
	background-color: #efefef;
	padding-top: 1.6rem;
	padding-bottom: .5rem
}

#solartrack .r5 .inner {
	margin-bottom: 1.5rem
}

#solartrack .r5 .inner .mid {
	z-index: 4;
	position: relative
}

#solartrack .r5 .inner .mid>p {
	width: 48%;
	padding-bottom: .8rem;
	line-height: 1.33
}

#solartrack .r5 .inner .mid>p b {
	font-size: inherit
}

#solartrack .r5 .inner .mid .imgBox {
	position: relative
}

#solartrack .r5 .inner .mid .imgBox .img {
	height: 7.8rem;
	display: block
}

#solartrack .r5 .inner .mid .imgBox .years {
	position: absolute;
	bottom: 27%;
	right: -8%
}

#solartrack .r5 .inner .mid .imgBox .years>em {
	letter-spacing: -.2em;
	text-indent: -.92em;
	font-size: 4.6rem;
	line-height: .8;
	display: inline-block
}

#solartrack .r5 .inner .mid .imgBox .years sub {
	vertical-align: baseline
}

#solartrack .r5 .inner .btm {
	z-index: 2;
	margin-top: -1.2rem;
	position: relative
}

#solartrack .r5 .inner .btm .note {
	margin-bottom: .6rem
}

#solartrack .r5 .inner .btm .note .txt {
	padding-right: .2rem
}

#solartrack .r5 .inner .btm .note .line {
	height: 1px;
	background-color: rgba(26, 26, 26, .3);
	-ms-flex: 1;
	flex: 1
}

#solartrack .r5 .inner .btm .logoSw {
	width: 100%;
	grid-auto-flow: column;
	padding: .2rem 0;
	display: grid
}

#solartrack .r5 .inner .btm .logoSw .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#solartrack .r5 .inner .btm .logoSw .swiper-wrapper .swiper-slide {
	padding-right: 1rem
}

#solartrack .r5 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo {
	height: .88rem
}

#solartrack .r5 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo>img {
	max-height: .88rem;
	opacity: .2;
	display: block
}

#solartrack .r6 {
	background-color: #efefef;
	padding: .5rem 0 1.7rem
}

#solartrack .r6 .inner {
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

#solartrack .r7 {
	padding-top: 1.7rem;
	padding-bottom: 1.6rem;
	overflow: hidden
}

#solartrack .r7 .bg .sign {
	width: 19rem;
	position: absolute;
	top: 3.2rem;
	right: -3rem
}

#solartrack .r7 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: 1rem
}

#solartrack .r7 .inner .top .topic {
	width: 50%
}

#solartrack .r7 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#solartrack .r7 .inner .mid {
	grid-template-rows: repeat(2, auto);
	grid-template-columns: repeat(2, 1fr);
	gap: .4rem;
	display: grid
}

#solartrack .r7 .inner .mid .part {
	border-radius: .2rem;
	overflow: hidden;
	box-shadow: 0 .3rem 1rem -5px rgba(0, 0, 0, .15)
}

#solartrack .r7 .inner .mid .part .pic {
	height: 3rem
}

#solartrack .r7 .inner .mid .part .msg {
	-webkit-backdrop-filter: blur(.6rem);
	-webkit-backdrop-filter: blur(.6rem);
	backdrop-filter: blur(.6rem);
	background-color: rgba(255, 255, 255, .5);
	padding: .4rem .7rem;
	position: relative
}

#solartrack .r7 .inner .mid .part .msg .icon {
	height: .4rem;
	position: absolute;
	top: .4rem;
	right: .6rem
}

#solartrack .r7 .inner .mid .part .msg h3 {
	margin-bottom: .1rem
}

#solartrack .r7 .inner .mid .part .msg .items>li {
	padding: 5px 0 5px 1em;
	line-height: 1.2;
	position: relative
}

#solartrack .r7 .inner .mid .part .msg .items>li em {
	line-height: 1.2em;
	position: absolute;
	top: 0;
	left: 0
}

#solartrack .r8 {
	padding-top: 2rem;
	padding-bottom: 1.7rem;
	position: relative;
	overflow: hidden
}

#solartrack .r8>svg {
	opacity: 0;
	pointer-events: none;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0
}

#solartrack .r8 .inner {
	grid-template-columns: 46% 50%;
	-ms-flex-pack: justify;
	justify-content: space-between;
	display: grid
}

#solartrack .r8 .inner .left h2 {
	margin-bottom: .2rem
}

#solartrack .r8 .inner .right {
	position: relative
}

#solartrack .r8 .inner .right .midIcon {
	width: 1.35rem
}

#solartrack .r8 .inner .right .group {
	width: 100%;
	grid-template-rows: repeat(2, 2.9rem);
	grid-template-columns: repeat(2, 1fr);
	gap: .2rem;
	display: grid
}

#solartrack .r8 .inner .right .group .mask {
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	z-index: 1;
	background-color: rgba(0, 0, 0, .3);
	border-radius: .5rem;
	overflow: hidden;
	-webkit-mask-position: 50%;
	mask-position: 50%;
	-webkit-mask-size: auto 100%;
	mask-size: auto 100%;
	-webkit-mask-repeat: repeat-x;
	mask-repeat: repeat-x
}

#solartrack .r8 .inner .right .group .box {
	z-index: 3;
	padding: .4rem .35rem;
	position: relative
}

#solartrack .r8 .inner .right .group .box h3 {
	z-index: 10;
	margin-bottom: .1rem;
	line-height: 1.1;
	position: relative
}

#solartrack .r8 .inner .right .group .box p {
	z-index: 10;
	position: relative
}

#solartrack .r8 .inner .right .group .box:nth-of-type(3),
#solartrack .r8 .inner .right .group .box:nth-of-type(4) {
	padding-top: 30%
}

#solartrack .r9 {
	background-color: #ededed;
	padding-top: .9rem
}

#solartrack .r9 .inner {
	padding-bottom: 1.3rem
}

#solartrack .r9 .inner .mid {
	overflow: hidden
}

#solartrack .r9 .inner .mid .r9Sw {
	width: 100%;
	padding-top: 1rem;
	transition-timing-function: cubic-bezier(.38, 0, 0, 1)
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide {
	width: 46vw
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo {
	height: 3rem;
	background-size: cover;
	border-radius: .2rem;
	margin-bottom: .2rem;
	transition: all .8s cubic-bezier(.38, 0, 0, 1);
	position: relative;
	overflow: hidden
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo:after {
	content: "";
	pointer-events: none;
	opacity: 0;
	background-color: rgba(0, 0, 0, .2);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1)
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo>.mask {
	pointer-events: none;
	opacity: 0;
	z-index: 2;
	background: linear-gradient(30deg, #e27402 5%, rgba(254, 219, 0, 0) 28%);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1);
	top: auto;
	bottom: -2px;
	left: -2px
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo .btnIcon {
	width: .5rem;
	opacity: 0;
	z-index: 5;
	transition: width .6s cubic-bezier(.38, 0, 0, 1), opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .photo .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .msg {
	padding: 0 .15rem;
	position: relative
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .msg h3 {
	line-height: 1.2
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .msg h4 {
	text-align: right;
	color: #232626;
	line-height: .8;
	position: absolute;
	top: 0;
	right: 0
}

#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide .msg h4 small {
	color: #232626;
	margin-left: -.2em
}

@media screen and (orientation:landscape) {
	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide:hover .photo {
		box-shadow: 0 .3rem .6rem -5px rgba(35, 38, 38, .3)
	}

	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide:hover .photo:after,
	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide:hover .photo>.mask {
		opacity: 1
	}

	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide:hover .photo .btnIcon {
		width: 1.2rem;
		opacity: 1
	}

	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .mask:after {
		opacity: 1
	}

	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

@media screen and (orientation:portrait) {
	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide.swiper-slide-active .photo {
		box-shadow: 0 .3rem .6rem -5px rgba(35, 38, 38, .3)
	}

	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide.swiper-slide-active .photo:after,
	#solartrack .r9 .inner .mid .r9Sw .swiper-wrapper .swiper-slide.swiper-slide-active .photo>.mask {
		opacity: 1
	}
}

#solartrack .r9 .inner .mid .r9Sw .swiper-button-prev {
	height: .9rem;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 1.1rem
}

#solartrack .r9 .inner .mid .r9Sw .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	opacity: .4;
	background-color: #f5f5f5;
	border-radius: 50%;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#solartrack .r9 .inner .mid .r9Sw .swiper-button-prev .layer-icon:hover {
	opacity: 1
}

#solartrack .r9 .inner .mid .r9Sw .swiper-button-next {
	height: .9rem;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0
}

#solartrack .r9 .inner .mid .r9Sw .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	opacity: .4;
	background-color: #f5f5f5;
	border-radius: 50%;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#solartrack .r9 .inner .mid .r9Sw .swiper-button-next .layer-icon:hover {
	opacity: 1
}

#solartrack .r10 {
	background: linear-gradient(90deg, #ffeb00, #e27402);
	padding: 1rem 0 .85rem
}

#solartrack .r10 .inner .form {
	-ms-flex-align: start;
	align-items: flex-start
}

#solartrack .r10 .inner .form h2 {
	line-height: 2rem
}

#solartrack .r10 .inner .form .col {
	width: 9.3rem
}

#solartrack .r10 .inner .form .col .inRow {
	width: 100%;
	grid-template-columns: repeat(var(--col), 1fr);
	gap: .1rem;
	margin-bottom: .1rem;
	display: grid;
	position: relative
}

#solartrack .r10 .inner .form .col .inRow:nth-of-type(2) {
	z-index: 5
}

#solartrack .r10 .inner .form .col .inRow .inTxt {
	height: .5rem;
	background-color: rgba(255, 255, 255, .9);
	border-radius: .12rem;
	padding: 0 .2rem;
	position: relative
}

#solartrack .r10 .inner .form .col .inRow .inTxt>input[type=text] {
	width: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none;
	padding: 0;
	line-height: .5rem;
	display: block
}

#solartrack .r10 .inner .form .col .inRow .inTxt>input[type=text]::-ms-input-placeholder {
	color: #1c1f1f;
	font-size: .625vw
}

#solartrack .r10 .inner .form .col .inRow .inTxt>input[type=text]::placeholder {
	color: #1c1f1f;
	font-size: .625vw
}

#solartrack .r10 .inner .form .col .inRow .inTxt .must {
	color: #000;
	font-size: .2rem;
	position: absolute;
	top: .04rem;
	left: .12rem
}

#solartrack .r10 .inner .form .col .inRow .inDown {
	height: .5rem;
	position: relative
}

#solartrack .r10 .inner .form .col .inRow .inDown .input-text {
	height: .5rem;
	width: 100%;
	cursor: pointer;
	background-color: rgba(255, 255, 255, .9);
	border: none;
	border-radius: .12rem;
	padding: 0 .2rem;
	position: relative
}

#solartrack .r10 .inner .form .col .inRow .inDown .input-text .must {
	color: #000;
	font-size: .2rem;
	position: absolute;
	top: .04rem;
	left: .12rem
}

#solartrack .r10 .inner .form .col .inRow .inDown .input-text>input[type=text] {
	height: 100%;
	text-indent: 0;
	width: 100%;
	pointer-events: none;
	background-color: transparent;
	border: none
}

#solartrack .r10 .inner .form .col .inRow .inDown .input-text .arrow {
	width: 0;
	height: 0;
	transform-origin: 0 20%;
	z-index: 10;
	border: 5px solid transparent;
	border-top-color: #1c1f1f;
	margin: auto 0;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 5px;
	bottom: 0;
	right: .2rem
}

#solartrack .r10 .inner .form .col .inRow .inDown .childDown {
	width: 100%;
	max-height: calc(1.04167vw + 2rem);
	background-color: rgba(255, 255, 255, .9);
	border-bottom-right-radius: .18rem;
	border-bottom-left-radius: .18rem;
	padding: .1rem .2rem;
	display: none;
	position: absolute;
	top: calc(100% - .09rem);
	left: 0;
	overflow: auto
}

#solartrack .r10 .inner .form .col .inRow .inDown .childDown>li {
	width: 100%
}

#solartrack .r10 .inner .form .col .inRow .inDown .childDown>li>a {
	width: 100%;
	line-height: .4rem;
	display: block
}

#solartrack .r10 .inner .form .col .inRow .inArea {
	width: 100%;
	background-color: rgba(255, 255, 255, .9);
	border-radius: .12rem;
	padding: .2rem
}

#solartrack .r10 .inner .form .col .inRow .inArea textarea {
	width: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none;
	display: block
}

#solartrack .r10 .inner .form .col .inRow .inArea textarea::-ms-input-placeholder {
	color: rgba(28, 31, 31, .5);
	font-size: .625vw
}

#solartrack .r10 .inner .form .col .inRow .inArea textarea::placeholder {
	color: rgba(28, 31, 31, .5);
	font-size: .625vw
}

#solartrack .r10 .inner .form .col .inRow .btm {
	padding: 5px 0 5px .2rem
}

#solartrack .r10 .inner .form .col .inRow .btm .layer-btn {
	width: 2.4rem
}

#solartrack .r10 .inner .form .col .inRow .btm .layer-btn .mk {
	background-color: #fff
}

#solartrack .r10 .inner .form .col .inRow .btm .layer-btn:hover {
	box-shadow: 0 .1rem .2rem -4px rgba(35, 38, 38, .3)
}

#news .banner {
 	padding-bottom: 1.6rem 
}

#news .banner>.bg {
	background-color: #fff;
	position: absolute;
	height: 5.6rem !important;
	overflow: hidden !important
}

#news .banner>.bg .img {
	width: 100%;
	display: block
}

#news .banner>.bg .mask {
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(255, 255, 255, 0) 50%, #fff 100%);
	position: absolute;
	top: 0;
	left: 0
}

#news .banner .inner {
	padding-top: 3.5rem;
	padding-bottom: .8rem
}

#news .banner .inner h1 {
	margin-bottom: 0rem;
	line-height: 1.2;
	color: #fff;
	text-transform: uppercase
}
#news .banner .inner p {color: #fff;margin-bottom: 1.5rem;}
#news .banner .inner .top {
	z-index: 12;
	margin-bottom: .6rem;
	position: relative
}

#news .banner .inner .top .tabBox .tab {
	min-width: 1.8rem;
	text-align: center;
	border: 1px solid rgba(41, 46, 46, .3);
	border-radius: 2rem;
	margin-right: .2rem;
	padding: .2rem .3rem;
	position: relative;
	overflow: hidden
}

#news .banner .inner .top .tabBox .tab:after {
	content: "";
	width: 120%;
	height: 100%;
	background-color: #292e2e;
	border-radius: 1rem;
	transition: transform .8s cubic-bezier(.38, 0, 0, 1), background-color .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: -10%;
	transform: translate(-100%)
}

#news .banner .inner .top .tabBox .tab>span {
	z-index: 10;
	line-height: 1;
	transition: color .5s cubic-bezier(.38, 0, 0, 1);
	display: block;
	position: relative
}

#news .banner .inner .top .tabBox .tab.on {
	background-color: rgba(41, 46, 46, .3);
	transition: background-color .8s cubic-bezier(.38, 0, 0, 1) .3s
}

#news .banner .inner .top .tabBox .tab.on:after {
	transform: translate(0, 0)
}

#news .banner .inner .top .tabBox .tab.on>span {
	color: #fff
}

@media screen and (orientation:landscape) {
	#news .banner .inner .top .tabBox .tab:hover {
		background-color: rgba(41, 46, 46, .3);
		transition: background-color .8s cubic-bezier(.38, 0, 0, 1) .3s
	}

	#news .banner .inner .top .tabBox .tab:hover:after {
		transform: translate(0, 0)
	}

	#news .banner .inner .top .tabBox .tab:hover>span {
		color: #fff
	}
}

#news .banner .inner .top .yearBox {
	position: relative
}

#news .banner .inner .top .yearBox .yearDown {
	cursor: pointer;
	padding-right: .38rem;
	position: relative
}

#news .banner .inner .top .yearBox .yearDown .arrow {
	width: 0;
	height: 0;
	border: .08rem solid transparent;
	border-top-color: #232626;
	top: .04rem;
	right: 0
}

#news .banner .inner .top .yearBox .child {
	width: 100%;
	opacity: 0;
	pointer-events: none;
	background-color: #292e2e;
	border-radius: .1rem;
	padding: .2rem 0;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 100%;
	right: 0;
	transform: translateY(10%);
	box-shadow: 0 .2rem .6rem -5px rgba(35, 38, 38, .3)
}

#news .banner .inner .top .yearBox .child>a {
	width: 100%;
	text-align: center;
	color: #fff;
	line-height: .4rem;
	transition: color .5s cubic-bezier(.38, 0, 0, 1);
	display: block
}

#news .banner .inner .top .yearBox .child>a.on,
#news .banner .inner .top .yearBox .child>a:hover {
	color: #e27402
}

#news .banner .inner .top .yearBox:hover .child {
	opacity: 1;
	pointer-events: auto;
	transform: translate(0, 0)
}

#news .banner .inner .mid {
	background-color: #fff;
	grid-template-columns: repeat(3, 1fr);
	gap: .5rem .3rem;
	display: grid
}

#news .banner .inner .mid .box {
	cursor: pointer;
	background-color: #f5f5f5;
	border-radius: .12rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden
}

#news .banner .inner .mid .box .msg {
	z-index: 10;
	padding-bottom: .6rem;
	position: relative
}

#news .banner .inner .mid .box .msg .til {
	z-index: 10;
	padding: .3rem .4rem;
	position: relative
}

#news .banner .inner .mid .box .msg .til small {
	margin-bottom: .3rem;
	display: block
}
#news .banner .inner .mid .box .msg .til h3{color: #666;}
#news .banner .inner .mid .box .msg .note {
	width: 100%;
	background-color: #f5f5f5;
	padding: 1rem .4rem .1rem;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: 0;
	left: 0
}

#news .banner .inner .mid .box .msg .note .btnIcon {
	width: 1.2rem;
	opacity: 1;
	height: .5rem;
	background-color: rgba(28, 31, 31, .1);
	transition: width .6s cubic-bezier(.38, 0, 0, 1), opacity .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#news .banner .inner .mid .box .msg .note .btnIcon .mask {
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#news .banner .inner .mid .box .msg .note .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#news .banner .inner .mid .box .msg .note .btnIcon .txt {
	text-align: center;
	z-index: 9;
	margin-right: .15rem;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1)
}

#news .banner .inner .mid .box .msg .note .btnIcon .layer-icon {
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#news .banner .inner .mid .box .photo {
	height: 3rem;
	width: 100%;
	position: relative;
	overflow: hidden
}

#news .banner .inner .mid .box .photo .pic {
	width: 100%;
	height: 100%;
	transition: all .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: 0;
	left: 0
}

@media screen and (orientation:landscape) {
	#news .banner .inner .mid .box:hover {
		box-shadow: 0 .7rem .8rem -5px rgba(35, 38, 38, .3)
	}

	#news .banner .inner .mid .box:hover .photo .pic {
		height: 100%
	}
}

#news .banner .btm {
	position: relative
}

#news .banner .btm .pager {
	z-index: 4;
	background-color: #fff;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	padding-bottom: .15em;
	padding-right: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#news .banner .btm .pager>a {
	color: rgba(35, 38, 38, .5);
	width: .4rem;
	text-align: center;
	line-height: 1;
	transition: all .3s cubic-bezier(.38, 0, 0, 1)
}

#news .banner .btm .pager>a.on {
	color: #232626
}

#news .banner .btm .line {
	width: 100%;
	height: 1px;
	border-bottom: 1px dashed #292e2e
}

#news .banner .btm .set {
	z-index: 4;
	background-color: #fff;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	padding-left: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#news .banner .btm .set .layer-icon {
	width: .9rem;
	height: .9rem;
	background-color: #f2f2f2;
	border-radius: 50%;
	margin-left: .2rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#news .banner .btm .set .layer-icon.disable>i {
	color: rgba(0, 0, 0, .3)
}

#newDetail .r1 {
	background-color: #f7f7f7;
	padding-top: 3rem;
	padding-bottom: 1rem
}

#newDetail .r1 .inner {
	max-width: 15rem;
	width: 78%;
	background-color: #fff;
	border-radius: .24rem;
	margin: 0 auto;
	padding-top: 1rem
}

#newDetail .r1 .inner .left {
	width: 22%;
	padding: 0 .3rem;
	position: absolute;
	top: 0;
	left: 0
}

#newDetail .r1 .inner .left .lab {
	height: .4rem;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	margin-bottom: .3rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#newDetail .r1 .inner .left .lab .img {
	height: .4rem;
	display: block;
	position: absolute;
	top: 0;
	left: 0
}

#newDetail .r1 .inner .left .lab>span {
	padding-left: .18rem;
	display: block
}

#newDetail .r1 .inner .left .note {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	display: -ms-flexbox;
	display: flex
}

#newDetail .r1 .inner .left .note>li {
	color: rgba(0, 0, 0, .8);
	background-color: #f5f5f5;
	border-radius: 1rem;
	margin-bottom: .1rem;
	padding: .1rem .2rem
}

#newDetail .r1 .inner .left .return {
	width: .8rem;
	cursor: pointer;
	margin-top: 1.3rem
}

#newDetail .r1 .inner .left .return .arrow {
	width: .8rem;
	height: .8rem;
	background-color: #f7f7f7;
	border-radius: 50%;
	margin: 0 auto;
	position: relative;
	overflow: hidden
}

#newDetail .r1 .inner .left .return .arrow:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#newDetail .r1 .inner .left .return .arrow i {
	z-index: 5;
	position: relative
}

#newDetail .r1 .inner .left .return h4 {
	width: 100%;
	text-align: center;
	padding: .1rem 0
}

#newDetail .r1 .inner .left .return:hover .arrow:after {
	opacity: 1
}

#newDetail .r1 .inner .mid {
	max-width: 9rem;
	width: 56%;
	margin: 0 auto;
	padding-bottom: 1.2rem
}

#newDetail .r1 .inner .mid .topic {
	padding-bottom: .6rem
}

#newDetail .r1 .inner .mid .topic h1 {
	margin-bottom: .6rem;
	line-height: 1.1
}

#newDetail .r1 .inner .mid .topic p {
	position: relative
}

#newDetail .r1 .inner .mid .topic p>small {
	z-index: 10;
	color: rgba(35, 38, 38, .6);
	background-color: #fff;
	padding-right: .2rem;
	display: block;
	position: relative
}

#newDetail .r1 .inner .mid .topic p .line {
	height: 1px;
	width: 100%;
	border-bottom: 1px dashed rgba(41, 46, 46, .6);
	margin: auto 0;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0
}

#newDetail .r1 .inner .mid .detail * {
	font-family: SourceHanSansCN-Regular;
	line-height: 1.6
}

#newDetail .r1 .inner .mid .detail img {
	width: 100%;
	margin: .3rem auto;
	display: block;
	height: auto !important
}

#newDetail .r1 .inner .mid .line {
	width: 100%;
	height: .4rem;
	text-align: center;
	margin: .6rem 0;
	position: relative
}

#newDetail .r1 .inner .mid .line:after {
	content: "";
	width: 100%;
	height: 1px;
	border-bottom: 1px dashed rgba(41, 46, 46, .6);
	left: 0
}

#newDetail .r1 .inner .mid .line>span {
	color: rgba(35, 38, 38, .6);
	z-index: 10;
	text-transform: uppercase;
	background-color: #fff;
	padding: 0 .2rem;
	position: relative
}

#newDetail .r1 .inner .mid .set {
	width: 100%;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 .2rem;
	display: grid
}

#newDetail .r1 .inner .mid .set .col {
	height: 1.5rem;
	cursor: pointer;
	background-color: #f7f7f7;
	border-radius: .18rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1), box-shadow .5s cubic-bezier(.38, 0, 0, 1)
}

#newDetail .r1 .inner .mid .set .col .arrow {
	width: .6rem;
	height: .6rem;
	border-radius: 50%;
	margin: 0 .3rem;
	position: relative;
	overflow: hidden
}

#newDetail .r1 .inner .mid .set .col .arrow:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #e27402, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#newDetail .r1 .inner .mid .set .col .arrow i {
	z-index: 5;
	position: relative
}

#newDetail .r1 .inner .mid .set .col .msg {
	width: calc(100% - 1.2rem)
}

#newDetail .r1 .inner .mid .set .col .msg P {
	color: rgba(35, 38, 38, .6);
	margin-top: .1rem
}

#newDetail .r1 .inner .mid .set .col.prevEl {
	padding-right: .5rem
}

#newDetail .r1 .inner .mid .set .col.nextEl {
	padding-left: .5rem
}

@media screen and (orientation:landscape) {
	#newDetail .r1 .inner .mid .set .col:hover {
		background-color: #fff;
		box-shadow: 0 30px 70px rgba(35, 38, 38, .15)
	}

	#newDetail .r1 .inner .mid .set .col:hover .arrow:after {
		opacity: 1
	}
}

#newDetail .r1 .inner .mid .moreBox {
	grid-template-columns: repeat(2, 1fr);
	gap: 0 .4rem;
	display: grid
}

#newDetail .r1 .inner .mid .moreBox .box {
	background-color: #f7f7f7;
	border-radius: .15rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1), box-shadow .5s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden
}

#newDetail .r1 .inner .mid .moreBox .box .msg {
	padding: .4rem
}

#newDetail .r1 .inner .mid .moreBox .box .msg p {
	margin-bottom: .1rem
}

#newDetail .r1 .inner .mid .moreBox .box .photo .pic {
	width: 100%;
	padding-bottom: 40%
}

@media screen and (orientation:landscape) {
	#newDetail .r1 .inner .mid .moreBox .box:hover {
		background-color: #fff;
		box-shadow: 0 30px 70px rgba(35, 38, 38, .15)
	}
}

#newDetail .r2 {
	background-color: #f7f7f7;
	padding-top: 3rem;
	padding-bottom: 1rem
}

#newDetail .r2 .inner {
	max-width: 15rem;
	width: 78%;
	background-color: #fff;
	border-radius: .24rem;
	margin: 0 auto;
	padding: 1rem
}

#newDetail .r2 .inner h1 {
	text-align: center;
	margin-bottom: .5rem
}

#newDetail .r2 .inner .detail {
	font-size: .72917vw;
	line-height: 1.5
}

#newDetail .r2 .inner .detail h2 {
	margin: .2rem 0
}

#blog .banner {
	padding-bottom: 1.6rem
}

#blog .banner>.bg {
	background-color: #fff;
	position: absolute;
	height: 5.6rem !important;
	overflow: hidden !important
}

#blog .banner>.bg .img {
	width: 100%;
	display: block
}

#blog .banner>.bg .mask {
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(255, 255, 255, 0) 50%, #fff 100%);
	position: absolute;
	top: 0;
	left: 0
}

#blog .banner .inner {
	padding-top: 4.5rem;
	padding-bottom: .8rem
}

#blog .banner .inner h1 {
	margin-bottom: .5rem;
	line-height: 1.2
}

#blog .banner .inner .top {
	z-index: 12;
	margin-bottom: .6rem;
	position: relative
}

#blog .banner .inner .top .tabBox .tab {
	min-width: 1.8rem;
	text-align: center;
	border: 1px solid rgba(41, 46, 46, .3);
	border-radius: 2rem;
	margin-right: .2rem;
	padding: .2rem .3rem;
	position: relative;
	overflow: hidden
}

#blog .banner .inner .top .tabBox .tab:after {
	content: "";
	width: 120%;
	height: 100%;
	background-color: #292e2e;
	border-radius: 1rem;
	transition: transform .8s cubic-bezier(.38, 0, 0, 1), background-color .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: -10%;
	transform: translate(-100%)
}

#blog .banner .inner .top .tabBox .tab>span {
	z-index: 10;
	line-height: 1;
	transition: color .5s cubic-bezier(.38, 0, 0, 1);
	display: block;
	position: relative
}

#blog .banner .inner .top .tabBox .tab:hover,
#blog .banner .inner .top .tabBox .tab.on {
	background-color: rgba(41, 46, 46, .3);
	transition: background-color .8s cubic-bezier(.38, 0, 0, 1) .3s
}

#blog .banner .inner .top .tabBox .tab:hover:after,
#blog .banner .inner .top .tabBox .tab.on:after {
	transform: translate(0, 0)
}

#blog .banner .inner .top .tabBox .tab:hover>span,
#blog .banner .inner .top .tabBox .tab.on>span {
	color: #fff
}

#blog .banner .inner .top .searchBox {
	width: 4.8rem;
	height: .6rem;
	background-color: #f5f5f5;
	border-radius: 1rem;
	padding: 0 0 0 .25rem
}

#blog .banner .inner .top .searchBox>input {
	height: 100%;
	width: calc(100% - 1rem);
	background-color: transparent;
	border: none
}

#blog .banner .inner .top .searchBox .subSearch {
	width: .6rem;
	height: .6rem;
	background-color: #1c1f1f;
	border-radius: 50%
}

#blog .banner .inner .mid {
	background-color: #fff;
	grid-template-columns: repeat(3, 1fr);
	gap: .3rem;
	display: grid
}

#blog .banner .inner .mid .box {
	cursor: pointer;
	background-color: #f5f5f5;
	border-radius: .12rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1), background-color .5s cubic-bezier(.38, 0, 0, 1);
	position: relative;
	overflow: hidden
}

#blog .banner .inner .mid .box>.mask {
	pointer-events: none;
	opacity: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: linear-gradient(30deg, #e27402 2%, rgba(254, 219, 0, 0) 22%);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: auto;
	bottom: -2px;
	left: -2px
}

#blog .banner .inner .mid .box .msg {
	z-index: 10;
	padding-bottom: .4rem;
	position: relative
}

#blog .banner .inner .mid .box .msg .til {
	z-index: 10;
	padding: .3rem .4rem .5rem;
	position: relative
}

#blog .banner .inner .mid .box .msg .til small {
	margin-bottom: .3rem;
	display: block
}

#blog .banner .inner .mid .box .msg .items {
	z-index: 10;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: .6rem .4rem 0;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#blog .banner .inner .mid .box .msg .items>.list {
	color: rgba(0, 0, 0, .7);
	opacity: 0;
	background-color: rgba(0, 0, 0, .05);
	border-radius: 1rem;
	margin-bottom: .1rem;
	padding: 6px .12rem;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1), opacity .5s cubic-bezier(.38, 0, 0, 1);
	transform: translateY(.2rem)
}

#blog .banner .inner .mid .box .msg .items>.list:last-of-type {
	margin-bottom: 0
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(1) {
	transition-delay: 50ms
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(2) {
	transition-delay: .1s
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(3) {
	transition-delay: .15s
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(4) {
	transition-delay: .2s
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(5) {
	transition-delay: .25s
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(6) {
	transition-delay: .3s
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(7) {
	transition-delay: .35s
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(8) {
	transition-delay: .4s
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(9) {
	transition-delay: .45s
}

#blog .banner .inner .mid .box .msg .items>.list:nth-child(10) {
	transition-delay: .5s
}

#blog .banner .inner .mid .box .msg .items .note {
	height: 100%;
	width: 100%;
	-ms-flex-align: end;
	align-items: flex-end;
	padding: .1rem .4rem;
	transition: transform .7s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: 0;
	left: 0
}

#blog .banner .inner .mid .box .msg .items .note .btnIcon {
	width: .5rem;
	opacity: 0;
	transition: width .6s cubic-bezier(.38, 0, 0, 1), opacity .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: calc(100% - .2rem);
	right: .4rem
}

#blog .banner .inner .mid .box .msg .items .note .btnIcon .mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#blog .banner .inner .mid .box .msg .items .note .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#blog .banner .inner .mid .box .msg .items .note .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#blog .banner .inner .mid .box .msg .items .note .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	#blog .banner .inner .mid .box:hover {
		background-color: #fff;
		box-shadow: 0 .7rem .8rem -5px rgba(35, 38, 38, .3)
	}

	#blog .banner .inner .mid .box:hover>.mask {
		opacity: 1
	}

	#blog .banner .inner .mid .box:hover .msg .items>.list {
		opacity: 1;
		transform: translateY(0)
	}

	#blog .banner .inner .mid .box:hover .msg .items .note {
		transform: translateY(calc(-100% - .1rem))
	}

	#blog .banner .inner .mid .box:hover .msg .items .note .btnIcon {
		width: 1.2rem;
		opacity: 1
	}

	#blog .banner .inner .mid .box:hover .msg .items .note .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#blog .banner .inner .mid .box:hover .msg .items .note .btnIcon .mask:after {
		opacity: 1
	}

	#blog .banner .inner .mid .box:hover .msg .items .note .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

@media screen and (orientation:portrait) {
	#blog .banner .inner .mid .box {
		background-color: #fff;
		box-shadow: 0 .2rem .6rem -5px rgba(35, 38, 38, .3)
	}

	#blog .banner .inner .mid .box>.mask {
		opacity: 1
	}

	#blog .banner .inner .mid .box .msg .items>.list {
		opacity: 1;
		transform: translateY(0)
	}

	#blog .banner .inner .mid .box .msg .items .note {
		transform: translateY(calc(-100% - .1rem))
	}

	#blog .banner .inner .mid .box .msg .items .note .btnIcon {
		width: 1.2rem;
		opacity: 1;
		display: none
	}

	#blog .banner .inner .mid .box .msg .items .note .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#blog .banner .inner .mid .box .msg .items .note .btnIcon .mask:after {
		opacity: 1
	}

	#blog .banner .inner .mid .box .msg .items .note .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

#blog .banner .btm {
	position: relative
}

#blog .banner .btm .pager {
	z-index: 4;
	background-color: #fff;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	padding-bottom: .15em;
	padding-right: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#blog .banner .btm .pager>a {
	color: rgba(35, 38, 38, .5);
	width: .4rem;
	text-align: center;
	line-height: 1;
	transition: all .3s cubic-bezier(.38, 0, 0, 1)
}

#blog .banner .btm .pager>a.on {
	color: #232626
}

#blog .banner .btm .line {
	width: 100%;
	height: 1px;
	border-bottom: 1px dashed #292e2e
}

#blog .banner .btm .set {
	z-index: 4;
	background-color: #fff;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	padding-left: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#blog .banner .btm .set .layer-icon {
	width: .9rem;
	height: .9rem;
	background-color: #f2f2f2;
	border-radius: 50%;
	margin-left: .2rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#blog .banner .btm .set .layer-icon.disable>i {
	color: rgba(0, 0, 0, .3)
}

#reference .banner {
	padding-bottom: 1.6rem
}

#reference .banner>.bg {
	background-color: #fff;
	position: absolute;
	height: 5.6rem !important;
	overflow: hidden !important
}

#reference .banner>.bg .img {
	width: 100%;
	display: block
}

#reference .banner>.bg .mask {
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(255, 255, 255, 0) 50%, #fff 100%);
	position: absolute;
	top: 0;
	left: 0
}

#reference .banner .inner {
	padding-top: 4.5rem;
	padding-bottom: .8rem
}

#reference .banner .inner h1 {
	margin-bottom: 1.5rem;
	line-height: 1.2
}

#reference .banner .inner .top {
	z-index: 12;
	grid-template-columns: 1fr 1fr;
	-ms-flex-align: start;
	align-items: start;
	gap: 0 2rem;
	margin-bottom: .6rem;
	display: grid;
	position: relative
}

#reference .banner .inner .top .part h3 {
	margin-bottom: .3rem
}

#reference .banner .inner .top .part .tab {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	display: -ms-flexbox;
	display: flex
}

#reference .banner .inner .top .part .tab>a {
	white-space: nowrap;
	border: 1px solid rgba(35, 38, 38, .2);
	border-radius: 1rem;
	margin-bottom: .1rem;
	margin-right: .1rem;
	padding: .12rem .25rem;
	transition: background-color .6s cubic-bezier(.38, 0, 0, 1), border-color .6s cubic-bezier(.38, 0, 0, 1)
}

#reference .banner .inner .top .part .tab>a:hover,
#reference .banner .inner .top .part .tab>a.on {
	background-color: #e27402;
	border-color: transparent
}

#reference .banner .inner .mid {
	background-color: #fff;
	grid-template-columns: repeat(3, 1fr);
	gap: .3rem;
	display: grid
}

#reference .banner .inner .mid .box .photo {
	height: 3rem;
	background-size: cover;
	border-radius: .2rem;
	margin-bottom: .2rem;
	transition: all .8s cubic-bezier(.38, 0, 0, 1);
	position: relative;
	overflow: hidden
}

#reference .banner .inner .mid .box .photo:after {
	content: "";
	pointer-events: none;
	opacity: 0;
	background-color: rgba(0, 0, 0, .2);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1)
}

#reference .banner .inner .mid .box .photo>.mask {
	pointer-events: none;
	opacity: 0;
	z-index: 2;
	background: linear-gradient(30deg, #e27402 5%, rgba(254, 219, 0, 0) 28%);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1);
	top: auto;
	bottom: -2px;
	left: -2px
}

#reference .banner .inner .mid .box .photo .btnIcon {
	width: .5rem;
	opacity: 0;
	z-index: 5;
	transition: width .6s cubic-bezier(.38, 0, 0, 1), opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#reference .banner .inner .mid .box .photo .btnIcon>.mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#reference .banner .inner .mid .box .photo .btnIcon>.mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#reference .banner .inner .mid .box .photo .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#reference .banner .inner .mid .box .photo .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#reference .banner .inner .mid .box .msg {
	padding: 0 1.2rem 0 .15rem;
	position: relative
}

#reference .banner .inner .mid .box .msg h3 {
	line-height: 1.2
}

#reference .banner .inner .mid .box .msg h4 {
	text-align: right;
	color: #232626;
	line-height: .8;
	position: absolute;
	top: 0;
	right: 0
}

#reference .banner .inner .mid .box .msg h4 small {
	color: #232626;
	margin-left: -.2em
}

@media screen and (orientation:landscape) {
	#reference .banner .inner .mid .box:hover .photo {
		box-shadow: 0 .3rem .6rem -5px rgba(35, 38, 38, .3)
	}

	#reference .banner .inner .mid .box:hover .photo:after,
	#reference .banner .inner .mid .box:hover .photo>.mask {
		opacity: 1
	}

	#reference .banner .inner .mid .box:hover .photo .btnIcon {
		width: 1.2rem;
		opacity: 1
	}

	#reference .banner .inner .mid .box:hover .photo .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#reference .banner .inner .mid .box:hover .photo .btnIcon .mask:after {
		opacity: 1
	}

	#reference .banner .inner .mid .box:hover .photo .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

#reference .banner .btm {
	position: relative
}

#reference .banner .btm .pager {
	z-index: 4;
	background-color: #fff;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	padding-bottom: .15em;
	padding-right: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#reference .banner .btm .pager>a {
	color: rgba(35, 38, 38, .5);
	width: .4rem;
	text-align: center;
	line-height: 1;
	transition: all .3s cubic-bezier(.38, 0, 0, 1)
}

#reference .banner .btm .pager>a.on {
	color: #232626
}

#reference .banner .btm .line {
	width: 100%;
	height: 1px;
	border-bottom: 1px dashed #292e2e
}

#reference .banner .btm .set {
	z-index: 4;
	background-color: #fff;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	padding-left: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#reference .banner .btm .set .layer-icon {
	width: .9rem;
	height: .9rem;
	background-color: #f2f2f2;
	border-radius: 50%;
	margin-left: .2rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#reference .banner .btm .set .layer-icon.disable>i {
	color: rgba(0, 0, 0, .3)
}

#resource .banner {
	background-color: #efefef
}

#resource .banner>.bg {
	background-color: #fff;
	position: absolute;
	height: 6.2rem !important;
	overflow: hidden !important
}

#resource .banner>.bg .img {
	width: 100%;
	display: block
}

#resource .banner>.bg .mask {
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(255, 255, 255, 0) 60%, #efefef 90%);
	position: absolute;
	top: 0;
	left: 0
}

#resource .banner .inner {
	padding-top: 5.2rem;
	padding-bottom: .8rem
}

#resource .banner .inner .til {
	-ms-flex-align: end;
	align-items: flex-end;
	margin-bottom: 1.5rem;
	position: relative
}

#resource .banner .inner .til h1 {
	padding-bottom: .1em;
	line-height: 1
}

#resource .banner .inner .til .searchBox {
	width: 7rem;
	height: .8rem;
	-webkit-backdrop-filter: blur(.2rem);
	-webkit-backdrop-filter: blur(.2rem);
	backdrop-filter: blur(.2rem);
	background-color: rgba(0, 0, 0, .07);
	border-radius: 1rem;
	padding: 0 0 0 .25rem
}

#resource .banner .inner .til .searchBox>input {
	height: 100%;
	width: calc(100% - 1rem);
	color: #1c1f1f;
	background-color: transparent;
	border: none
}

#resource .banner .inner .til .searchBox .subSearch {
	width: .8rem;
	height: .8rem;
	background-color: #e27402;
	border-radius: 50%
}

#resource .banner .inner .top {
	z-index: 12;
	grid-template-columns: 1fr 1fr;
	gap: 0 .2rem;
	display: grid;
	position: relative
}

#resource .banner .inner .top .part h2 {
	margin-bottom: .2rem
}

#resource .banner .inner .top .part .typeBox {
	height: 1.5rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	padding: 0 .5rem;
	position: relative
}

#resource .banner .inner .top .part .typeBox .inRow {
	height: 100%;
	width: 100%
}

#resource .banner .inner .top .part .typeBox .inRow .icon {
	height: .55rem;
	margin-right: .35rem
}

#resource .banner .inner .top .part .typeBox .items {
	width: 100%;
	z-index: 10;
	opacity: 0;
	pointer-events: none;
	background-color: #fff;
	border-bottom-right-radius: .2rem;
	border-bottom-left-radius: .2rem;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: calc(100% - .2rem);
	left: 0;
	overflow: hidden
}

#resource .banner .inner .top .part .typeBox .items .list {
	width: 100%;
	padding: .3rem .4rem;
	transition: background-color .3s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#resource .banner .inner .top .part .typeBox .items .list input[type=radio] {
	-webkit-appearance: none;
	-moz-appearance: none;
	opacity: 0;
	box-shadow: none;
	cursor: pointer;
	width: 100%;
	height: 100%;
	outline: none;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0
}

#resource .banner .inner .top .part .typeBox .items .list input[type=radio]:checked+.dot {
	border-color: #e27402
}

#resource .banner .inner .top .part .typeBox .items .list input[type=radio]:checked+.dot:after {
	opacity: 1
}

#resource .banner .inner .top .part .typeBox .items .list .dot {
	width: .2rem;
	height: .2rem;
	pointer-events: none;
	background: #f9f9f9;
	border: 1px solid #bcbcbc;
	border-radius: 50%;
	position: relative
}

#resource .banner .inner .top .part .typeBox .items .list .dot:after {
	content: "";
	opacity: 0;
	width: .1rem;
	height: .1rem;
	background-color: #e27402;
	border-radius: 50%;
	transition: opacity .3s cubic-bezier(.38, 0, 0, 1), transform .3s cubic-bezier(.38, 0, 0, 1);
	display: block
}

#resource .banner .inner .top .part .typeBox .items .list h3 {
	text-indent: 0;
	padding-left: .3rem;
	line-height: .56rem
}

#resource .banner .inner .top .part .typeBox .items .list:hover {
	background-color: #f7f7f7
}

#resource .banner .inner .top .part .typeBox .arrow {
	height: 100%;
	position: absolute;
	top: 0;
	right: .5rem
}

@media screen and (orientation:landscape) {
	#resource .banner .inner .top .part .typeBox:hover .items {
		opacity: 1;
		pointer-events: auto
	}
}

@media screen and (orientation:portrait) {
	#resource .banner .inner .top .part .typeBox.active .items {
		opacity: 1;
		pointer-events: auto
	}
}

#resource .banner .inner .line {
	padding: .6rem 0 .8rem
}

#resource .banner .inner .line .img {
	width: 100%;
	display: block
}

#resource .banner .inner .mid .group {
	margin-bottom: .9rem
}

#resource .banner .inner .mid .group h2 {
	margin-bottom: .35rem
}

#resource .banner .inner .mid .group .box-1 {
	grid-template-columns: repeat(3, 1fr);
	gap: .48rem .24rem;
	display: grid
}

#resource .banner .inner .mid .group .box-1 .box {
	border-radius: .18rem;
	-ms-flex-direction: column;
	flex-direction: column;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex;
	overflow: hidden
}

#resource .banner .inner .mid .group .box-1 .box .photo {
	height: 1.8rem;
	width: 100%;
	position: relative
}

#resource .banner .inner .mid .group .box-1 .box .photo .pic {
	width: 100%;
	height: calc(100% + .5rem);
	position: absolute;
	top: 0;
	left: 0
}

#resource .banner .inner .mid .group .box-1 .box .msg {
	z-index: 5;
	height: 1.2rem;
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	background-color: rgba(255, 255, 255, .8);
	padding: 0 .3rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#resource .banner .inner .mid .group .box-1 .box .msg h3 {
	width: calc(100% - 2.2rem)
}

#resource .banner .inner .mid .group .box-1 .box .msg .btnIcon {
	width: .6rem;
	cursor: pointer;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#resource .banner .inner .mid .group .box-1 .box .msg .btnIcon .mask {
	height: .6rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#resource .banner .inner .mid .group .box-1 .box .msg .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#resource .banner .inner .mid .group .box-1 .box .msg .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .6rem;
	transition: opacity .3s cubic-bezier(.38, 0, 0, 1), transform .3s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#resource .banner .inner .mid .group .box-1 .box .msg .btnIcon .layer-icon {
	height: .6rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	#resource .banner .inner .mid .group .box-1 .box:hover {
		box-shadow: 0 80px 120px rgba(0, 0, 0, .2)
	}

	#resource .banner .inner .mid .group .box-1 .box:hover .msg {
		background-color: #fff
	}

	#resource .banner .inner .mid .group .box-1 .box:hover .msg .btnIcon {
		width: 1.9rem;
		opacity: 1
	}

	#resource .banner .inner .mid .group .box-1 .box:hover .msg .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#resource .banner .inner .mid .group .box-1 .box:hover .msg .btnIcon .mask:after {
		opacity: 1
	}

	#resource .banner .inner .mid .group .box-1 .box:hover .msg .btnIcon .layer-icon {
		transform: translate(.6rem)
	}
}

#resource .banner .inner .mid .group .box-2 {
	grid-template-columns: repeat(2, 1fr);
	gap: .25rem .4rem;
	display: grid
}

#resource .banner .inner .mid .group .box-2 .box {
	height: .8rem;
	cursor: pointer;
	background-color: #fff;
	border: 1px solid rgba(254, 219, 0, 0);
	border-radius: .1rem;
	padding: 0 .2rem 0 .3rem;
	transition: border-color .5s cubic-bezier(.38, 0, 0, 1), box-shadow .5s cubic-bezier(.38, 0, 0, 1)
}

#resource .banner .inner .mid .group .box-2 .box .msg .img {
	margin-right: .2rem
}

#resource .banner .inner .mid .group .box-2 .box .msg h3 {
	transition: font-weight .3s cubic-bezier(.38, 0, 0, 1)
}

#resource .banner .inner .mid .group .box-2 .box .arrow {
	width: .6rem;
	height: .6rem;
	background-color: #eee;
	border-radius: 50%;
	position: relative;
	overflow: hidden
}

#resource .banner .inner .mid .group .box-2 .box .arrow:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#resource .banner .inner .mid .group .box-2 .box .arrow i {
	z-index: 5;
	position: relative
}

@media screen and (orientation:landscape) {
	#resource .banner .inner .mid .group .box-2 .box:hover {
		border-color: #e27402;
		box-shadow: 0 50px 80px rgba(0, 0, 0, .1)
	}

	#resource .banner .inner .mid .group .box-2 .box:hover .msg h3 {
		font-weight: 600
	}

	#resource .banner .inner .mid .group .box-2 .box:hover .arrow:after {
		opacity: 1
	}
}

#resource .banner .inner .mid .group .box-3 {
	grid-template-columns: repeat(2, 1fr);
	gap: .3rem;
	display: grid
}

#resource .banner .inner .mid .group .box-3 .box {
	cursor: pointer;
	border-radius: .2rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1);
	position: relative;
	overflow: hidden
}

#resource .banner .inner .mid .group .box-3 .box .pic {
	width: 100%;
	height: 0;
	padding-bottom: 55.6%;
	display: block
}

#resource .banner .inner .mid .group .box-3 .box .pic:before {
	content: "";
	opacity: 0;
	background: linear-gradient(transparent 60%, #000 100%);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#resource .banner .inner .mid .group .box-3 .box .pic:after {
	content: "";
	opacity: 1;
	background-color: rgba(0, 0, 0, .4);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#resource .banner .inner .mid .group .box-3 .box .msg {
	z-index: 5;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	padding: .4rem;
	display: -ms-flexbox;
	display: flex
}

#resource .banner .inner .mid .group .box-3 .box .msg h3 {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

#resource .banner .inner .mid .group .box-3 .box .msg .play {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	background-color: rgba(255, 255, 255, .7);
	border-radius: 50%;
	overflow: hidden
}

#resource .banner .inner .mid .group .box-3 .box .msg .play:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#resource .banner .inner .mid .group .box-3 .box .msg .play i {
	z-index: 5;
	position: relative
}

@media screen and (orientation:landscape) {
	#resource .banner .inner .mid .group .box-3 .box:hover {
		box-shadow: 0 90px 110px rgba(35, 38, 38, .15)
	}

	#resource .banner .inner .mid .group .box-3 .box:hover .pic:before {
		opacity: 1
	}

	#resource .banner .inner .mid .group .box-3 .box:hover .pic:after {
		opacity: 0
	}

	#resource .banner .inner .mid .group .box-3 .box:hover .msg .play:after {
		opacity: 1
	}

	#resource .banner .inner .mid .group .box-3 .box:hover .msg h3 {
		color: #e27402
	}
}

#contact .banner {
	background-color: #efefef;
	padding-bottom: 1.6rem 
}

#contact .banner>.bg {
	background-color: #fff;
	position: absolute;
	height: 5.6rem !important;
	overflow: hidden !important
}

#contact .banner>.bg .img {
	width: 100%;
	display: block
}

#contact .banner>.bg .mask {
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(255, 255, 255, 0) 60%, #efefef 95%);
	position: absolute;
	top: 0;
	left: 0
}

#contact .banner .inner {
	padding-top: 3.5rem;
	padding-bottom: .8rem
}

#contact .banner .inner .til {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: 2rem;
	padding-bottom: 0rem;
	position: relative
}

#contact .banner .inner .til h1 {
	line-height: 1;
	color: #fff;
}
#contact .banner .inner .til p{color: #fff;}
#contact .banner .inner .til .tabBox {
	width: 100%;
	margin-top: .3rem
}

#contact .banner .inner .til .tabBox .tabList {
	margin-right: .5rem
}

#contact .banner .inner .til .tabBox .tabList .iconfont {
	margin-right: .2rem
}

#contact .banner .inner .mid {
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

#contact .banner .inner .mid .left .box {
	grid-auto-flow: row;
	gap: .2rem 0;
	display: grid
}

#contact .banner .inner .mid .left .box .list {
	height: 1rem;
	width: 5rem;
	background-color: #fff;
	border-radius: .16rem
}

#contact .banner .inner .mid .left .box .list .mr {
	margin-right: .1rem
}

#contact .banner .inner .mid .left .box .list .gray {
	color: gray
}

#contact .banner .inner .mid .left .box .list .icon {
	width: 1.05rem;
	height: 100%;
	position: relative
}

#contact .banner .inner .mid .left .box .list .icon .dot {
	width: 6px;
	height: 6px;
	background-color: #000;
	border: 1px solid #000;
	border-radius: 50%;
	position: absolute;
	top: .15rem;
	left: .15rem
}

#contact .banner .inner .mid .left .box .list .icon .dot.mc {
	background-color: #e27402;
	border-color: #e27402
}

#contact .banner .inner .mid .left .box .list .icon .dot.gray {
	background-color: #a5a5a5;
	border-color: #a5a5a5
}

#contact .banner .inner .mid .left .box .list .icon .dot.clear {
	background-color: transparent;
	border-color: #101010
}

#contact .banner .inner .mid .left .box .list .icon>img {
	width: 42%;
	height: 30%;
	object-fit: contain
}

#contact .banner .inner .mid .left .box .list>em {
	line-height: .9
}

#contact .banner .inner .mid .left .box .list>small {
/* 	height: 3em;
	line-height: 5em; */
	font-size: inherit;
	color: inherit;
	font-family: inherit
}

#contact .banner .inner .mid .right {
	height: 6.3rem;
	position: relative
}

#contact .banner .inner .mid .right .map {
	height: 6.3rem;
	position: absolute;
	top: 0;
	left: -1.5rem;
	z-index: -1;
}

#contact .r1 {
	background-color: #efefef;
	padding-bottom: 1.5rem
}

#contact .r1 .inner .top {
	height: .7rem;
	-ms-flex-align: end;
	align-items: flex-end
}

#contact .r1 .inner .top .tab {
	cursor: pointer;
	background-color: #d9d9d9;
	border-radius: .2rem .2rem 0 0;
	margin-left: -.2rem;
	padding: .16rem .8rem;
	transition: all .3s cubic-bezier(.38, 0, 0, 1)
}

#contact .r1 .inner .top .tab:first-of-type {
	margin-left: 0
}

#contact .r1 .inner .top .tab.on {
	z-index: 10;
	background-color: #fff;
	padding-top: .3rem
}

#contact .r1 .inner .top .tab.on .dotFn:before {
	width: .12rem;
	opacity: 1;
	transform: skew(-10deg)
}

#contact .r1 .inner .group {
	width: 100%;
	background-color: #fff;
	border-radius: 0 .2rem .2rem;
	position: relative
}

#contact .r1 .inner .group .tabBox {
	opacity: 0;
	pointer-events: none;
	padding-bottom: .8rem;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1);
	display: block
}

#contact .r1 .inner .group .tabBox.on {
	opacity: 1;
	pointer-events: auto !important
}

#contact .r1 .inner .group .tabBox h2 {
	padding: .9rem 0 .6rem
}

#contact .r1 .inner .group .tabBox .form {
	width: 100%;
	padding: 0 1.8rem
}

#contact .r1 .inner .group .tabBox .form .inRow {
	width: 100%;
	grid-template-columns: repeat(2, 1fr);
	gap: .2rem;
	margin-bottom: .1rem;
	display: grid;
	position: relative
}

#contact .r1 .inner .group .tabBox .form .inRow:nth-of-type(3) {
    grid-template-columns: repeat(1, 1fr);
    gap: 0;
}
.incontacttitlebox{position: relative;}
.incontacttitle{text-align: center;}



#contact .r1 .inner .group .tabBox .form .inRow h3 {
	margin-bottom: 5px;
	line-height: 1.3
}

#contact .r1 .inner .group .tabBox .form .inRow .inTxt {
	height: .6rem;
	border-radius: .08rem;
	position: relative
}

#contact .r1 .inner .group .tabBox .form .inRow .inTxt>input[type=text] {
	width: 100%;
	height: 100%;
	text-indent: 0;
	background-color: #efefef;
	border: 1px solid transparent;
	border-radius: .08rem;
	padding: 0 .2rem;
	transition: all .5s cubic-bezier(.38, 0, 0, 1);
	display: block;
	overflow: hidden
}

#contact .r1 .inner .group .tabBox .form .inRow .inTxt>input[type=text]::-ms-input-placeholder {
	color: #1c1f1f;
	font-size: .625vw
}

#contact .r1 .inner .group .tabBox .form .inRow .inTxt>input[type=text]::placeholder {
	color: #1c1f1f;
	font-size: .625vw
}

#contact .r1 .inner .group .tabBox .form .inRow .inTxt>input[type=text]:focus {
	background-color: #fff;
	border-color: #e27402
}

#contact .r1 .inner .group .tabBox .form .inRow .inTxt .must {
	color: #000;
	font-size: .2rem;
	position: absolute;
	top: .04rem;
	left: .12rem
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown {
	height: .6rem;
	position: relative
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown.active {
	z-index: 100
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown.active .input-text>input[type=text] {
	background-color: #fff;
	border-color: #e27402
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown .input-text {
	height: .6rem;
	width: 100%;
	cursor: pointer;
	border: none;
	position: relative
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown .input-text>input[type=text] {
	height: 100%;
	text-indent: 0;
	width: 100%;
	pointer-events: none;
	text-align: center;
	background-color: #efefef;
	border: 1px solid transparent;
	border-radius: .12rem;
	padding: 0 .2rem;
	transition: all .3s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown .input-text .arrow {
	width: 0;
	height: 0;
	transform-origin: 0 20%;
	z-index: 10;
	border: 5px solid transparent;
	border-top-color: #1c1f1f;
	margin: auto 0;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 5px;
	bottom: 0;
	right: .2rem
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown .childDown {
	width: 100%;
	max-height: calc(1.04167vw + 2rem);
	background-color: #fff;
	border-bottom: 1px solid #e27402;
	border-left: 1px solid #e27402;
	border-right: 1px solid #e27402;
	border-bottom-right-radius: .18rem;
	border-bottom-left-radius: .18rem;
	padding: .1rem .2rem;
	display: none;
	position: absolute;
	top: calc(100% - .08rem);
	left: 0;
	overflow: auto
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown .childDown>li {
	width: 100%
}

#contact .r1 .inner .group .tabBox .form .inRow .inDown .childDown>li>span {
	width: 100%;
	cursor: pointer;
	line-height: .4rem;
	display: block
}

#contact .r1 .inner .group .tabBox .form .inRow .inArea {
	width: 100%;
	background-color: #efefef;
	border-radius: .08rem;
	padding: .2rem
}

#contact .r1 .inner .group .tabBox .form .inRow .inArea textarea {
	width: 100%;
	text-indent: 0;
	background-color: transparent;
	border: none;
	display: block
}

#contact .r1 .inner .group .tabBox .form .inRow .inArea textarea::-ms-input-placeholder {
	color: rgba(28, 31, 31, .5);
	font-size: .625vw
}

#contact .r1 .inner .group .tabBox .form .inRow .inArea textarea::placeholder {
	color: rgba(28, 31, 31, .5);
	font-size: .625vw
}

#contact .r1 .inner .group .tabBox .form .inRow .inChk {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: center;
	align-items: center;
	padding-top: .4rem;
	display: -ms-flexbox;
	display: flex
}

#contact .r1 .inner .group .tabBox .form .inRow .inChk input[type=checkbox] {
	--active: #e27402;
	--active-inner: #fff;
	--background: #fff;
	--border: #bbc1e1;
	width: .16rem;
	height: .16rem;
	cursor: pointer;
	border: 1px solid var(--bc, var(--border));
	background: var(--b, var(--background));
	-webkit-appearance: none;
	-moz-appearance: none;
	border-radius: .05rem;
	outline: none;
	margin: 0;
	position: relative
}

#contact .r1 .inner .group .tabBox .form .inRow .inChk input[type=checkbox]:after {
	content: "";
	width: .05rem;
	height: .09rem;
	border: 2px solid var(--active-inner);
	border-top: 0;
	border-left: 0;
	display: block;
	position: absolute;
	top: .02rem;
	left: .05rem;
	transform: rotate(43deg)
}

#contact .r1 .inner .group .tabBox .form .inRow .inChk input[type=checkbox]:checked {
	--b: var(--active);
	--bc: var(--active)
}

#contact .r1 .inner .group .tabBox .form .inRow .inChk input[type=checkbox]+label {
	vertical-align: top;
	white-space: nowrap;
	cursor: pointer;
	margin-left: .1rem;
	display: inline-block
}

#contact .r1 .inner .group .tabBox .form .inRow .inChk p {
	width: 100%;
	padding-top: .12rem;
	padding-left: .26rem
}

#contact .r1 .inner .group .tabBox .form .btm {
	width: 100%;
	margin-top: .5rem
}

#contact .r1 .inner .group .tabBox .form .btm .layer-btn {
	padding: 0 .55rem
}

#contact .r1 .inner .group .tabBox .form .loadMk {
	z-index: 50;
	opacity: 0;
	pointer-events: none;
	background-color: rgba(255, 255, 255, .8);
	border-radius: .18rem;
	transition: opacity .3s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden
}

#contact .r1 .inner .group .tabBox .form .loadMk .loader {
	width: 1rem
}

#contact .r1 .inner .group .tabBox .form .loadMk.active {
	opacity: 1
}

.solarInner {
	background-color: #fff
}

.solarInner .AT_r1 {
	padding-top: 1rem
}

.solarInner .AT_r1 .bg .img {
	height: 8.38rem;
	left: 55%
}

.solarInner .AT_r1 .inner {
	height: 8.38rem
}

.solarInner .AT_r1 .inner h3 {
	line-height: 1.3
}

.solarInner .AT_r2 {
	padding-top: 1.2rem;
	padding-bottom: 1.8rem
}

.solarInner .AT_r2 .inner .top {
	margin-bottom: 1.2rem
}

.solarInner .AT_r2 .inner .mid {
	width: 100%
}

.solarInner .AT_r2 .inner .mid .group {
	width: 100%;
	margin-bottom: .9rem
}

.solarInner .AT_r2 .inner .mid .group:last-of-type {
	margin-bottom: 0
}

.solarInner .AT_r2 .inner .mid .group .col {
	width: 50%;
	background-color: #1b1d21;
	border-radius: .28rem;
	padding: .6rem .5rem;
	overflow: hidden
}

.solarInner .AT_r2 .inner .mid .group .col .box {
	height: 3.2rem;
	width: 100%;
	border: 1px dashed rgba(255, 255, 255, .6);
	border-radius: .16rem;
	position: relative
}

.solarInner .AT_r2 .inner .mid .group .col .box .pic {
	background-size: auto 64%
}

.solarInner .AT_r2 .inner .mid .group .col .box .pic video {
	width: 72%;
	mix-blend-mode: lighten;
	margin: 0 auto;
	display: block
}

.solarInner .AT_r2 .inner .mid .group .col .box .pic .MediaTsApp {
	width: 72%;
	height: 88%;
	mix-blend-mode: lighten;
	display: block
}

.solarInner .AT_r2 .inner .mid .group .col .box h4 {
	text-align: center;
	white-space: nowrap;
	background-color: #1c1e21;
	padding: 0 .2rem;
	position: absolute;
	bottom: -.5em;
	left: 50%;
	transform: translate(-50%)
}

.solarInner .AT_r2 .inner .mid .group .msg {
	width: 50%;
	padding: 0 .4rem
}

.solarInner .AT_r2 .inner .mid .group:nth-of-type(2n+1) .msg {
	padding-right: 0
}

.solarInner .AT_r3 .bg .pic {
	opacity: 0;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	transform: scale(1.05)
}

.solarInner .AT_r3 .bg .pic .video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block
}

.solarInner .AT_r3 .bg .pic .MediaTs {
	width: 231.01vw;
	height: 130vw;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%)
}

.solarInner .AT_r3 .bg .pic.on {
	opacity: 1;
	transform: none
}

.solarInner .AT_r3 .inner {
	height: 100vh;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .8rem 0;
	display: -ms-flexbox;
	display: flex
}

.solarInner .AT_r3 .inner .top {
	width: 100%;
	-ms-flex-align: start;
	align-items: flex-start
}

.solarInner .AT_r3 .inner .top>p {
	width: 50%
}

.solarInner .AT_r3 .inner .top>p .dot {
	width: 7px;
	height: 7px;
	vertical-align: middle;
	background-color: #e27402;
	border-radius: 50%;
	margin-right: .1rem;
	display: inline-block
}

.solarInner .AT_r3 .inner .mid {
	width: 100%;
	grid-auto-flow: column;
	-ms-flex-align: end;
	align-items: end;
	display: grid
}

@media screen and (orientation:landscape) {
	.solarInner .AT_r3 .inner .mid {
		grid-template-columns: repeat(4, 1fr);
		gap: 0 .25rem
	}
}

.solarInner .AT_r3 .inner .mid .chunk {
	cursor: pointer;
	padding: 0 .2rem 0 .3rem;
	position: relative
}

.solarInner .AT_r3 .inner .mid .chunk .mask {
	-webkit-backdrop-filter: blur(.2rem);
	-webkit-backdrop-filter: blur(.2rem);
	backdrop-filter: blur(.2rem);
	transform-origin: 50% 100%;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .5);
	border-radius: .18rem;
	transition: height .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: 0;
	left: 0
}

.solarInner .AT_r3 .inner .mid .chunk .pic {
	width: 1.2rem;
	height: .85rem;
	z-index: 10;
	background-size: contain;
	margin-right: .15rem;
	position: relative
}

.solarInner .AT_r3 .inner .mid .chunk h3 {
	z-index: 10;
	white-space: nowrap;
	height: 1.4rem;
	line-height: 1.2;
	transition: height .5s cubic-bezier(.38, 0, 0, 1), color .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	.solarInner .AT_r3 .inner .mid .chunk.on h3 {
		height: 1.8rem;
		color: #e27402
	}
}

@media screen and (orientation:portrait) {
	.solarInner .AT_r3 .inner .mid .chunk.swiper-slide-active h3 {
		height: 1.8rem;
		color: #e27402
	}
}

.solarInner .AT_r4 {
	padding-bottom: .6rem
}

.solarInner .AT_r4 .inner {
	padding-top: 1.4rem
}

.solarInner .AT_r4 .inner .group {
	position: relative
}

.solarInner .AT_r4 .inner .group>img {
	width: 100%;
	display: block
}

.solarInner .AT_r4 .inner .group .msg {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: 5% 52% 0 1.3rem;
	display: -ms-flexbox;
	display: flex
}

.solarInner .AT_r4 .inner .group .msg h2 {
	margin-bottom: 1rem;
	line-height: 1.16
}

.solarInner .AT_r4 .inner .group .msg .items .list {
	margin-bottom: .4rem
}

.solarInner .AT_r4 .inner .group .msg .items .list>img {
	width: .6rem;
	margin-right: .4rem
}

.solarInner .AT_r4 .inner .group .msg .items .list:last-of-type {
	margin-bottom: 0
}

.solarInner .AT_r4 .inner .top {
	margin-bottom: .5rem
}

.solarInner .AT_r4 .inner .part {
	background-color: #111214;
	border: 2px dashed #e27402;
	border-radius: .28rem;
	grid-template-columns: repeat(2, 1fr);
	display: grid;
	overflow: hidden
}

.solarInner .AT_r4 .inner .part .img {
	mix-blend-mode: screen;
	height: 7rem
}

.solarInner .AT_r4 .inner .part .box {
	padding: .7rem .7rem .7rem 0
}

.solarInner .AT_r4 .inner .part .box>.list {
	background-color: #1e2024;
	border-radius: .16rem;
	margin-bottom: .2rem;
	padding: .5rem
}

.solarInner .AT_r4 .inner .part .box>.list:last-of-type {
	margin-bottom: 0
}

.solarInner .AT_r4 .inner .part .box>.list h3 {
	margin-bottom: .2rem
}

.solarInner .AT_r4 .inner .part .box>.list .layer-item>.list {
	margin-bottom: .07rem
}

.solarInner .AT_r4 .inner .part .box>.list .layer-item>.list:last-of-type {
	margin-bottom: 0
}

.solarInner .AT_r5 {
	overflow: hidden
}

.solarInner .AT_r5 .bg .mask:before {
	content: "";
	width: 100%;
	height: 100%;
	background: linear-gradient(#111214 0%, rgba(17, 18, 20, 0) 50%);
	position: absolute;
	top: 0;
	left: 0
}

.solarInner .AT_r5 .bg .mask:after {
	content: "";
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(17, 18, 20, 0) 50%, #111214 100%);
	position: absolute;
	top: 0;
	left: 0
}

.solarInner .AT_r5 .inner {
	height: 100vh
}

.solarInner .AT_r5 .inner .box {
	width: 50%;
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-left: 50%;
	padding-right: .9rem;
	display: -ms-flexbox;
	display: flex
}

.solarInner .AT_r5 .inner .box h2 {
	margin-bottom: .6rem;
	line-height: 1.1
}

.solarInner .AT_r5 .inner .box h2 small {
	font-family: inherit;
	font-size: inherit;
	background: linear-gradient(170deg, #fff, #ffeb00, #e27402);
	-webkit-background-clip: text;
	color: transparent;
	-webkit-background-clip: text;
	-webkit-background-clip: text;
	background-clip: text;
	display: block
}

.solarInner .AT_r5 .inner .box .layer-item>.list {
	margin-bottom: .3rem
}

.solarInner .AT_r5 .inner .box .layer-item>.list:last-of-type {
	margin-bottom: 0
}

.solarInner .AT_r6 {
	padding-bottom: 1.6rem
}

.solarInner .AT_r6 .inner .top {
	margin-bottom: .75rem
}

.solarInner .AT_r6 .inner .mid {
	grid-auto-flow: column;
	display: grid
}

@media screen and (orientation:landscape) {
	.solarInner .AT_r6 .inner .mid {
		-ms-flex-pack: center;
		justify-content: center;
		gap: 0 .24rem
	}
}

.solarInner .AT_r6 .inner .mid .part {
	width: 4.8rem;
	background-color: #fff;
	border-radius: .2rem;
	padding-bottom: 1.8rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

.solarInner .AT_r6 .inner .mid .part h2 {
	padding: .5rem .6rem .3rem;
	transition: all .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .AT_r6 .inner .mid .part .pic {
	height: 2rem;
	width: 100%;
	background-size: auto 50%
}

.solarInner .AT_r6 .inner .mid .part h3 {
	margin-top: .2rem;
	margin-bottom: .2rem;
	padding: 0 .6rem
}

.solarInner .AT_r6 .inner .mid .part p {
	padding: 0 .6rem
}

.solarInner .AT_r6 .inner .mid .part .line {
	border-bottom: 1px dashed rgba(0, 0, 0, .5);
	margin: .2rem .6rem;
	display: block
}

.solarInner .AT_r6 .inner .mid .part .items {
	padding: 0 .6rem
}

.solarInner .AT_r6 .inner .mid .part .items>li {
	color: rgba(60, 65, 65, .8);
	padding: 5px 0 5px 1em;
	line-height: 1.2;
	position: relative
}

.solarInner .AT_r6 .inner .mid .part .items>li em {
	line-height: .8em;
	position: absolute;
	top: 0;
	left: 0
}

.solarInner .AT_r6 .inner .mid .part .layer-btn {
	width: 1.8rem;
	height: .64rem;
	border: 4px solid rgba(35, 38, 38, .2);
	margin: 0 auto;
	transition: border-color .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: .45rem;
	left: 0;
	right: 0
}

.solarInner .AT_r6 .inner .mid .part .layer-btn .mk {
	opacity: 0
}

.solarInner .AT_r6 .inner .mid .part .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .AT_r6 .inner .mid .part .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

@media screen and (orientation:landscape) {
	.solarInner .AT_r6 .inner .mid .part:hover {
		transform: translateY(-2%);
		box-shadow: 0 80px 120px rgba(0, 0, 0, .2)
	}

	.solarInner .AT_r6 .inner .mid .part:hover h2 {
		font-family: Noto Sans SC;
		font-weight: 700
	}

	.solarInner .AT_r6 .inner .mid .part:hover .layer-btn {
		border-color: rgba(35, 38, 38, 0)
	}

	.solarInner .AT_r6 .inner .mid .part:hover .layer-btn .mk {
		opacity: 1
	}

	.solarInner .AT_r6 .inner .mid .part:hover .layer-btn .txt {
		transform: translate(-.15rem)
	}

	.solarInner .AT_r6 .inner .mid .part:hover .layer-btn .iconfont {
		opacity: 1;
		transform: translate(.03rem)rotate(45deg)
	}
}

.solarInner .simple_r1 {
	width: 100%;
	height: 800vh;
	background-color: #010101
}

.solarInner .simple_r1 .inner {
	position: sticky !important
}

.solarInner .simple_r1 .inner .cv {
	width: 100%;
	padding-bottom: 56.25%
}

.solarInner .simple_r1 .inner .group {
	height: 100%;
	position: relative
}

.solarInner .simple_r1 .inner .group .cvPart {
	opacity: 0;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1), transform .7s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex;
	transform: translateY(10%)
}

.solarInner .simple_r1 .inner .group .cvPart h2 {
	background: linear-gradient(170deg, #ffeb00, #e27402);
	-webkit-background-clip: text;
	color: transparent;
	width: 50%;
	-webkit-background-clip: text;
	-webkit-background-clip: text;
	background-clip: text;
	margin-bottom: .2rem;
	line-height: 1.2
}

.solarInner .simple_r1 .inner .group .cvPart p {
	width: 50%
}

.solarInner .simple_r1 .inner .group .cvPart:nth-of-type(2n) h2,
.solarInner .simple_r1 .inner .group .cvPart:nth-of-type(2n) p {
	width: 45%;
	margin-left: 55%
}

.solarInner .simple_r1 .inner .group .cvPart.on {
	opacity: 1;
	transform: none
}

.solarInner .simple_r2 {
	padding-bottom: 1.6rem
}

.solarInner .simple_r2 .bg .pro {
	width: 96%;
	opacity: .3;
	height: 45%;
	object-fit: contain;
	position: absolute;
	top: 8%;
	left: 2%
}

.solarInner .simple_r2 .inner {
	padding-top: 2.2rem
}

.solarInner .simple_r2 .inner h2 {
	margin-bottom: 1.4rem
}

.solarInner .simple_r2 .inner .group {
	grid-template-rows: 3rem;
	grid-template-columns: repeat(4, 1fr);
	gap: 0 .2rem;
	margin-bottom: 1rem;
	display: grid
}

.solarInner .simple_r2 .inner .group .box {
	border-radius: .2rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	overflow: hidden
}

.solarInner .simple_r2 .inner .group .box .mask {
	-webkit-backdrop-filter: blur(.2rem);
	-webkit-backdrop-filter: blur(.2rem);
	backdrop-filter: blur(.2rem);
	background-color: rgba(0, 0, 0, .05)
}

.solarInner .simple_r2 .inner .group .box>p {
	z-index: 4;
	text-align: center;
	position: relative
}

.solarInner .simple_r2 .inner .group .box>p .count {
	letter-spacing: -.08em
}

.solarInner .simple_r2 .inner .group .box>p small {
	vertical-align: baseline;
	margin-right: .2rem
}

.solarInner .simple_r2 .inner .group .box>p sup {
	font-size: inherit;
	vertical-align: baseline
}

.solarInner .simple_r2 .inner .group .box>p sub {
	vertical-align: baseline;
	margin-left: .05em;
	line-height: 1
}

.solarInner .simple_r2 .inner .group .box h3 {
	z-index: 3;
	margin-top: .3rem;
	position: relative
}

.solarInner .simple_r2 .inner .part {
	height: 3rem;
	background-color: #1f1f1f;
	border-radius: .2rem;
	position: relative;
	box-shadow: 0 3.07292vw 4.21875vw rgba(0, 0, 0, .15)
}

.solarInner .simple_r2 .inner .part .img {
	width: 45%;
	position: absolute;
	bottom: 0;
	left: 0
}

.solarInner .simple_r2 .inner .part .msg {
	width: 50%;
	-ms-flex-align: end;
	align-items: flex-end;
	margin-left: 50%;
	padding-right: .9rem
}

.solarInner .simple_r2 .inner .part .msg small {
	display: block
}

.solarInner .simple_r2 .inner .part .msg h4 {
	line-height: 1
}

.solarInner .simple_r2 .inner .btm {
	padding-top: .6rem
}

.solarInner .simple_r2 .inner .btm .img {
	max-width: 100%;
	margin: 0 auto;
	display: block
}

.solarInner .simple_r3 {
	background-color: #efefef;
	padding: 1.5rem 0
}

.solarInner .simple_r3 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

.solarInner .simple_r3 .inner .top .topic,
.solarInner .simple_r3 .inner .top .msg {
	width: 50%
}

.solarInner .simple_r3 .inner .top .msg p {
	margin-bottom: .3rem
}

.solarInner .simple_r3 .inner .mid .swiper {
	position: relative
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-wrapper .swiper-slide {
	width: 100%
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-wrapper .swiper-slide .pic {
	width: 100%;
	border-radius: .2rem;
	padding-bottom: 64%
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-wrapper .swiper-slide h3 {
	white-space: nowrap;
	height: .6rem;
	padding-top: .3rem
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-button-prev {
	width: .9rem;
	height: .9rem;
	cursor: pointer;
	background-color: #666;
	border-radius: 50%;
	margin: auto 0;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	bottom: .6rem;
	left: -.45rem
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-button-prev .iconfont {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-button-prev:hover {
	background-color: #e27402
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-button-prev:hover .iconfont {
	color: #232626
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-button-next {
	width: .9rem;
	height: .9rem;
	cursor: pointer;
	background-color: #666;
	border-radius: 50%;
	margin: auto 0;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	bottom: .6rem;
	right: -.45rem
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-button-next .iconfont {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-button-next:hover {
	background-color: #e27402
}

.solarInner .simple_r3 .inner .mid .swiper .swiper-button-next:hover .iconfont {
	color: #232626
}

.solarInner .simple_r4 {
	overflow: hidden
}

.solarInner .simple_r4 .bg {
	background-color: #000
}

.solarInner .simple_r4 .bg .pic {
	opacity: .6
}

.solarInner .simple_r4 .inner {
	height: 100vh;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-top: 1.6rem;
	display: -ms-flexbox;
	display: flex
}

.solarInner .simple_r4 .inner .group {
	width: 6rem;
	padding: 1.6rem 0 2rem
}

.solarInner .simple_r4 .inner .group>p {
	margin-bottom: .5rem
}

.solarInner .simple_r5 {
	width: 100%;
	overflow: hidden
}

.solarInner .simple_r5 .inner {
	height: 100vh;
	padding-top: 1.5rem
}

.solarInner .simple_r5 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

.solarInner .simple_r5 .inner .top .topic,
.solarInner .simple_r5 .inner .top .msg {
	width: 50%
}

.solarInner .simple_r5 .inner .top .msg p {
	margin-bottom: .3rem
}

.solarInner .simple_r6 {
	background-color: #efefef;
	padding: 1.7rem 0
}

.solarInner .simple_r6 .inner {
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

.solarInner .simple_r7 {
	padding-top: 1.5rem;
	padding-bottom: 1.3rem;
	overflow: hidden
}

.solarInner .simple_r7 .inner .topic {
	margin-bottom: 1.8rem
}

.solarInner .simple_r7 .inner .mid {
	grid-template-columns: repeat(2, 1fr);
	gap: .2rem;
	display: grid
}

.solarInner .simple_r7 .inner .mid .box {
	height: 1.3rem;
	background-color: #fff;
	border-radius: .16rem;
	padding-left: .5rem;
	padding-right: .4rem;
	overflow: hidden
}

.solarInner .simple_r7 .inner .mid .box .img {
	width: .5rem;
	height: .5rem;
	object-fit: contain
}

.solarInner .simple_r7 .inner .mid .box .msg {
	padding-left: .45rem
}

.solarInner .simple_r7 .inner .mid .box .msg h3 {
	margin-bottom: .06rem
}

.solarInner .simple_r8 {
	background-color: #efefef;
	padding-top: 1.4rem;
	padding-bottom: .7rem
}

.solarInner .simple_r8 .inner {
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: .36rem;
	padding: 1.2rem 1rem 1rem;
	overflow: hidden
}

.solarInner .simple_r8 .inner h2 {
	width: 100%;
	margin-bottom: .2rem;
	line-height: 1.2
}

.solarInner .simple_r8 .inner h2 small {
	display: block
}

.solarInner .simple_r8 .inner .layer-item {
	margin-top: .5rem
}

.solarInner .simple_r8 .inner .layer-item .list {
	margin-bottom: .15rem
}

.solarInner .simple_r8 .inner .layer-item .list:last-of-type {
	margin-bottom: 0
}

.solarInner .simple_r8 .inner .layer-item p {
	color: #fff
}

.solarInner .simple_r8 .inner .btm {
	padding-top: .6rem
}

.solarInner .simple_r8 .inner .btm .layer-btn {
	width: 1.6rem
}

.solarInner .simple_r8 .inner .btm .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .simple_r8 .inner .btm .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

.solarInner .simple_r8 .inner .btm .layer-btn:hover .txt {
	transform: translate(-.15rem)
}

.solarInner .simple_r8 .inner .btm .layer-btn:hover .iconfont {
	opacity: 1;
	transform: translate(.03rem)rotate(45deg)
}

.solarInner .simple_r9 {
	background-color: #efefef;
	padding-top: .7rem
}

.solarInner .simple_r9 .inner {
	padding: .6rem 0
}

.solarInner .simple_r9 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

.solarInner .simple_r9 .inner .top .topic,
.solarInner .simple_r9 .inner .top .msg {
	width: 50%
}

.solarInner .simple_r9 .inner .top .msg p {
	margin-bottom: .3rem
}

.solarInner .simple_r9 .inner .mid {
	grid-template-columns: repeat(2, 1fr);
	gap: .38rem;
	display: grid
}

.solarInner .simple_r9 .inner .mid .box {
	height: 5rem;
	border-radius: .2rem;
	overflow: hidden
}

.solarInner .simple_r9 .inner .mid .box .pic {
	width: 100%;
	height: 100%;
	display: block
}

.solarInner .rowReference {
	background-color: #efefef;
	padding-top: .7rem
}

.solarInner .rowReference .inner {
	padding-bottom: 1.3rem
}

.solarInner .rowReference .inner .mid {
	overflow: hidden
}

.solarInner .rowReference .inner .mid .referenceSw {
	width: 100%;
	padding-top: 1rem;
	transition-timing-function: cubic-bezier(.38, 0, 0, 1)
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide {
	width: 46vw
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo {
	height: 3rem;
	background-size: cover;
	border-radius: .2rem;
	margin-bottom: .2rem;
	transition: all .8s cubic-bezier(.38, 0, 0, 1);
	position: relative;
	overflow: hidden
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo:after {
	content: "";
	pointer-events: none;
	opacity: 0;
	background-color: rgba(0, 0, 0, .2);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo>.mask {
	pointer-events: none;
	opacity: 0;
	z-index: 2;
	background: linear-gradient(30deg, #e27402 5%, rgba(254, 219, 0, 0) 28%);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1);
	top: auto;
	bottom: -2px;
	left: -2px
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo .btnIcon {
	width: .5rem;
	opacity: 0;
	z-index: 5;
	transition: width .6s cubic-bezier(.38, 0, 0, 1), opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo .btnIcon>.mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .photo .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .msg {
	padding: 0 .15rem;
	position: relative
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .msg h3 {
	line-height: 1.2
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .msg h4 {
	text-align: right;
	color: #232626;
	line-height: .8;
	position: absolute;
	top: 0;
	right: 0
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide .msg h4 small {
	color: #232626;
	margin-left: -.2em
}

@media screen and (orientation:landscape) {
	.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide:hover .photo {
		box-shadow: 0 .3rem .6rem -5px rgba(35, 38, 38, .3)
	}

	.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide:hover .photo:after,
	.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide:hover .photo>.mask {
		opacity: 1
	}

	.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide:hover .photo .btnIcon {
		width: 1.2rem;
		opacity: 1
	}

	.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .mask:after {
		opacity: 1
	}

	.solarInner .rowReference .inner .mid .referenceSw .swiper-wrapper .swiper-slide:hover .photo .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-button-prev {
	height: .9rem;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 1.1rem
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	opacity: .4;
	background-color: #f5f5f5;
	border-radius: 50%;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-button-prev .layer-icon:hover {
	opacity: 1
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-button-next {
	height: .9rem;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	opacity: .4;
	background-color: #f5f5f5;
	border-radius: 50%;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .rowReference .inner .mid .referenceSw .swiper-button-next .layer-icon:hover {
	opacity: 1
}

.solarInner .rowMore {
	padding-top: 1.5rem;
	padding-bottom: .8rem
}

.solarInner .rowMore .inner .top {
	margin-bottom: .75rem
}

.solarInner .rowMore .inner .mid {
	grid-auto-flow: column;
	display: grid
}

@media screen and (orientation:landscape) {
	.solarInner .rowMore .inner .mid {
		-ms-flex-pack: center;
		justify-content: center;
		gap: 0 .24rem
	}
}

.solarInner .rowMore .inner .mid .part {
	width: 4.8rem;
	background-color: #fff;
	border-radius: .2rem;
	padding-bottom: 1.8rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

.solarInner .rowMore .inner .mid .part h2 {
	padding: .5rem .6rem .3rem;
	transition: all .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .rowMore .inner .mid .part .pic {
	height: 2rem;
	width: 100%;
	background-size: auto 50%
}

.solarInner .rowMore .inner .mid .part h3 {
	margin-top: .2rem;
	margin-bottom: .2rem;
	padding: 0 .6rem
}

.solarInner .rowMore .inner .mid .part p {
	padding: 0 .6rem
}

.solarInner .rowMore .inner .mid .part .line {
	border-bottom: 1px dashed rgba(0, 0, 0, .5);
	margin: .2rem .6rem .4rem;
	display: block
}

.solarInner .rowMore .inner .mid .part .items {
	padding: 0 .6rem
}

.solarInner .rowMore .inner .mid .part .items>li {
	color: rgba(60, 65, 65, .8);
	padding: .1rem 0 .1rem 1em;
	line-height: 1.2;
	position: relative
}

.solarInner .rowMore .inner .mid .part .items>li .icon {
	width: .26rem;
	height: .28rem;
	object-fit: contain;
	margin-right: .15rem
}

.solarInner .rowMore .inner .mid .part .items>li em {
	line-height: .8em;
	position: absolute;
	top: 0;
	left: 0
}

.solarInner .rowMore .inner .mid .part .layer-btn {
	width: 1.8rem;
	height: .64rem;
	border: 4px solid rgba(35, 38, 38, .2);
	margin: 0 auto;
	transition: border-color .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: .45rem;
	left: 0;
	right: 0
}

.solarInner .rowMore .inner .mid .part .layer-btn .mk {
	opacity: 0
}

.solarInner .rowMore .inner .mid .part .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

.solarInner .rowMore .inner .mid .part .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

.solarInner .rowMore .inner .mid .part .note {
	width: 100%;
	height: .64rem;
	text-align: center;
	margin: 0 auto;
	position: absolute;
	bottom: .45rem;
	left: 0;
	right: 0
}

@media screen and (orientation:landscape) {
	.solarInner .rowMore .inner .mid .part:hover {
		z-index: 10
	}

	.solarInner .rowMore .inner .mid .part:hover h2 {
		font-family: Noto Sans SC;
		font-weight: 700
	}

	.solarInner .rowMore .inner .mid .part:hover .layer-btn {
		border-color: rgba(35, 38, 38, 0)
	}

	.solarInner .rowMore .inner .mid .part:hover .layer-btn .mk {
		opacity: 1
	}

	.solarInner .rowMore .inner .mid .part:hover .layer-btn .txt {
		transform: translate(-.15rem)
	}

	.solarInner .rowMore .inner .mid .part:hover .layer-btn .iconfont {
		opacity: 1;
		transform: translate(.03rem)rotate(45deg)
	}
}

@media screen and (orientation:portrait) {
	.solarInner .rowMore .inner .mid .part {
		transition: transform .7s ease-in-out;
		transform: scale(.9);
		box-shadow: 0 .1rem .3rem -5px rgba(0, 0, 0, .15)
	}

	.solarInner .rowMore .inner .mid .part.swiper-slide-active {
		z-index: 10;
		transform: scale(1)
	}
}

#at-3 {
	width: 100%;
	background-color: #111214;
	overflow: hidden
}

#at-3 .banner {
	overflow: hidden
}

#at-3 .banner .bg .mask:before {
	content: "";
	width: 100%;
	height: 100%;
	background: linear-gradient(#111214 0%, rgba(17, 18, 20, 0) 50%);
	position: absolute;
	top: 0;
	left: 0
}

#at-3 .banner .bg .mask:after {
	content: "";
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(17, 18, 20, 0) 50%, #111214 100%);
	position: absolute;
	top: 0;
	left: 0
}

#at-3 .banner .inner {
	height: 100vh;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	padding: 1.8rem 0 1.2rem;
	display: -ms-flexbox;
	display: flex
}

#at-3 .banner .inner h1 {
	background: linear-gradient(170deg, #fff, #ffeb00, #e27402);
	-webkit-background-clip: text;
	color: transparent;
	-webkit-background-clip: text;
	-webkit-background-clip: text;
	background-clip: text;
	line-height: 1
}

#at-3 .banner .inner h2 {
	line-height: 1.5
}

#taiSimple .banner {
	overflow: hidden
}

#taiSimple .banner .inner {
	-ms-flex-pack: center;
	justify-content: center;
	padding-top: 3rem;
	padding-bottom: .4rem
}

#taiSimple .banner .inner .topic h1>small {
	font-size: inherit;
	text-transform: uppercase
}

#taiSimple .banner .inner .topic>small {
	text-align: center;
	display: block
}

#taiSimple .banner .inner .topic>p {
	text-align: center;
	margin-top: .3rem
}

#taiSimple .banner .inner .topic .pro {
	width: 100%;
	min-height: 5rem;
	margin-top: .2rem
}

#about .banner {
	overflow: hidden
}

#about .banner .inner {
	height: 5.6rem;
	width: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

#about .banner .inner small {
	text-align: center
}

#about .banner .inner h1 {
	color: #fff;
	letter-spacing: -.04em;
	line-height: .8;
	margin-top: .3em;
}

#about .r1 {
	background-color: #efefef;
	padding: 2.4rem 0 2.2rem;
	overflow: hidden
}

#about .r1 .bg .sign {
	height: 12rem;
	position: absolute;
	bottom: 0;
	left: -48%
}

#about .r1 .inner .group {
	grid-template-columns: repeat(2, 1fr);
	gap: .4rem;
	margin-bottom: .4rem;
	display: grid
}

#about .r1 .inner .group .left {
	min-height: 4.7rem
}

#about .r1 .inner .group .left h2 {
	margin-bottom: .1rem
}

#about .r1 .inner .group .left small {
	line-height: 1.1;
	display: block
}

#about .r1 .inner .group .left p {
	margin: .3rem 0
}

#about .r1 .inner .group .right {
	position: relative
}

#about .r1 .inner .group .right .img {
	height: 4.7rem;
	margin: 0 auto;
	position: absolute;
	top: .2rem;
	left: 0;
	right: 0
}

#about .r1 .inner .part {
	grid-template-columns: repeat(2, 1fr);
	gap: .4rem;
/* 	display: grid */
}

#about .r1 .inner .part .left {
	grid-template-rows: repeat(1, 2.6rem);
	grid-template-columns: repeat(4, 1fr);
	gap: .2rem;
	display: grid
}

#about .r1 .inner .part .left .chunk {
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	background-color: rgba(255, 255, 255, .8);
	border-radius: .16rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .4rem .4rem .4rem .5rem;
	display: -ms-flexbox;
	display: flex
}

#about .r1 .inner .part .left .chunk .img {
	max-height: .5rem;
	display: block
}

#about .r1 .inner .part .left .chunk .col {
	width: 100%;
	text-align: center
}

#about .r1 .inner .part .left .chunk .col h4 {
	text-align: center
}

#about .r1 .inner .part .left .chunk .col h4 em {
	color: inherit;
	letter-spacing: -.04em;
	margin-right: .1rem;
	font-family: inherit;
	line-height: 1
}

#about .r1 .inner .part .left .chunk .col p {
	color: rgba(35, 38, 38, .5);
	text-align: center
}

#about .r1 .inner .part .right {
	position: relative
}

#about .r1 .inner .part .right .img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: .16rem;
	overflow: hidden
}

#about .r1 .inner .part .right .player {
	width: 1rem;
	height: 1rem;
	background-color: rgba(0, 0, 0, .5);
	border-radius: 50%;
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#about .r1 .inner .part .right .player .iconfont {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

@media screen and (orientation:landscape) {
	#about .r1 .inner .part .right .player:hover {
		transform: scale(1.2)
	}

	#about .r1 .inner .part .right .player:hover .iconfont {
		transform: scale(.85)
	}
}

#about .r2 {
	background-color: #d9d9d9;
	overflow: hidden
}

#about .r2 .inner {
	height: 100vh;
	width: 100%;
	background-color: #000;
	position: relative;
	overflow: hidden
}

#about .r2 .inner .clear {
	opacity: .7;
	height: 100%;
	width: 100%;
	display: block
}

#about .r2 .inner .upSide {
	width: 45%;
	height: 100%;
	z-index: 10;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	position: absolute;
	top: 0;
	left: 50%
}

#about .r2 .inner .upSide h3 {
	line-height: 1.2
}

#about .r2 .group {
	z-index: 10;
	position: relative;
	transform: translateY(-1.2rem)
}

#about .r2 .group .box {
	background-color: #fff;
	border-radius: .28rem;
	margin-bottom: .4rem;
	padding: .8rem .4rem;
	position: relative;
	overflow: hidden
}

#about .r2 .group .box>.til {
	position: absolute;
	top: .8rem;
	left: .4rem
}

#about .r2 .group .box>.til h3 {
	margin-bottom: .05rem
}

#about .r2 .group .box>.til small {
	display: block
}

#about .r2 .group .box>.items {
	margin-bottom: .5rem;
	position: relative
}

#about .r2 .group .box>.items .list {
	opacity: 0;
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#about .r2 .group .box>.items .list:first-of-type {
	position: relative
}

#about .r2 .group .box>.items .list .img {
	width: 100%;
	display: block
}

#about .r2 .group .box>.items .list.on {
	opacity: 1
}

#about .r2 .group .box>.set {
	grid-template-columns: repeat(4, 1fr);
	gap: .2rem;
	display: grid
}

#about .r2 .group .box>.set .tab {
	cursor: pointer;
	text-align: center;
	height: 1rem;
	background-color: #efefef;
	border-radius: .2rem;
	line-height: 1rem;
	transition: all .5s cubic-bezier(.38, 0, 0, 1)
}

#about .r2 .group .box>.set .tab:hover,
#about .r2 .group .box>.set .tab.on {
	color: #e27402;
	background-color: #1b1f1f;
	font-weight: 600;
	box-shadow: 0 3.125vw 4.6875vw rgba(35, 38, 38, .3)
}

#about .r2 .group .mapBox {
	background-color: #f2f2f2;
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

#about .r2 .group .mapBox .left {
	z-index: 10;
	position: relative
}

#about .r2 .group .mapBox .left .top {
	margin-bottom: .8rem
}

#about .r2 .group .mapBox .left .mid {
	grid-auto-flow: row;
	gap: .2rem 0;
	display: grid
}

#about .r2 .group .mapBox .left .mid .list {
	height: 1rem;
	width: 3.6rem;
	background-color: #fff;
	border-radius: .16rem
}

#about .r2 .group .mapBox .left .mid .list .mr {
	margin-right: .1rem
}

#about .r2 .group .mapBox .left .mid .list .gray {
	color: gray
}

#about .r2 .group .mapBox .left .mid .list .icon {
	width: 1.05rem;
	height: 100%;
	position: relative
}

#about .r2 .group .mapBox .left .mid .list .icon .dot {
	width: 6px;
	height: 6px;
	background-color: #000;
	border: 1px solid #000;
	border-radius: 50%;
	position: absolute;
	top: .15rem;
	left: .15rem
}

#about .r2 .group .mapBox .left .mid .list .icon .dot.mc {
	background-color: #e27402;
	border-color: #e27402
}

#about .r2 .group .mapBox .left .mid .list .icon .dot.gray {
	background-color: #a5a5a5;
	border-color: #a5a5a5
}

#about .r2 .group .mapBox .left .mid .list .icon .dot.clear {
	background-color: transparent;
	border-color: #101010
}

#about .r2 .group .mapBox .left .mid .list .icon>img {
	width: 42%;
	height: 30%;
	object-fit: contain
}

#about .r2 .group .mapBox .left .mid .list>em {
	line-height: .9
}

#about .r2 .group .mapBox .left .mid .list>small {
	height: 3em;
	line-height: 5em;
	font-size: inherit;
	color: inherit;
	font-family: inherit
}

#about .r2 .group .mapBox .right {
	pointer-events: none;
	width: 100%;
	height: 100%;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex;
	position: absolute;
	top: 0;
	right: 0
}

#about .r2 .group .mapBox .right .map {
	width: 85%;
	display: block
}

#about .r3 {
	height: 100vh
}

#about .r3 .bg {
	height: 100%;
	background-color: #000
}

#about .r3 .bg .pic {
	opacity: .8;
	background-attachment: fixed
}

#about .r3 .inner {
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: start;
	align-items: flex-start;
	display: -ms-flexbox;
	display: flex
}

#about .r3 .inner .topic {
	margin-bottom: 1.4rem
}

#about .r3 .inner h3 {
	margin-bottom: .2rem;
	line-height: 1.1
}

#about .r4 {
	background-color: #efefef;
	padding: 1.3rem 0 2rem
}

#about .r4 .inner .top {
	margin-bottom: .5rem
}

#about .r4 .inner .mid {
	grid-auto-flow: column;
	display: grid
}

@media screen and (orientation:landscape) {
	#about .r4 .inner .mid {
		grid-template-columns: repeat(3, 1fr);
		gap: 0 .24rem
	}
}

#about .r4 .inner .mid .part {
	background-color: #fff;
	border-radius: .2rem;
	padding-bottom: 1.5rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1), transform .5s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#about .r4 .inner .mid .part h2 {
	padding: .5rem .6rem .3rem;
	transition: all .5s cubic-bezier(.38, 0, 0, 1)
}

#about .r4 .inner .mid .part .pic {
	height: 2rem;
	width: 80%;
	background-size: contain;
	margin: 0 auto;
	display: block
}

#about .r4 .inner .mid .part h3 {
	text-align: justify;
	margin-top: .2rem;
	margin-bottom: .2rem;
	padding: 0 .6rem
}

#about .r4 .inner .mid .part p {
	padding: 0 .6rem
}

#about .r4 .inner .mid .part .line {
	border-bottom: 1px dashed rgba(0, 0, 0, .5);
	margin: .2rem .6rem .4rem;
	display: block
}

#about .r4 .inner .mid .part .items {
	padding: 0 .6rem
}

#about .r4 .inner .mid .part .items>li {
	color: #3c4141;
	padding: .1rem 0 .1rem 1em;
	line-height: 1.2;
	position: relative
}

#about .r4 .inner .mid .part .items>li .icon {
	width: .26rem;
	height: .28rem;
	object-fit: contain;
	margin-right: .15rem
}

#about .r4 .inner .mid .part .items>li em {
	line-height: 1em;
	position: absolute;
	top: 0;
	left: 0
}

#about .r4 .inner .mid .part .layer-btn {
	width: 1.6rem;
	height: .64rem;
	border: 4px solid rgba(35, 38, 38, .2);
	margin: 0 auto;
	transition: border-color .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: .45rem;
	left: .6rem
}

#about .r4 .inner .mid .part .layer-btn .mk {
	opacity: 0
}

#about .r4 .inner .mid .part .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#about .r4 .inner .mid .part .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

#about .r4 .inner .mid .part .note {
	width: 100%;
	height: .64rem;
	text-align: center;
	margin: 0 auto;
	position: absolute;
	bottom: .45rem;
	left: 0;
	right: 0
}

@media screen and (orientation:landscape) {
	#about .r4 .inner .mid .part:hover {
		z-index: 10;
		box-shadow: 0 80px 120px rgba(0, 0, 0, .2)
	}

	#about .r4 .inner .mid .part:hover .layer-btn {
		border-color: rgba(35, 38, 38, 0)
	}

	#about .r4 .inner .mid .part:hover .layer-btn .mk {
		opacity: 1
	}

	#about .r4 .inner .mid .part:hover .layer-btn .txt {
		transform: translate(-.15rem)
	}

	#about .r4 .inner .mid .part:hover .layer-btn .iconfont {
		opacity: 1;
		transform: translate(.03rem)rotate(45deg)
	}
}

#about .r5 {
	height: 8rem;
	width: 100%
}

#about .r5 .inner {
	height: 100%;
	width: 100%;
	display: block
}

#about .r5 .inner .top {
	z-index: 8;
	width: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex;
	position: absolute;
	top: .8rem;
	left: 0
}

#about .r5 .inner .top .topic {
	margin-bottom: .15rem
}

#about .r5 .inner .group {
	height: 100%;
	width: 100%;
	grid-template-columns: repeat(5, 1fr);
	display: grid
}

#about .r5 .inner .group .box {
	height: 100%;
	position: relative;
	overflow: hidden
}

#about .r5 .inner .group .box .pic {
	width: 100%;
	height: 100%;
	transition: transform 1s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#about .r5 .inner .group .box .pic>.mask {
	pointer-events: none;
	opacity: 0;
	z-index: 2;
	background: linear-gradient(-30deg, #e27402 5%, rgba(254, 219, 0, 0) 28%);
	transition: opacity .8s cubic-bezier(.38, 0, 0, 1);
	top: auto;
	bottom: -2px;
	left: -2px
}

#about .r5 .inner .group .box .msg {
	height: 100%;
	z-index: 10;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#about .r5 .inner .group .box .msg h3 {
	text-align: center;
	margin-bottom: .2rem;
	transition: transform .8s cubic-bezier(.38, 0, 0, 1), color .8s cubic-bezier(.38, 0, 0, 1), font-weight .8s cubic-bezier(.38, 0, 0, 1);
	transform: translateY(.2rem)
}

#about .r5 .inner .group .box .msg .items {
	width: 100%;
	height: .2rem;
	opacity: 0;
	padding: 0 .4rem;
	transition: transform .8s cubic-bezier(.38, 0, 0, 1), opacity .8s cubic-bezier(.38, 0, 0, 1);
	transform: translateY(.15rem)
}

#about .r5 .inner .group .box .msg .items>li {
	text-align: center
}

@media screen and (orientation:landscape) {
	#about .r5 .inner .group .box:hover .pic {
		transform: scale(1.05)
	}

	#about .r5 .inner .group .box:hover .pic>.mask {
		opacity: 1
	}

	#about .r5 .inner .group .box:hover .msg h3 {
		color: #e27402;
		font-weight: 600;
		transform: none
	}

	#about .r5 .inner .group .box:hover .msg .items {
		opacity: 1;
		transform: none
	}
}

#about .r6 {
	background-color: #efefef;
	padding: 1.3rem 0 1.6rem;
	overflow: hidden
}

#about .r6 .bg .sign {
	height: 13rem;
	position: absolute;
	top: -1.7rem;
	right: -25%
}

#about .r6 .inner {
	width: 100%
}

#about .r6 .inner .topic {
	margin-bottom: .7rem
}

#about .r6 .inner .group .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

@media screen and (orientation:landscape) {
	#about .r6 .inner .group .swiper-wrapper {
		grid-template-columns: repeat(3, 1fr);
		gap: 0 .3rem
	}
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box {
	cursor: pointer;
	border-radius: .12rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1);
	display: block;
	overflow: hidden
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg {
	z-index: 10;
	background-color: #fff;
	padding-bottom: .2rem;
	position: relative
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til {
	z-index: 10;
	padding: .5rem .4rem .3rem;
	position: relative
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til h3 {
	margin-bottom: .3rem;
	line-height: 1
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til p {
	margin-bottom: .3rem;
	line-height: 1.6;
	display: block
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til .btnIcon {
	width: 1.2rem;
	height: .5rem;
	opacity: 0;
	background-color: rgba(28, 31, 31, .1);
	transition: width .6s cubic-bezier(.38, 0, 0, 1), opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: .5rem;
	right: .4rem;
	transform: translate(.2rem)
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til .btnIcon .mask {
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til .btnIcon .mask:after {
	content: "";
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1);
	transform: none
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til .btnIcon .txt {
	text-align: center;
	z-index: 9;
	margin-right: .15rem;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1)
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .msg .til .btnIcon .layer-icon {
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .photo {
	height: 2.4rem;
	width: 100%;
	background-color: #fff;
	position: relative;
	overflow: hidden
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box .photo .pic {
	width: 100%;
	opacity: .6;
	height: 100%;
	transition: all .5s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	bottom: 0;
	left: 0
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box:hover {
	box-shadow: 0 .2rem .5rem -5px rgba(35, 38, 38, .3)
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box:hover .msg .til .btnIcon,
#about .r6 .inner .group .swiper-wrapper .swiper-slide .box:hover .msg .til .btnIcon .mk {
	opacity: 1;
	transform: none
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box:hover .msg .til .btnIcon .layer-icon .iconfont {
	transform: rotate(45deg)translate(-.1rem)
}

#about .r6 .inner .group .swiper-wrapper .swiper-slide .box:hover .photo .pic {
	opacity: 1
}

#about .r6 .inner .btm {
	margin-top: .8rem;
	position: relative
}

#about .r6 .inner .btm .pager {
	z-index: 4;
	background-color: #efefef;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	padding-bottom: .15em;
	padding-right: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#about .r6 .inner .btm .pager>a {
	color: rgba(35, 38, 38, .5);
	width: .4rem;
	text-align: center;
	line-height: 1;
	transition: all .3s cubic-bezier(.38, 0, 0, 1)
}

#about .r6 .inner .btm .pager>a.on {
	color: #232626
}

#about .r6 .inner .btm .line {
	width: 100%;
	height: 1px;
	border-bottom: 1px dashed #292e2e
}

#about .r6 .inner .btm .set {
	z-index: 4;
	background-color: #efefef;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	padding-left: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#about .r6 .inner .btm .set .layer-icon {
	width: .9rem;
	height: .9rem;
	background-color: #fff;
	border-radius: 50%;
	margin-left: .2rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#about .r6 .inner .btm .set .layer-icon.disable>i {
	color: rgba(0, 0, 0, .3)
}

#about .r6 .inner .btm .set .layer-icon:not(.disable):hover {
	background-color: #e27402
}

#searchResult {
	background-color: #ededed
}

#searchResult .banner {
	padding-bottom: 1.6rem
}

#searchResult .banner>.bg {
	background-color: #fff;
	position: absolute;
	height: 4rem !important;
	overflow: hidden !important
}

#searchResult .banner>.bg .img {
	width: 100%;
	display: block
}

#searchResult .banner>.bg .mask {
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(237, 237, 237, 0) 30%, #ededed 100%);
	position: absolute;
	top: 0;
	left: 0
}

#searchResult .banner .inner {
	padding-top: 3.5rem;
	padding-bottom: .8rem
}

#searchResult .banner .inner h1 {
	line-height: 1.2
}

#searchResult .banner .inner h1 small {
	font-weight: 100;
	font-size: inherit;
	font-family: inherit
}

#searchResult .banner .inner .top {
	z-index: 12;
	-ms-flex-align: end;
	align-items: flex-end;
	margin-bottom: 1rem;
	position: relative
}

#searchResult .banner .inner .top .tabBox .tab {
	min-width: 1.8rem;
	text-align: center;
	border: 1px solid rgba(41, 46, 46, .3);
	border-radius: 2rem;
	margin-right: .2rem;
	padding: .2rem .3rem;
	position: relative;
	overflow: hidden
}

#searchResult .banner .inner .top .tabBox .tab:after {
	content: "";
	width: 120%;
	height: 100%;
	background-color: #292e2e;
	border-radius: 1rem;
	transition: transform .8s cubic-bezier(.38, 0, 0, 1), background-color .8s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: -10%;
	transform: translate(-100%)
}

#searchResult .banner .inner .top .tabBox .tab>span {
	z-index: 10;
	line-height: 1;
	transition: color .5s cubic-bezier(.38, 0, 0, 1);
	display: block;
	position: relative
}

#searchResult .banner .inner .top .tabBox .tab:hover,
#searchResult .banner .inner .top .tabBox .tab.on {
	background-color: rgba(41, 46, 46, .3);
	transition: background-color .8s cubic-bezier(.38, 0, 0, 1) .3s
}

#searchResult .banner .inner .top .tabBox .tab:hover:after,
#searchResult .banner .inner .top .tabBox .tab.on:after {
	transform: translate(0, 0)
}

#searchResult .banner .inner .top .tabBox .tab:hover>span,
#searchResult .banner .inner .top .tabBox .tab.on>span {
	color: #fff
}

#searchResult .banner .inner .top .searchBox {
	width: 3.6rem;
	height: .6rem;
	background-color: #fff;
	border-radius: 1rem;
	margin-bottom: .1rem;
	padding: 0 0 0 .25rem
}

#searchResult .banner .inner .top .searchBox>input {
	height: 100%;
	width: calc(100% - 1rem);
	background-color: transparent;
	border: none
}

#searchResult .banner .inner .top .searchBox .subSearch {
	width: .6rem;
	height: .6rem;
	background-color: #1c1f1f;
	border-radius: 50%
}

#searchResult .banner .inner .group {
	grid-template-columns: 1fr 4fr;
	gap: 0 .3rem;
	display: grid
}

#searchResult .banner .inner .group .left {
	min-height: 5rem;
	padding-bottom: 2rem
}

#searchResult .banner .inner .group .left .items .list {
	width: 100%;
	height: 1rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	margin-bottom: .2rem;
	transition: box-shadow .8s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#searchResult .banner .inner .group .left .items .list.on {
	z-index: 10;
	box-shadow: 0 .6rem 1rem -1px rgba(0, 0, 0, .2)
}

#searchResult .banner .inner .group .left .items .list.on>a {
	font-weight: 600
}

#searchResult .banner .inner .group .left .items .list:hover {
	box-shadow: 0 .6rem 1rem -1px rgba(0, 0, 0, .12)
}

#searchResult .banner .inner .group .left .items.fx {
	position: fixed;
	top: 200px
}

#searchResult .banner .inner .group .right .part .box {
	width: 100%;
	cursor: pointer;
	background-color: #f7f7f7;
	border-radius: .18rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .2rem;
	padding: .4rem;
	transition: box-shadow .5s cubic-bezier(.38, 0, 0, 1), background-color .5s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#searchResult .banner .inner .group .right .part .box .lab {
	background-color: rgba(0, 0, 0, .1);
	border-radius: 1rem;
	margin-bottom: .2rem;
	padding: 5px .2rem
}

#searchResult .banner .inner .group .right .part .box .msg {
	width: calc(100% - 2rem)
}

#searchResult .banner .inner .group .right .part .box .msg h2 {
	margin-bottom: .12rem
}

#searchResult .banner .inner .group .right .part .box .msg p {
	-webkit-line-clamp: 2;
	height: 3em;
	-webkit-box-orient: vertical;
	line-height: 1.5;
	display: -webkit-box;
	overflow: hidden
}

#searchResult .banner .inner .group .right .part .box .btnIcon {
	width: .5rem;
	height: .5rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	right: .6rem
}

#searchResult .banner .inner .group .right .part .box .btnIcon .mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, 0);
	border-radius: 1rem;
	overflow: hidden
}

#searchResult .banner .inner .group .right .part .box .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#searchResult .banner .inner .group .right .part .box .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#searchResult .banner .inner .group .right .part .box .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#searchResult .banner .inner .group .right .part .box .key {
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
	color: inherit;
	background-color: #fce700
}

@media screen and (orientation:landscape) {
	#searchResult .banner .inner .group .right .part .box:hover {
		background-color: #fff;
		box-shadow: 0 .2rem .5rem -3px rgba(0, 0, 0, .15)
	}

	#searchResult .banner .inner .group .right .part .box:hover .btnIcon {
		width: 1.2rem
	}

	#searchResult .banner .inner .group .right .part .box:hover .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#searchResult .banner .inner .group .right .part .box:hover .btnIcon .mask:after {
		opacity: 1
	}

	#searchResult .banner .inner .group .right .part .box:hover .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

#searchResult .banner .inner .group .right .part .line {
	height: 1px;
	width: 100%;
	background-color: rgba(0, 0, 0, .2);
	margin-top: .5rem;
	margin-bottom: .5rem
}

#searchResult .banner .inner .group .right .part:last-of-type .line {
	display: none
}

#searchResult .banner .btm {
	margin-top: .5rem;
	position: relative
}

#searchResult .banner .btm .pager {
	z-index: 4;
	background-color: #ededed;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: end;
	align-items: flex-end;
	padding-bottom: .15em;
	padding-right: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#searchResult .banner .btm .pager>a {
	color: rgba(35, 38, 38, .5);
	width: .4rem;
	text-align: center;
	line-height: 1;
	transition: all .3s cubic-bezier(.38, 0, 0, 1)
}

#searchResult .banner .btm .pager>a.on {
	color: #232626
}

#searchResult .banner .btm .line {
	width: 100%;
	height: 1px;
	border-bottom: 1px dashed rgba(41, 46, 46, .6)
}

#searchResult .banner .btm .set {
	z-index: 4;
	background-color: #ededed;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: center;
	align-items: center;
	padding-left: .2rem;
	display: -ms-flexbox;
	display: flex;
	position: relative
}

#searchResult .banner .btm .set .layer-icon {
	width: .9rem;
	height: .9rem;
	background-color: #fff;
	border-radius: 50%;
	margin-left: .2rem;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#searchResult .banner .btm .set .layer-icon.disable>i {
	color: rgba(0, 0, 0, .3)
}

#groundSolution .banner {
	position: relative;
	overflow: hidden
}

#groundSolution .banner>.bg .pro {
	width: 76%;
	height: 100%;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 100%;
	position: absolute;
	bottom: 7%;
	left: 14%
}

#groundSolution .banner>.bg .shadow {
	z-index: 8;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 100%
}

#groundSolution .banner .inner {
	height: 12rem;
	-ms-flex-direction: column;
	flex-direction: column;
	padding: 2rem 0 1.2rem
}

#groundSolution .banner .inner .topic h1 {
	line-height: .9
}

#groundSolution .banner .inner .topic p {
	text-align: center
}

#groundSolution .banner .inner .group {
	grid-template-columns: repeat(2, 5.2rem);
	gap: 0 .8rem;
	display: grid
}

#groundSolution .banner .inner .group .col {
	padding: 0 2% 0 .6rem;
	position: relative
}

#groundSolution .banner .inner .group .col .icon {
	height: .4rem;
	z-index: 10;
	margin: auto 0;
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0
}

#groundSolution .banner .inner .group .col h2 {
	line-height: 1.5
}

#groundSolution .r2 {
	background-color: #efefef;
	padding-top: 2.2rem;
	padding-bottom: 1rem
}

#groundSolution .r2 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: 1.5rem
}

#groundSolution .r2 .inner .top .topic {
	width: 50%
}

#groundSolution .r2 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#groundSolution .r2 .inner .mid {
	position: relative
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide {
	height: 5.6rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .6rem 0;
	transition: box-shadow .6s cubic-bezier(.38, 0, 0, 1), background-color .6s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide h3 {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide>img {
	width: 90%;
	margin: 0 auto;
	transition: transform .6s cubic-bezier(.38, 0, 0, 1)
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
	width: .5rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover h3 {
		color: #e27402
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover>img {
		transform: scale(1.2)
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon {
		width: 1.2rem
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .mask:after {
		opacity: 1
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

@media screen and (orientation:portrait) {
	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
		width: 2.2rem
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .txt {
		opacity: 1;
		line-height: .8rem;
		transform: translate(-.25rem)
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask {
		height: .8rem
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after {
		opacity: 1
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon {
		height: .8rem;
		transform: translate(.4rem)rotate(45deg)
	}

	#groundSolution .r2 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon i {
		font-size: 12px
	}
}

#groundSolution .r2 .inner .mid .swiper .swiper-button-prev {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(-90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: end;
	justify-content: flex-end;
	position: absolute;
	bottom: 0;
	right: calc(100% - .45rem)
}

#groundSolution .r2 .inner .mid .swiper .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#groundSolution .r2 .inner .mid .swiper .swiper-button-prev .layer-icon:hover {
	background-color: #000
}

#groundSolution .r2 .inner .mid .swiper .swiper-button-next {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: start;
	justify-content: flex-start;
	position: absolute;
	bottom: 0;
	left: calc(100% - .45rem)
}

#groundSolution .r2 .inner .mid .swiper .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#groundSolution .r2 .inner .mid .swiper .swiper-button-next .layer-icon:hover {
	background-color: #000
}

#groundSolution .r2 .inner .line {
	width: 100%;
	height: 1px;
	border-top: 1px dashed rgba(41, 46, 46, .3);
	margin: .5rem 0
}

#groundSolution .r2 .inner .btm {
	height: 2.4rem;
	background-color: #fff;
	border-radius: .18rem;
	overflow: hidden
}

#groundSolution .r2 .inner .btm>.pic {
	width: 50%;
	height: 100%;
	object-fit: cover;
	background-position: top;
	display: block
}

#groundSolution .r2 .inner .btm .col {
	width: 50%;
	height: 100%;
	position: relative
}

#groundSolution .r2 .inner .btm .col>.mask {
	height: 100%;
	width: 100%;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 25%);
	position: absolute;
	top: 0;
	left: -2rem
}

#groundSolution .r4 {
	background-color: #efefef;
	padding-top: 1rem;
	padding-bottom: 1.7rem
}

#groundSolution .r4 .inner {
	margin-bottom: 1.5rem
}

#groundSolution .r4 .inner .mid {
	z-index: 4;
	position: relative
}

#groundSolution .r4 .inner .mid>p {
	width: 48%;
	padding-bottom: .8rem;
	line-height: 1.33
}

#groundSolution .r4 .inner .mid .imgBox {
	position: relative
}

#groundSolution .r4 .inner .mid .imgBox .img {
	height: 7.8rem;
	display: block
}

#groundSolution .r4 .inner .mid .imgBox .years {
	position: absolute;
	bottom: 27%;
	right: -8%
}

#groundSolution .r4 .inner .mid .imgBox .years>em {
	letter-spacing: -.2em;
	text-indent: -.92em;
	font-size: 4.6rem;
	line-height: .8;
	display: inline-block
}

#groundSolution .r4 .inner .mid .imgBox .years sub {
	vertical-align: baseline
}

#groundSolution .r4 .inner .btm {
	z-index: 2;
	margin-top: -1.2rem;
	position: relative
}

#groundSolution .r4 .inner .btm .note {
	margin-bottom: .6rem
}

#groundSolution .r4 .inner .btm .note .txt {
	padding-right: .2rem
}

#groundSolution .r4 .inner .btm .note .line {
	height: 1px;
	background-color: rgba(26, 26, 26, .3);
	-ms-flex: 1;
	flex: 1
}

#groundSolution .r4 .inner .btm .logoSw {
	width: 100%;
	grid-auto-flow: column;
	padding: .2rem 0;
	display: grid
}

#groundSolution .r4 .inner .btm .logoSw .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#groundSolution .r4 .inner .btm .logoSw .swiper-wrapper .swiper-slide {
	padding-right: 1rem
}

#groundSolution .r4 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo {
	height: .88rem
}

#groundSolution .r4 .inner .btm .logoSw .swiper-wrapper .swiper-slide .photo>img {
	max-height: .88rem;
	opacity: .2;
	display: block
}

#groundSolution .r4 .part .top {
	margin-bottom: .9rem
}

#groundSolution .r4 .part .mid {
	width: 100%
}

#groundSolution .r4 .part .mid .box {
	width: 100%;
	height: 6.8rem;
	background-color: #fff;
	border-radius: .3rem;
	margin-bottom: .6rem;
	overflow: hidden
}

#groundSolution .r4 .part .mid .box .left {
	width: 50%;
	height: 100%;
	z-index: 10;
	position: relative
}

#groundSolution .r4 .part .mid .box .left .pic {
	opacity: .6;
	background-position: 15%
}

#groundSolution .r4 .part .mid .box .left .layer-play {
	width: 1.2rem;
	height: 1.2rem;
	cursor: pointer;
	z-index: 5;
	background-color: rgba(28, 31, 31, .6);
	border-radius: 50%;
	-ms-flex-direction: column;
	flex-direction: column;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#groundSolution .r4 .part .mid .box .left .layer-play p {
	margin-top: .1rem
}

#groundSolution .r4 .part .mid .box .left .layer-play:hover {
	background-color: #232626
}

#groundSolution .r4 .part .mid .box .right {
	width: 50%;
	height: 100%;
	z-index: 11;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: 0 1rem 0 3%;
	position: relative
}

#groundSolution .r4 .part .mid .box .right>.mask {
	height: 100%;
	width: 100%;
	pointer-events: none;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 26%);
	position: absolute;
	top: 0;
	left: -2rem
}

#groundSolution .r4 .part .mid .box .right>.sign {
	z-index: 5;
	height: .96rem;
	margin-bottom: .3rem;
	position: relative
}

#groundSolution .r4 .part .mid .box .right h3 {
	z-index: 5;
	position: relative
}

#groundSolution .r4 .part .mid .box .right p {
	z-index: 5;
	margin-bottom: .5rem;
	position: relative
}

#groundSolution .r4 .part .mid .box .right .items {
	z-index: 5;
	-ms-flex-align: start;
	align-items: flex-start;
	position: relative
}

#groundSolution .r4 .part .mid .box .right .items>li {
	opacity: 0;
	transform-origin: 0;
	transition: opacity 1s cubic-bezier(.38, 0, 0, 1), transform 1s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden;
	transform: translate(60%)
}

#groundSolution .r4 .part .mid .box .right .items>li>img {
	height: .52rem;
	margin: 0 auto .2rem;
	display: block
}

#groundSolution .r4 .part .mid .box .right .items>li.layer-icon {
	height: 100%;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-right: .05rem;
	padding: 0 .25rem 0 .3rem;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	overflow: hidden
}

#groundSolution .r4 .part .mid .box .right .items>li.layer-icon>i {
	line-height: .52rem
}

#groundSolution .r4 .part .mid .box .right .items>li.layer-icon .lines {
	width: 4.7rem;
	display: block;
	position: absolute;
	bottom: .5em;
	left: .05rem
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(1) {
	transition-delay: 50ms
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(2) {
	transition-delay: .1s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(3) {
	transition-delay: .15s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(4) {
	transition-delay: .2s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(5) {
	transition-delay: .25s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(6) {
	transition-delay: .3s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(7) {
	transition-delay: .35s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(8) {
	transition-delay: .4s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(9) {
	transition-delay: .45s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(10) {
	transition-delay: .5s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(11) {
	transition-delay: .55s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(12) {
	transition-delay: .6s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(13) {
	transition-delay: .65s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(14) {
	transition-delay: .7s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(15) {
	transition-delay: .75s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(16) {
	transition-delay: .8s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(17) {
	transition-delay: .85s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(18) {
	transition-delay: .9s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(19) {
	transition-delay: .95s
}

#groundSolution .r4 .part .mid .box .right .items>li:nth-child(20) {
	transition-delay: 1s
}

#groundSolution .r4 .part .mid .box .right .items.go>li {
	opacity: 1;
	transform: translate(0)
}

#groundSolution .r4 .part .mid .box:first-of-type .right {
	padding-bottom: 6%
}

#groundSolution .r7 {
	padding: 1.2rem 0 1.5rem;
	overflow: hidden
}

#groundSolution .r7 .bg .pic:after {
	content: "";
	background-color: rgba(0, 0, 0, .5)
}

#groundSolution .r7 .inner h2 {
	line-height: 1
}

#groundSolution .r7 .inner .col {
	width: 50%;
	margin-top: 1.8rem;
	margin-left: 50%
}

#groundSolution .r7 .inner .col>img {
	height: .72rem;
	margin-bottom: .5rem;
	display: block
}

#devploper .banner {
	width: 100%;
	overflow: hidden
}

#devploper .banner .inner {
	height: 8.6rem;
	width: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

#devploper .banner .inner small {
	text-align: center;
	margin-top: .2rem
}

#devploper .banner .inner h1 {
	color: #fff;
	letter-spacing: -.04em;
	text-align: center;
	line-height: .8
}

#devploper .r1 {
	width: 100%;
	background-color: #efefef;
	padding: 2.4rem 0 2rem;
	overflow: hidden
}

#devploper .r1 .bg .sign {
	height: 12rem;
	position: absolute;
	bottom: -8rem;
	left: -27%
}

#devploper .r1 .inner {
	grid-template-columns: 7.5rem calc(100% - 7.2rem);
	gap: .4rem;
	margin-bottom: .4rem;
	display: grid
}

#devploper .r1 .inner .left {
	min-height: 4.7rem;
	width: 7.5rem
}

#devploper .r1 .inner .left .topic {
	margin-bottom: .2rem
}

#devploper .r1 .inner .left p {
	margin-bottom: .5rem
}

#devploper .r1 .inner .left .items {
	grid-template-columns: repeat(3, 1fr);
	gap: 0 .24rem;
	display: grid
}

#devploper .r1 .inner .left .items>li {
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	background-color: rgba(255, 255, 255, .8);
	border-radius: .16rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .7rem .4rem .5rem;
	display: -ms-flexbox;
	display: flex;
	overflow: hidden
}

#devploper .r1 .inner .left .items>li .icon {
	height: .75rem;
	margin-bottom: .6rem
}

#devploper .r1 .inner .left .items>li h3 {
	text-align: center;
	line-height: 1.8
}

#devploper .r1 .inner .right {
	position: relative
}

#devploper .r1 .inner .right .img {
	height: 5.7rem;
	margin: 0 auto;
	position: absolute;
	top: .2rem;
	right: 0
}

#devploper .r2 {
	height: 100vh;
	width: 100%;
	overflow: hidden
}

#devploper .r2 .inner {
	height: 100%
}

#devploper .r2 .inner .right {
	width: 50%;
	margin-left: 50%
}

#devploper .r2 .inner .right .topic,
#devploper .r2 .inner .right p {
	margin-bottom: .5rem
}

#devploper .r2 .inner .right .items {
	grid-template-columns: repeat(3, 1fr);
	gap: 0 .24rem;
	display: grid
}

#devploper .r2 .inner .right .items>li {
	background-color: #1c1c1c;
	border-radius: .16rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .7rem .4rem .5rem;
	display: -ms-flexbox;
	display: flex;
	overflow: hidden
}

#devploper .r2 .inner .right .items>li .icon {
	height: .75rem;
	margin-bottom: .6rem
}

#devploper .r2 .inner .right .items>li h3 {
	text-align: center;
	line-height: 1.8
}

#devploper .r3 {
	height: 100vh;
	width: 100%;
	overflow: hidden
}

#devploper .r3 .inner {
	height: 100%
}

#devploper .r3 .inner .left {
	width: 45%;
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-bottom: 2rem;
	display: -ms-flexbox;
	display: flex
}

#devploper .r3 .inner .left .topic {
	margin-bottom: .4rem
}

#devploper .r3 .inner .left h3 {
	margin-bottom: .1rem
}

#devploper .r3 .inner .left p {
	line-height: 1.5
}

#devploper .r4 {
	height: 100vh;
	overflow: hidden
}

#devploper .r4 .inner {
	height: 100%
}

#devploper .r4 .inner .left {
	width: 45%;
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-left: 50%;
	padding-bottom: 1.6rem;
	display: -ms-flexbox;
	display: flex
}

#devploper .r4 .inner .left .topic {
	margin-bottom: .5rem
}

#devploper .r4 .inner .left>p {
	margin-bottom: .4rem;
	line-height: 1.5
}

#devploper .rowMap {
	width: 100%;
	background-color: #efefef;
	padding: 1.5rem 0 1.2rem
}

#devploper .rowMap .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .6rem
}

#devploper .rowMap .top>p {
	width: 50%
}

#devploper .rowMap .inner {
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

#devploper .r6 {
	width: 100%;
	overflow: hidden
}

#devploper .r6 .inner {
	height: 100vh;
	padding-top: 2rem
}

#devploper .r6 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

#devploper .r6 .inner .top .topic,
#devploper .r6 .inner .top .msg {
	width: 50%
}

#devploper .r6 .inner .top .msg p {
	margin-bottom: .45rem
}

#devploper .r6 .inner .top .msg .layer-btn {
	width: 2rem
}

#devploper .r6 .inner .top .msg .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#devploper .r6 .inner .top .msg .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

@media screen and (orientation:landscape) {
	#devploper .r6 .inner .top .msg .layer-btn:hover .txt {
		transform: translate(-.15rem)
	}

	#devploper .r6 .inner .top .msg .layer-btn:hover .iconfont {
		opacity: 1;
		transform: translate(.03rem)rotate(45deg)
	}
}

#devploper .r7 {
	width: 100%;
	background-color: #efefef;
	padding-top: 1.5rem;
	padding-bottom: 1.8rem;
	overflow: hidden
}

#devploper .r7 .bg .sign {
	height: 13rem;
	position: absolute;
	top: 1.5rem;
	right: -25%
}

#devploper .r7 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

#devploper .r7 .inner .top .topic {
	width: 50%
}

#devploper .r7 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#devploper .r7 .inner .mid {
	position: relative
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide {
	height: 5.6rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .6rem 0;
	transition: box-shadow .6s cubic-bezier(.38, 0, 0, 1), background-color .6s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide h3 {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide>img {
	height: 2.09rem;
	transition: transform .6s cubic-bezier(.38, 0, 0, 1)
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
	width: .5rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover h3 {
		color: #e27402
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover>img {
		transform: scale(1.05)
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon {
		width: 1.2rem
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .mask:after {
		opacity: 1
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

@media screen and (orientation:portrait) {
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
		opacity: 0
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active,
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active h3,
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active h3 {
		color: #e27402
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active>img,
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active>img {
		transform: scale(1.05)
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon,
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon {
		width: 2.2rem;
		opacity: 1
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .txt,
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .txt {
		opacity: 1;
		line-height: .8rem;
		transform: translate(-.15rem)
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .mask,
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .mask {
		height: .8rem
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .mask:after,
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .mask:after {
		opacity: 1
	}

	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .layer-icon,
	#devploper .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .layer-icon {
		transform-origin: 43% 100%;
		line-height: .8rem;
		transform: translate(.5rem)rotate(45deg)
	}
}

#devploper .r7 .inner .mid .swiper .swiper-button-prev {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(-90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: end;
	justify-content: flex-end;
	position: absolute;
	bottom: 0;
	right: calc(100% - .45rem)
}

#devploper .r7 .inner .mid .swiper .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#devploper .r7 .inner .mid .swiper .swiper-button-prev .layer-icon:hover {
	background-color: #000
}

#devploper .r7 .inner .mid .swiper .swiper-button-next {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: start;
	justify-content: flex-start;
	position: absolute;
	bottom: 0;
	left: calc(100% - .45rem)
}

#devploper .r7 .inner .mid .swiper .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#devploper .r7 .inner .mid .swiper .swiper-button-next .layer-icon:hover {
	background-color: #000
}

#devploper .r7 .inner .btm {
	height: 2.4rem;
	background-color: #fff;
	border-radius: .18rem;
	margin-top: .25rem;
	overflow: hidden
}

#devploper .r7 .inner .btm>.pic {
	width: 50%;
	height: 100%;
	object-fit: cover;
	background-position: top;
	display: block
}

#devploper .r7 .inner .btm .col {
	width: 50%;
	height: 100%;
	position: relative
}

#devploper .r7 .inner .btm .col>.mask {
	height: 100%;
	width: 100%;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 25%);
	position: absolute;
	top: 0;
	left: -2rem
}

#service .banner {
	width: 100%;
	overflow: hidden
}

#service .banner .inner {
	height: 8.6rem;
	width: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

#service .banner .inner small {
	text-align: center;
	margin-top: .2rem
}

#service .banner .inner h1 {
	color: #fff;
	letter-spacing: -.04em;
	text-align: center;
	line-height: .8
}

#service .r1 {
	width: 100%;
	background-color: #efefef;
	padding: 2.4rem 0 2rem;
	overflow: hidden
}

#service .r1 .bg .sign {
	height: 12rem;
	position: absolute;
	bottom: -8rem;
	left: -27%
}

#service .r1 .inner {
	grid-template-columns: 7.5rem calc(100% - 7.2rem);
	gap: .4rem;
	margin-bottom: .4rem;
	display: grid
}

#service .r1 .inner .left {
	min-height: 4.7rem;
	width: 7.5rem
}

#service .r1 .inner .left .topic {
	margin-bottom: .2rem
}

#service .r1 .inner .left p {
	margin-bottom: .5rem
}

#service .r1 .inner .left .items {
	grid-template-columns: repeat(3, 1fr);
	gap: 0 .24rem;
	display: grid
}

#service .r1 .inner .left .items>li {
	-webkit-backdrop-filter: blur(.3rem);
	-webkit-backdrop-filter: blur(.3rem);
	backdrop-filter: blur(.3rem);
	background-color: rgba(255, 255, 255, .8);
	border-radius: .16rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .7rem .4rem .5rem;
	display: -ms-flexbox;
	display: flex;
	overflow: hidden
}

#service .r1 .inner .left .items>li .icon {
	height: .75rem;
	margin-bottom: .6rem
}

#service .r1 .inner .left .items>li h3 {
	text-align: center;
	line-height: 1.8
}

#service .r1 .inner .right {
	position: relative
}

#service .r1 .inner .right .img {
	height: 5.7rem;
	margin: 0 auto;
	position: absolute;
	top: .2rem;
	right: 0
}

#service .r2 {
	height: 100vh;
	width: 100%;
	overflow: hidden
}

#service .r2 .inner {
	height: 100%;
	padding-top: 2.5rem
}

#service .r2 .inner .topic {
	margin-bottom: .5rem
}

#service .r2 .inner p {
	width: 6.4rem
}

#service .r2 .inner .items {
	width: 7rem;
	position: absolute;
	bottom: 1.6rem;
	right: 0
}

#service .r2 .inner .items>li {
	-webkit-backdrop-filter: blur(.2rem);
	-webkit-backdrop-filter: blur(.2rem);
	backdrop-filter: blur(.2rem);
	height: 1.2rem;
	background-color: rgba(0, 0, 0, .5);
	border-radius: .18rem;
	margin-bottom: .2rem;
	padding: .3rem .3rem .3rem 1.5rem;
	overflow: hidden
}

#service .r2 .inner .items>li:last-of-type {
	margin-bottom: 0
}

#service .r2 .inner .items>li .icon {
	height: .68rem;
	left: .5rem
}

#service .r3 {
	width: 100%;
	background-color: #efefef;
	padding-top: 1.4rem;
	padding-bottom: 1.5rem
}

#service .r3 .inner .group {
	padding-bottom: 1rem
}

#service .r3 .inner .group .topic {
	margin-bottom: .25rem
}

#service .r3 .inner .group p {
	width: 7.5rem
}

#service .r3 .inner .group .items {
	grid-template-columns: repeat(3, 1fr);
	gap: 0 .2rem;
	margin-top: 1rem;
	display: grid
}

#service .r3 .inner .group .items>li {
	background-color: #fff;
	border-radius: .2rem;
	overflow: hidden
}

#service .r3 .inner .group .items>li .img {
	height: 2.4rem;
	width: 100%;
	object-fit: cover
}

#service .r3 .inner .group .items>li .msg {
	height: 1rem;
	padding: 0 .4rem
}

#service .r3 .inner .group .items>li .msg .icon {
	height: .4rem
}

#service .r3 .inner .part {
	padding-top: 1rem;
	padding-bottom: 1rem
}

#service .r3 .inner .part .topic {
	margin-bottom: .6rem
}

#service .r3 .inner .part .mid {
	width: 100%
}

#service .r3 .inner .part .mid .box {
	width: 100%;
	height: 6.8rem;
	background-color: #fff;
	border-radius: .3rem;
	overflow: hidden
}

#service .r3 .inner .part .mid .box .left {
	width: 50%;
	height: 100%;
	z-index: 10;
	position: relative
}

#service .r3 .inner .part .mid .box .left .pic {
	opacity: .6;
	background-position: 15%
}

#service .r3 .inner .part .mid .box .left .layer-play {
	width: 1.2rem;
	height: 1.2rem;
	cursor: pointer;
	z-index: 5;
	background-color: rgba(28, 31, 31, .6);
	border-radius: 50%;
	-ms-flex-direction: column;
	flex-direction: column;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#service .r3 .inner .part .mid .box .left .layer-play p {
	margin-top: .1rem
}

#service .r3 .inner .part .mid .box .left .layer-play:hover {
	background-color: #232626
}

#service .r3 .inner .part .mid .box .right {
	width: 50%;
	height: 100%;
	z-index: 11;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start;
	padding: 0 1rem 0 3%;
	position: relative
}

#service .r3 .inner .part .mid .box .right>.mask {
	height: 100%;
	width: 100%;
	pointer-events: none;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 26%);
	position: absolute;
	top: 0;
	left: -2rem
}

#service .r3 .inner .part .mid .box .right>.sign {
	z-index: 5;
	height: .96rem;
	margin-bottom: .3rem;
	position: relative
}

#service .r3 .inner .part .mid .box .right h3 {
	z-index: 5;
	position: relative
}

#service .r3 .inner .part .mid .box .right p {
	z-index: 5;
	margin-bottom: .7rem;
	position: relative
}

#service .r3 .inner .part .mid .box .right .items {
	z-index: 5;
	-ms-flex-align: start;
	align-items: flex-start;
	position: relative
}

#service .r3 .inner .part .mid .box .right .items>li {
	opacity: 0;
	transform-origin: 0;
	transition: opacity 1s cubic-bezier(.38, 0, 0, 1), transform 1s cubic-bezier(.38, 0, 0, 1), color .3s cubic-bezier(.38, 0, 0, 1);
	overflow: hidden;
	transform: translate(60%)
}

#service .r3 .inner .part .mid .box .right .items>li>img {
	height: .52rem;
	margin: 0 auto .2rem;
	display: block
}

#service .r3 .inner .part .mid .box .right .items>li.layer-icon {
	height: 100%;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-right: .05rem;
	padding: 0 .25rem 0 .3rem;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	overflow: hidden
}

#service .r3 .inner .part .mid .box .right .items>li.layer-icon>i {
	line-height: .52rem
}

#service .r3 .inner .part .mid .box .right .items>li.layer-icon .lines {
	width: 4.7rem;
	display: block;
	position: absolute;
	bottom: .5em;
	left: .05rem
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(1) {
	transition-delay: 50ms
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(2) {
	transition-delay: .1s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(3) {
	transition-delay: .15s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(4) {
	transition-delay: .2s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(5) {
	transition-delay: .25s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(6) {
	transition-delay: .3s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(7) {
	transition-delay: .35s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(8) {
	transition-delay: .4s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(9) {
	transition-delay: .45s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(10) {
	transition-delay: .5s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(11) {
	transition-delay: .55s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(12) {
	transition-delay: .6s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(13) {
	transition-delay: .65s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(14) {
	transition-delay: .7s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(15) {
	transition-delay: .75s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(16) {
	transition-delay: .8s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(17) {
	transition-delay: .85s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(18) {
	transition-delay: .9s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(19) {
	transition-delay: .95s
}

#service .r3 .inner .part .mid .box .right .items>li:nth-child(20) {
	transition-delay: 1s
}

#service .r3 .inner .part .mid .box .right .items.go>li {
	opacity: 1;
	transform: translate(0)
}

#service .r4 {
	height: 100vh;
	width: 100%;
	overflow: hidden
}

#service .r4 .bg .pic:after {
	content: "";
	background-color: rgba(0, 0, 0, .3)
}

#service .r4 .inner {
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start
}

#service .r4 .inner .topic {
	margin-bottom: .8rem
}

#service .r4 .inner h3 {
	color: #fff;
	margin-bottom: .12rem;
	line-height: 1.2
}

#service .r4 .inner .group {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-top: .6rem
}

#service .r4 .inner .group .items {
	margin-bottom: .4rem
}

#service .r4 .inner .group .items>li>em {
	margin-right: .1rem;
	font-size: .32rem
}

#service .r4 .inner .group .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#service .r4 .inner .group .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

#service .r4 .inner .group .layer-btn:hover .txt {
	transform: translate(-.15rem)
}

#service .r4 .inner .group .layer-btn:hover .iconfont {
	opacity: 1;
	transform: translate(.03rem)rotate(45deg)
}

#service .r7 {
	width: 100%;
	background-color: #efefef;
	padding-top: 1.5rem;
	padding-bottom: 1.8rem;
	overflow: hidden
}

#service .r7 .bg .sign {
	height: 13rem;
	position: absolute;
	top: 1.5rem;
	right: -25%
}

#service .r7 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

#service .r7 .inner .top .topic {
	width: 50%
}

#service .r7 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#service .r7 .inner .mid {
	position: relative
}

#service .r7 .inner .mid .swiper .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide {
	height: 5.6rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .6rem 0;
	transition: box-shadow .6s cubic-bezier(.38, 0, 0, 1), background-color .6s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex
}

#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide h3 {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide>img {
	height: 2.09rem;
	transition: transform .6s cubic-bezier(.38, 0, 0, 1)
}

#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
	width: .5rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover h3 {
		color: #e27402
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover>img {
		transform: scale(1.05)
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon {
		width: 1.2rem
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .mask:after {
		opacity: 1
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

@media screen and (orientation:portrait) {
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
		opacity: 0
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active,
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active h3,
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active h3 {
		color: #e27402
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active>img,
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active>img {
		transform: scale(1.05)
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon,
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon {
		width: 2.2rem;
		opacity: 1
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .txt,
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .txt {
		opacity: 1;
		line-height: .8rem;
		transform: translate(-.15rem)
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .mask,
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .mask {
		height: .8rem
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .mask:after,
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .mask:after {
		opacity: 1
	}

	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .layer-icon,
	#service .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .layer-icon {
		transform-origin: 43% 100%;
		line-height: .8rem;
		transform: translate(.5rem)rotate(45deg)
	}
}

#service .r7 .inner .mid .swiper .swiper-button-prev {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(-90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: end;
	justify-content: flex-end;
	position: absolute;
	bottom: 0;
	right: calc(100% - .45rem)
}

#service .r7 .inner .mid .swiper .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#service .r7 .inner .mid .swiper .swiper-button-prev .layer-icon:hover {
	background-color: #000
}

#service .r7 .inner .mid .swiper .swiper-button-next {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: start;
	justify-content: flex-start;
	position: absolute;
	bottom: 0;
	left: calc(100% - .45rem)
}

#service .r7 .inner .mid .swiper .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#service .r7 .inner .mid .swiper .swiper-button-next .layer-icon:hover {
	background-color: #000
}

#service .r7 .inner .btm {
	height: 2.4rem;
	background-color: #fff;
	border-radius: .18rem;
	margin-top: .25rem;
	overflow: hidden
}

#service .r7 .inner .btm>.pic {
	width: 50%;
	height: 100%;
	object-fit: cover;
	background-position: top;
	display: block
}

#service .r7 .inner .btm .col {
	width: 50%;
	height: 100%;
	position: relative
}

#service .r7 .inner .btm .col>.mask {
	height: 100%;
	width: 100%;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 25%);
	position: absolute;
	top: 0;
	left: -2rem
}

#epc .banner {
	width: 100%;
	overflow: hidden
}

#epc .banner .inner {
	height: 8.6rem;
	width: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

#epc .banner .inner small {
	text-align: center;
	margin-top: .2rem
}

#epc .banner .inner h1 {
	color: #fff;
	letter-spacing: -.04em;
	text-align: center;
	line-height: .8
}

#epc .r1 {
	width: 100%;
	background-color: #efefef;
	padding: 2.4rem 0 2rem;
	overflow: hidden
}

#epc .r1 .bg .sign {
	height: 12rem;
	position: absolute;
	bottom: -8rem;
	left: -27%
}

#epc .r1 .inner {
	grid-template-columns: 7.5rem calc(100% - 7.2rem);
	gap: .4rem;
	margin-bottom: .4rem;
	display: grid
}

#epc .r1 .inner .left {
	min-height: 4.7rem;
	width: 7.5rem
}

#epc .r1 .inner .left .topic {
	margin-bottom: .5rem
}

#epc .r1 .inner .right {
	position: relative
}

#epc .r1 .inner .right .img {
	height: 5.7rem;
	margin: 0 auto;
	position: absolute;
	top: .2rem;
	right: 0
}

#epc .r2 {
	height: 100vh;
	width: 100%;
	overflow: hidden
}

#epc .r2 .inner {
	height: 100%;
	grid-template-columns: repeat(2, 1fr);
	-ms-flex-align: center;
	align-items: center;
	gap: 0 1.5rem;
	padding-bottom: 1rem;
	display: grid
}

#epc .r2 .inner .left .topic {
	margin-bottom: .5rem
}

#epc .r2 .inner .right .items {
	grid-template-columns: repeat(3, 1fr);
	gap: 0 .25rem;
	display: grid
}

#epc .r2 .inner .right .items>li {
	-webkit-backdrop-filter: blur(.2rem);
	-webkit-backdrop-filter: blur(.2rem);
	backdrop-filter: blur(.2rem);
	background-color: rgba(0, 0, 0, .5);
	border-radius: .18rem;
	padding: .6rem .2rem .4rem
}

#epc .r2 .inner .right .items>li .img {
	height: .85rem;
	margin: 0 auto .5rem;
	display: block
}

#epc .r2 .inner .right .items>li h3 {
	text-align: center
}

#epc .r3 {
	width: 100%;
	background-color: #efefef;
	padding-top: 1.6rem;
	padding-bottom: 2rem;
	overflow: hidden
}

#epc .r3 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start
}

#epc .r3 .inner .top>p {
	width: 50%
}

#epc .r3 .inner .items {
	grid-template-columns: repeat(3, 1fr);
	gap: 0 .2rem;
	margin-top: 1rem;
	display: grid
}

#epc .r3 .inner .items>li {
	background-color: #fff;
	border-radius: .2rem;
	overflow: hidden
}

#epc .r3 .inner .items>li .img {
	height: 2.4rem;
	width: 100%;
	object-fit: cover
}

#epc .r3 .inner .items>li .msg {
	height: 1rem;
	padding: 0 .4rem
}

#epc .r3 .inner .items>li .msg .icon {
	height: .4rem
}

#epc .r4 {
	height: 100vh;
	width: 100%;
	overflow: hidden
}

#epc .r4 .inner {
	height: 100%;
	grid-template-columns: repeat(2, 1fr);
	-ms-flex-align: center;
	align-items: center;
	gap: 0 .7rem;
	padding-top: 15%;
	display: grid
}

#epc .r4 .inner .left .topic {
	margin-bottom: .5rem
}

#epc .r4 .inner .right .items {
	grid-template-columns: repeat(3, 1fr);
	gap: 0 .25rem;
	display: grid
}

#epc .r4 .inner .right .items>li {
	-webkit-backdrop-filter: blur(.2rem);
	-webkit-backdrop-filter: blur(.2rem);
	backdrop-filter: blur(.2rem);
	background-color: rgba(0, 0, 0, .5);
	border-radius: .18rem;
	padding: .6rem .2rem .4rem
}

#epc .r4 .inner .right .items>li .img {
	height: .85rem;
	margin: 0 auto .5rem;
	display: block
}

#epc .r4 .inner .right .items>li h3 {
	text-align: center
}

#epc .rowMap {
	width: 100%;
	background-color: #efefef;
	padding: 1rem 0 1.2rem
}

#epc .rowMap .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .6rem
}

#epc .rowMap .top>p {
	width: 50%
}

#epc .rowMap .inner {
	grid-auto-flow: column;
	-ms-flex-pack: start;
	justify-content: start;
	-ms-flex-align: center;
	align-items: center;
	display: grid
}

#epc .r7 {
	width: 100%;
	background-color: #efefef;
	padding-top: 1.5rem;
	padding-bottom: 1rem;
	overflow: hidden
}

#epc .r7 .bg .sign {
	height: 13rem;
	position: absolute;
	top: 1.5rem;
	right: -25%
}

#epc .r7 .inner .top {
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: .8rem
}

#epc .r7 .inner .top .topic {
	width: 50%
}

#epc .r7 .inner .top>p {
	width: 50%;
	line-height: 1.33
}

#epc .r7 .inner .mid {
	position: relative
}

#epc .r7 .inner .mid .swiper .swiper-wrapper {
	grid-auto-flow: column;
	display: grid
}

#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide {
	height: 5.6rem;
	cursor: pointer;
	background-color: #fff;
	border-radius: .2rem;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	padding: .6rem 0;
	transition: box-shadow .6s cubic-bezier(.38, 0, 0, 1), background-color .6s cubic-bezier(.38, 0, 0, 1);
	display: -ms-flexbox;
	display: flex
}

#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide h3 {
	transition: color .5s cubic-bezier(.38, 0, 0, 1)
}

#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide>img {
	height: 2.09rem;
	transition: transform .6s cubic-bezier(.38, 0, 0, 1)
}

#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
	width: .5rem;
	transition: width .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask {
	height: .5rem;
	width: 100%;
	z-index: 1;
	background-color: rgba(28, 31, 31, .1);
	border-radius: 1rem;
	overflow: hidden
}

#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .mask:after {
	content: "";
	opacity: 0;
	background: linear-gradient(90deg, #ffeb00, #e27402);
	transition: opacity .5s cubic-bezier(.38, 0, 0, 1)
}

#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .txt {
	text-align: center;
	opacity: 0;
	width: 100%;
	z-index: 9;
	line-height: .5rem;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: absolute;
	top: 0;
	left: 0
}

#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon .layer-icon {
	height: .5rem;
	z-index: 10;
	transition: opacity .6s cubic-bezier(.38, 0, 0, 1), transform .6s cubic-bezier(.38, 0, 0, 1);
	position: relative
}

@media screen and (orientation:landscape) {
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover {
		background-color: #1b1f1f;
		box-shadow: 0 60px 90px rgba(35, 38, 38, .3)
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover h3 {
		color: #e27402
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover>img {
		transform: scale(1.05)
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon {
		width: 1.2rem
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .txt {
		opacity: 1;
		transform: translate(-.15rem)
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .mask:after {
		opacity: 1
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide:hover .btnIcon .layer-icon {
		transform: translate(.2rem)
	}
}

@media screen and (orientation:portrait) {
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide .btnIcon {
		opacity: 0
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active,
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active {
		background-color: #1b1f1f;
		box-shadow: 0 .2rem .5rem rgba(35, 38, 38, .3)
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active h3,
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active h3 {
		color: #e27402
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active>img,
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active>img {
		transform: scale(1.05)
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon,
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon {
		width: 2.2rem;
		opacity: 1
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .txt,
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .txt {
		opacity: 1;
		line-height: .8rem;
		transform: translate(-.15rem)
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .mask,
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .mask {
		height: .8rem
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .mask:after,
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .mask:after {
		opacity: 1
	}

	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .btnIcon .layer-icon,
	#epc .r7 .inner .mid .swiper .swiper-wrapper .swiper-slide.swiper-slide-duplicate-active .btnIcon .layer-icon {
		transform-origin: 43% 100%;
		line-height: .8rem;
		transform: translate(.5rem)rotate(45deg)
	}
}

#epc .r7 .inner .mid .swiper .swiper-button-prev {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(-90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: end;
	justify-content: flex-end;
	position: absolute;
	bottom: 0;
	right: calc(100% - .45rem)
}

#epc .r7 .inner .mid .swiper .swiper-button-prev .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#epc .r7 .inner .mid .swiper .swiper-button-prev .layer-icon:hover {
	background-color: #000
}

#epc .r7 .inner .mid .swiper .swiper-button-next {
	width: 30vw;
	height: 100%;
	cursor: pointer;
	background: linear-gradient(90deg, rgba(239, 239, 239, 0) 10%, #efefef 32%);
	-ms-flex-pack: start;
	justify-content: flex-start;
	position: absolute;
	bottom: 0;
	left: calc(100% - .45rem)
}

#epc .r7 .inner .mid .swiper .swiper-button-next .layer-icon {
	width: .9rem;
	height: .9rem;
	-webkit-backdrop-filter: blur(.12rem);
	-webkit-backdrop-filter: blur(.12rem);
	backdrop-filter: blur(.12rem);
	background-color: rgba(156, 156, 157, .4);
	border-radius: 50%;
	transition: background-color .5s cubic-bezier(.38, 0, 0, 1)
}

#epc .r7 .inner .mid .swiper .swiper-button-next .layer-icon:hover {
	background-color: #000
}

#epc .r7 .inner .btm {
	height: 2.4rem;
	background-color: #fff;
	border-radius: .18rem;
	margin-top: .25rem;
	overflow: hidden
}

#epc .r7 .inner .btm>.pic {
	width: 50%;
	height: 100%;
	object-fit: cover;
	background-position: top;
	display: block
}

#epc .r7 .inner .btm .col {
	width: 50%;
	height: 100%;
	position: relative
}

#epc .r7 .inner .btm .col>.mask {
	height: 100%;
	width: 100%;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 25%);
	position: absolute;
	top: 0;
	left: -2rem
}

#noPage .banner {
	height: 100vh;
	width: 100%;
	overflow: hidden
}

#noPage .banner .inner {
	height: 100%;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex
}

#noPage .banner .inner h1 {
	color: #34405b;
	font-size: 2.8rem;
	line-height: 1.1
}

#noPage .banner .inner .note {
	color: rgba(255, 255, 255, .4)
}

#noPage .banner .inner .set {
	width: 100%;
	grid-template-columns: auto auto;
	-ms-flex-pack: center;
	justify-content: center;
	gap: 0 .2rem;
	padding-top: 1rem;
	display: grid
}

#noPage .banner .inner .set .layer-btn {
	margin-bottom: .5rem
}

#noPage .banner .inner .set .layer-btn .txt {
	transition: transform .5s cubic-bezier(.38, 0, 0, 1)
}

#noPage .banner .inner .set .layer-btn .iconfont {
	opacity: 0;
	height: .5rem;
	transform-origin: 0;
	margin: auto 0;
	line-height: .42rem;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .25rem;
	transform: translate(.12rem)
}

#noPage .banner .inner .set .layer-btn:hover .txt {
	transform: translate(-.15rem)
}

#noPage .banner .inner .set .layer-btn:hover .iconfont {
	opacity: 1;
	transform: translate(.03rem)rotate(45deg)
}

#noPage .banner .inner .set .apply .mk {
	background-color: #fff
}

@keyframes logoSw {
	0% {
		transform: translate(0, 0)
	}

	to {
		transform: translate(-100%)
	}
}

/* 团队 */
.about_team {
 padding:1rem 0;
  background-image: url('../images/teambg_06.jpg');
  background-size: cover;
  background-position: 0;
  
}
.about_team_title {
  font-size: 0.13rem;
  color: #ffffff;
  border-bottom: 2px solid #ffffff;
  margin-bottom: 0.3rem;
}
.about_team_section_title {
  font-size: 0.13rem;
  color: #ffffff;
  padding-bottom: 0.18rem;
}
.about_team_section_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.about_team_section_list_item {
/*  width: 3.80rem; */
  padding-bottom:0;
  position: relative;
  border-bottom: 1px solid #ffffff;
  margin-right: 0.25rem;
  margin-bottom: 0.34rem;
  cursor: pointer;
}
.about_team_section_list_item:nth-child(4n+4) {
  margin-right: 0;
}
.about_team_section_list_item_photo {
    border-radius:30px;
    position: relative;
    width: 346px;
    height: 367px;
}

.about_team_section_list_item_photo img {
  width: 100%;
  height: 100%;
  border-radius: 30px;
}
.about_team_section_list_item_photo_tag {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 41px;
	height: 178px;
  display: flex;
  align-items: center;
  padding-top: 28px;
  font-size: 18px;
  color: rgba(255,255,255,0.8);
  writing-mode: vertical-lr;
  background-image: url('../images/about_partner_name_bg.png');
  background-size: 100% 100%;
}
.about_team_section_list_item_title {
  color: #ffffff;
  margin-top: 0.2rem;
}
.about_team_section_list_item_subtitle {
  color: #ffffff;
	opacity: 0.5;
  margin-top: 0.04rem;
  margin-bottom: -50px;
}
.about_team_section_list_item_arrow {
  margin-top: 0;
  padding: 0;
}
.about_team_section_list_item_icon {
  position: absolute;
  right: 0;
  bottom: 1rem;
  width: 0.6rem;
	height: 0.6rem;
}
/* 企业文化 */
.ab3{position: relative;z-index: 2;background-color: #ffffff;padding-top:1rem}
.ab3 .tit{text-align: center;position:absolute;top:1.8rem;left:0;width:100%;  font-family: hb;color: #000000;line-height: 0.74rem;margin-bottom: 0.89rem;}
.ab3 .conss{display:flex}
.ab3 .cons{display: flex;box-sizing: content-box; position: relative;}
.ab3 .con{display: flex; padding:1.86rem 0 1.16rem 0; justify-content: space-between;align-items: center;opacity:0;transition: all .5s}
.ab3 .con.swiper-slide-active{opacity:1;transition: all .5s}
.ab3 .con .txt{width: 50%;}
.ab3 .con .txt .h{width: 0.83rem;margin-bottom: 0.56rem;}
.ab3 .con .txt .h1{position: relative;font-family: hb;display: table; color: #000000;line-height: 0.38rem;margin-bottom: 0.7rem;}
.ab3 .con .txt .h1::before{content: "";position: absolute;top: 0.05rem;left: -0.43rem;width: 0.23rem;height: 0.2rem;background: url(../images/ab3_fh1.png);background-size: 100% 100%;}
.ab3 .con .txt .h1::after{content: "";position: absolute;bottom: 0.05rem;right: -0.43rem;width: 0.23rem;height: 0.2rem;background: url(../images/ab3_fh2.png);background-size: 100% 100%;}
.ab3 .con .txt .p{font-family: hm;color: #8D8D8D;line-height: 0.36rem;}
.ab3 .con .pics{width: 40%;border-radius: 0.2rem;overflow: hidden;}
.ab3 .con .pics .pic{width: 100%;height: 7.12rem;background: no-repeat center;background-size: cover;}

.conss .swiper-button-next{
    right: 0;
}
.conss .swiper-button-prev{
    left: 0;
}
.conss .swiper-button-next, .conss .swiper-button-prev {
    position: absolute;
    top: var(--swiper-navigation-top-offset, 50%);
    width: calc(var(--swiper-navigation-size) / 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color));
}

.conss .swiper-button-next,.conss .swiper-button-prev{
    width: .9rem;
    height: .9rem;
    background-color: #fff;
    border-radius: 50%;
    transition: background-color .5s cubic-bezier(.38, 0, 0, 1);
}
/* 荣誉 */
.flexOnlySpaceBetween {
    display: flex;
    justify-content: space-between;
}
.about_reward {
  padding: 1rem 0rem;
  background-image: url('../images/honor_02.jpg');
  background-size: cover;
}
.about_reward_title {
  padding: 0.1rem 0;
  color: #ffffff;
  border-bottom: 2px solid #ffffff;
  max-width: 3.03rem;
}
.about_reward_wrapper {
  margin-top: 0.4rem;
}
.about_reward_tabs_container {
  overflow-x: auto;
  max-width: 1029px;
  padding: 4px 0;
}
.about_reward_tabs {
  display: flex;
}
.about_reward_tab {
  flex: none;
  color: #ffffff;
	opacity: 0.1;
  margin-right: 0.25rem;
  cursor: pointer;
}
.about_reward_tab.on {
  opacity: 1;
}
.about_reward_list {
  margin-top: -0.5rem;
}
.about_reward_list_item {
  margin-top: 0.3rem;
  display: none;
}
.about_reward_list_item.on {
  display: block;
}
.about_reward_list_item_titles {
  width: 5.36rem;
  border-top: 1px solid rgba(255,255,255,0.1);
  margin-top: 0.5rem;
}
.about_reward_list_item_title_link {
  color: rgba(255, 255, 255, 0.3);
  padding: 0.15rem 0;
  display: block;
  transition: all 0.3;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.about_reward_list_item_title_link.on {
  opacity: 1;
  padding-left: 0.16rem;
  color: #ffffff;
  background-color: rgba(255,255,255,0.1);
}
.about_reward_list_item_thumbnails {
  width: 1.99rem;
	height: 2.68rem;
	box-shadow: 0rem 0.1rem 0.1rem 0rem 
		rgba(180, 183, 190, 0.2);
	border: solid 0.01rem rgba(237, 237, 237, 0.2);
  padding: 0.13rem 0.12rem;
  background-color: rgba(255, 255, 255, 0.2);
}
.about_reward_list_item_thumbnails_img {
  width: 100%;
  height: 100%;
  display: none;
}

/* 业务领域 */
.bus_con{position: relative;background: #fff;}
.bus1{padding: 3.1rem 0 3.3rem 0;background-color: #ffffff;text-align: center;position: sticky;top: 0;}
.bus1 .h1{font-family: hb;color: #000;line-height: 1.06rem;}
.bus1 .h2{font-family: hb;color: #000;line-height: 0.6rem;}
.bus2{transform: scale(0.81);position: relative;z-index: 2;}
.bus2 .box .btm{justify-content: left;margin-top:.7rem;}
/* .bus2::before{content: "";position: absolute;top: 3px;left: 0;width: 100%;height: 2.4rem;background: url(../img/bus_yy.png);background-size: 100% 100%;transform: translateY(-100%);} */
/* .bus2::after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 2.4rem;background: url(../img/bus_yy.png);background-size: 100% 100%;transform: rotate(180deg);} */
.bus2 .boxss{position: sticky;top: 0;display:flex;background: #fff;}
.bus2 .boxs{height: 100vh;transition: all 0.1s;display:flex;box-sizing: content-box;position: relative;margin-bottom: 200px;}
.bus2 .box{position: relative;transition-property: transform;opacity: .7;}
.bus2 .box.swiper-slide-active{opacity: 1;}
.bus2 .box .pic{width: 100%;background: no-repeat center;background-size: cover;border-radius: 0;transition: all 1.5s;overflow: hidden; 
    border-radius: 0.2rem;}
.bus2 .box .pic img{max-width: 100%;}
.bus2.on .box .pic{transform: scale(0.71);border-radius: 0.2rem;}
.bus2.show .box .pic{transform: scale(1);border-radius: 0;}
.bus2 .box .txt{
	/* position: absolute; */margin-top: .5rem;
	left: 1.7rem;width: 12rem;bottom: -1.5rem;transition: all 0.8s;}
.bus2.on .box .txt{bottom: 0.3rem;opacity: 1;}
.bus2.show .box .txt{bottom: 0;}
.bus2 .box .txt .h{line-height: 0.74rem;margin-bottom: .2rem;color: #000;}
.bus2 .box .txt .p{color: #000;line-height: 0.36rem;height:0.72rem;padding-top: .3rem;}
.bus2 .box .txt .p span{font-family: hb;color: #000;}
/* .bus2 .box .txt{width: calc(100% - 69.8vw);padding: 8.07vw 8.177vw 4.6875vw 4.1667vw;}
.bus2 .box .txt .h{font-family: hb;color: #0D1B36;line-height: 52px;margin-bottom: 6vw;}
.bus2 .box .txt .p{font-family: hr;color: #0D1B36;line-height: 34px;height: 306px;margin-bottom: 5.2vw;}
.bus2 .box .txt ul{display: flex;font-family: hb;color: #0D1B36;}
.bus2 .box .txt ul li:first-child{margin-right: 1.52vw;} */