body { background: #f4fbff; box-sizing: border-box; }

body::-webkit-scrollbar { width: 4px; }

body::-webkit-scrollbar-track { /* -webkit-box-shadow:inset 0 0 6px #0000ee; */ background: #fff; border-radius: 10px; }

body::-webkit-scrollbar-thumb { border-radius: 10px; background: #0000ee; }

body .header { width: 100%; overflow: hidden; box-sizing: border-box; top: 0; }

body .header .header-bg { width: 100%; }

body .header .menu { width: 100%; font-size: 0.2rem; padding: 0 0.24rem; line-height: 0.4rem; box-sizing: border-box; position: absolute; top: 0.2rem; }

body .header .menu .logo { float: left; height: 0.4rem; }

body .header .menu .logo img { height: 0.4rem; }

body .header .menu .menu-icon { display: none; }

body .header .menu .nav { float: right; position: absolute; right: 0.2rem; }

body .header .menu .nav ul { background: rgba(0, 0, 0, 0.6); }

body .header .menu .nav ul li { float: left; line-height: 0.5rem; }

body .header .menu .nav ul li a { padding: 0 0.2rem; color: #fff; }

body .header .menu .nav ul li.active { font-weight: 700; border-bottom: 2px solid #fff; }

body .header .left { color: #fff; padding: 1.6rem 0 0 1.4rem; box-sizing: border-box; position: absolute; top: 1rem; }

body .header .left h3 { font-size: 0.4rem; }

body .header .left a { font-size: 0.18rem; margin-top: 0.2rem; align-items: center; width: 1.8rem; line-height: 0.6rem; height: 0.6rem; background: linear-gradient(270deg, #898dff 0%, #565aff 100%); border-radius: 0.37rem; justify-content: center; box-sizing: border-box; color: #fff; }

body .header .left a span { padding-right: 0.1rem; }

body .header .left a img { width: 0.4rem; height: 0.4rem; vertical-align: middle; padding-top: 0.06rem; }

body .header .header-content { display: none; }

body .swiper-item { padding: 1.4rem 0; overflow: hidden; }

body .swiper-item ul { width: 82%; margin: auto; justify-content: space-between; align-items: center; height: 1.8rem; padding: 0 1%; }

body .swiper-item ul li.btn { height: 2rem; width: 2.4rem; box-shadow: 1px 1px 8px #e2e1e1, -1px -1px 8px #e2e1e1; font-size: 0.18rem; text-align: center; box-sizing: border-box; border-radius: 0.03rem; }

body .swiper-item ul li.btn a { height: 2rem; color: #000; }

body .swiper-item ul li.btn a img { padding-top: 0.4rem; width: 0.6rem; height: 0.6rem; display: block; margin: auto; }

body .swiper-item ul li.btn a span { display: block; padding-top: 0.25rem; }

body .swiper-item ul li.btn:hover a { color: red; }

body .card-items-slide { background: url("../img/jy-bg-03.png") no-repeat; background-size: 100% 100% !important; }

body .card-items-slide#msk { background: url("../img/msk-bg-03.png") no-repeat; background-size: 100% 100% !important; padding-bottom: 0.3rem; }

body .card-items-slide#byzc { background: url("../img/jx-bg-03.png") no-repeat; background-size: 100% 100% !important; background-size: cover !important; padding-bottom: 0.6rem; }

body .card-items-slide#k12yy { background: url("../img/k12-bg-03.png") no-repeat; background-size: 100% 100% !important; background-size: cover !important; padding-bottom: 0.3rem; }

body .card-items-slide#yyjs { background: url("../img/by-bg-03.png") no-repeat; background-size: 100% 100% !important; background-size: cover !important; /* height: 5rem; */ text-align: center; }

body .card-items-slide#yyjs p { width: 80%; margin: auto; }

body .card-items-slide#yyjs .text { padding: 0.3rem 0; }

body .card-items-slide .card-items { font-size: 0.18rem; box-sizing: border-box; padding: 0.4rem 0; }

body .card-items-slide .card-items .title { font-size: 0.4rem; text-align: center; padding-top: 0.6rem; }

body .card-items-slide .card-items .content { width: 80%; margin: auto; padding-top: 1rem; }

body .card-items-slide .card-items .content .left { flex: 1; }

body .card-items-slide .card-items .content .left .text { padding-bottom: 0.4rem; font-weight: 700; font-size: 0.26rem; }

body .card-items-slide .card-items .content .left .text-info { text-indent: 2em; line-height: 0.4rem; font-size: 0.22rem; }

body .card-items-slide .card-items .content .left .rq { position: relative; }

body .card-items-slide .card-items .content .left .rq .triangle { width: 0; border: 0.2rem solid rgba(0, 0, 0, 0.4); border-left-color: transparent; border-top-color: transparent; border-bottom-color: transparent; position: absolute; left: 2.2rem; top: 0.12rem; display: none; }

body .card-items-slide .card-items .content .left .rq .rq-img { position: absolute; left: 2.6rem; padding: 0.4rem 0.3rem; background: rgba(0, 0, 0, 0.4); color: #ffffff; border-radius: 0.06rem; top: -1rem; display: none; }

body .card-items-slide .card-items .content .left .rq .rq-img p { padding-bottom: 0.3rem; text-align: center; }

body .card-items-slide .card-items .content .left .rq .rq-img img { width: 1.6rem; }

body .card-items-slide .card-items .content .left .rq:hover .triangle { display: block; }

body .card-items-slide .card-items .content .left .rq:hover .rq-img { display: block; }

body .card-items-slide .card-items .content .left .rq .upload { background: #004dff; width: 2.4rem; text-align: center; height: 0.7rem; line-height: 0.7rem; border-radius: 0.4rem; color: #fff; margin: 0.3rem 0; cursor: pointer; }

body .card-items-slide .card-items .content .left .rq .upload img { width: 0.44rem; height: 0.44rem; vertical-align: middle; }

body .card-items-slide .card-items .content .left .installation { padding-top: 0.2rem; color: #337ab7; cursor: pointer; }

body .card-items-slide .card-items .content .left .installation a { font-size: 0.14rem; padding-right: 0.1rem; color: #337ab7; }

body .card-items-slide .card-items .content .left .installation a:hover { color: #fff; }

body .card-items-slide .card-items .content .right { flex: 1; text-align: right; }

body .card-items-slide .card-items .content .right img { height: 5rem; }

body .back_to_top { display: none; position: fixed; right: 20px; background: #fff; bottom: 60px; font-size: 0.16rem; width: 0.46rem; color: #333; cursor: pointer; text-align: center; padding: 0.04rem; }

body .back_to_top:hover { color: red; }

body.mobile .header .header-bg { height: 2.3rem; }

body.mobile .header .menu .nav { float: none; position: absolute; z-index: 12; top: 0.6rem; display: none; }

body.mobile .header .menu .nav ul { padding: 0.3rem 0; }

body.mobile .header .menu .nav ul li { width: 1.6rem; text-align: center; float: none; }

body.mobile .header .menu-icon { display: block; width: 0.5rem; height: 0.5rem; position: absolute; right: 0.2rem; }

body.mobile .header .left { display: none; }

body.mobile .header .header-content { width: 100%; overflow: hidden; display: block; font-size: 0.36rem; position: absolute; top: 1rem; color: #fff; text-align: center; }

body.mobile .swiper-item { padding: 0.2rem 0; }

body.mobile .swiper-item ul { width: 90%; height: 1.6rem; }

body.mobile .swiper-item ul li.btn { height: 1.2rem; box-shadow: none; }

body.mobile .swiper-item ul li.btn a { height: 1.2rem; }

body.mobile .swiper-item ul li.btn a img { padding-top: 0.1rem; width: 0.5rem; height: 0.5rem; display: block; margin: auto; }

body.mobile .swiper-item ul li.btn a span { display: block; padding-top: 0.1rem; }

body.mobile .swiper-item ul li.btn.active a { color: red; }

body.mobile .card-items-slide { background: url("../img/mobile/01.png") no-repeat transparent; background-size: 100% 100% !important; overflow: hidden; position: relative; box-sizing: border-box; }

body.mobile .card-items-slide .card-items { width: 90%; background: #fff; border-radius: 0.1rem; margin: auto; padding: 0; position: relative; z-index: 9; }

body.mobile .card-items-slide .card-items .content .right { display: none; }

body.mobile .card-items-slide .card-items .content .left .text { font-size: 0.3rem; }

body.mobile .card-items-slide .card-items .content .left .text-info { text-indent: 2em; line-height: 0.36rem; font-size: 0.2rem; }

body.mobile .card-items-slide#yyjk { padding-top: 0.8rem; height: 740px; }

body.mobile .card-items-slide#yyjk::before { content: ''; position: absolute; left: -0.4rem; bottom: -0.2rem; width: 3.73rem; height: 2.74rem; background: url("../img/mobile/01-icon.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; }

body.mobile .card-items-slide#yyjk::after { content: ''; position: absolute; right: 0; bottom: 0; width: 2.82rem; height: 3.3rem; background: url("../img/mobile/music-icon.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; z-index: 10; }

body.mobile .card-items-slide#byzc { background: url("../img/mobile/02.png") no-repeat; background-size: 100% 100% !important; padding-top: 1rem; height: 540px; }

body.mobile .card-items-slide#byzc::before { content: ''; position: absolute; left: -0.4rem; bottom: -0.2rem; width: 3.8rem; height: 2.6rem; background: url("../img/mobile/02-icon.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; }

body.mobile .card-items-slide#byzc::after { content: ''; position: absolute; right: 0; top: 0; width: 2.82rem; height: 3.3rem; background: url("../img/mobile/music-icon-right.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; z-index: 10; }

body.mobile .card-items-slide#K12yy { background: url("../img/mobile/03.png") no-repeat; background-size: 100% 100% !important; height: 870px; padding-top: 2rem; }

body.mobile .card-items-slide#K12yy .card-items { padding-bottom: 0.3rem; }

body.mobile .card-items-slide#K12yy .card-items .title { padding-top: 0.3rem; }

body.mobile .card-items-slide#K12yy .card-items .content { padding-top: 0.4rem; }

body.mobile .card-items-slide#K12yy::after { content: ''; position: absolute; left: -11%; bottom: -1rem; width: 4.08rem; height: 3.405rem; background: url("../img/mobile/03-icon-left.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; }

body.mobile .card-items-slide#K12yy::before { content: ''; position: absolute; right: 1.1%; bottom: 0; width: 3.765rem; height: 3.69rem; z-index: 10; background: url("../img/mobile/03-icon.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; }

body.mobile .card-items-slide#msk { background: url("../img/mobile/04.png") no-repeat; background-size: 100% 100% !important; padding-top: 0.8rem; height: 540px; }

body.mobile .card-items-slide#msk::before { content: ''; position: absolute; left: -0.16rem; bottom: -0.28rem; width: 2.21rem; height: 4.216rem; background: url("../img/mobile/04-icon.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; z-index: 10; }

body.mobile .card-items-slide#msk::after { content: ''; position: absolute; top: 0rem; right: 0rem; width: 1.479rem; height: 1.326rem; background: url("../img/mobile/04-icon-top.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; z-index: 10; }

body.mobile .card-items-slide#yyjs { background: url("../img/mobile/05-1.png") no-repeat; background-size: 100% 100% !important; padding-top: 2.4rem; height: 540px; }

body.mobile .card-items-slide#yyjs::before { content: ''; position: absolute; left: 50%; bottom: -0.34rem; width: 4.454rem; height: 3.553rem; margin-left: -2.24rem; background: url("../img/mobile/05-icon.png") no-repeat transparent; background-size: 100% 100% !important; box-sizing: border-box; z-index: 10; }

body.mobile footer { overflow: auto; line-height: auto; height: 2rem; /* margin-top: 0.3rem; */ }

body.mobile footer .center { width: 90%; display: block; }

body.mobile footer .center span { display: block; height: 0.4rem; }
