body,html{position: relative; background: #fff;}
section img{display: block;}
.aclear{clear: both;}
.jetfan-header{
	width: 100%;
	margin: 0 auto;
	position: relative;
}
.jetfan-header img.main{
	width: 100%;margin:0 auto;
}
.jetfan-header .logo{width:500px; height: 320px;
	position: absolute; top: 40%; left: 16.75%;transform:translateY(-40%);}
.jetfan-header .logo h2{font-size: 48px; color: #fff;line-height: 60px;letter-spacing: 4px;font-weight: bold;margin-top: 10px;}
.jetfan-header .logo img{max-width: 100%;}
.jetfan-header .logo p{font-size: 22px;line-height: 32px;margin-top: 15px;color: #fff;}
.jetfan-header .logo .button a{
    display: block;
    width: 110px;
    height: 34px;
    font-size: 14px;
    border-radius: 20px;
    border: 1px solid #fff;
    text-indent: 6px;
    margin-top: 10px;
    display: flex;
    justify-content:center;
    align-items:center;
}
.jetfan-header .logo .button a em{
    width: 70px;
    height: 34px;
    line-height: 34px;
    display: inline-block;
    font-style: normal;
    float: left;
    color: #fff;
    text-align: left;
}
.jetfan-header .logo .button a span{
    display: inline-block;
    width: 26px;
    height: 26px;
    background: url(../images/play-icon.png) no-repeat center center;
    background-size: cover;
    float: left;
}


.color{width: 100%;margin-top: 120px;}
.color .main{width: 1200px;margin: 0 auto;display: flex;}
.color .main .left{width: 60%;}
.color .main .left img{width: 90%;margin:0 auto;}
.color .main .right{width: 40%;display: flex;justify-content:center;align-items:center;}
.color .main .right ul{width:300px;height:300px;display: flex;justify-content:space-between;flex-wrap:wrap;z-index: 100;}
.color .main .right ul li{width: calc(33.33% - 15px);margin-bottom: 10px;}
.color .main .right ul li img{max-width: 70%;margin:0 auto;}
.color .main .right ul li span{display: block;height: 40px;line-height: 40px;text-align: center;font-size: 20px;color: #28BBA4;}

.meter{width: 100%;margin-top: 120px;}
.meter .main{width: 1200px;margin: 0 auto;}
.meter .main .title{width: 86%;margin: 0 auto;}
.meter .main .title img{width: 100%;}
.meter .main p{font-size: 20px;color: #666;line-height: 32px;text-align: center;margin-top: 20px;}
.meter .main .video{position: relative;margin-top: 60px;}
.meter .main .video video{width: 100%;border-radius: 20px;}
.meter .main .video .icon-bg{
    width: 40px;
    height: 40px;
    position: absolute;
    left: 20px;
    bottom: 20px;
    border-radius: 20px;
    background: rgba(0,0,0,.5);
    display: flex;
    justify-content: center;
    align-items: center;
}
.meter .main .video .icon-bg .icon{
    width: 30px;
    height: 30px;
    border-radius: 15px;
    cursor: pointer;
}
.meter .main .video .icon-bg .icon.play{
    background: url(../images/icon-play.svg) center center no-repeat;
    background-size: 100% 100%;
    background-position: 50%;
}
.meter .main .video .icon-bg .icon.repeat{
    background: url(../images/icon-repeat.svg) center center no-repeat;
    background-size: 100% 100%;
    background-position: 50%;
}

.variable{width: 100%;margin-top: 120px;}
.variable .main{width: 1200px;margin: 0 auto;}
.variable .main .title{width: 100%;}
.variable .main .title img{max-width: 70%;}
.variable .main p{font-size: 20px;color: #666;line-height: 32px;margin-top: 20px;}
.variable .main .video{position: relative;margin-top: 60px;}
.variable .main .video video{width: 100%;border-radius: 20px;}
.variable .main .video .icon-bg{
    width: 40px;
    height: 40px;
    position: absolute;
    left: 20px;
    bottom: 20px;
    border-radius: 20px;
    background: rgba(0,0,0,.5);
    display: flex;
    justify-content: center;
    align-items: center;
}
.variable .main .video .icon-bg .icon{
    width: 30px;
    height: 30px;
    border-radius: 15px;
    cursor: pointer;
}
.variable .main .video .icon-bg .icon.play{
    background: url(../images/icon-play.svg) center center no-repeat;
    background-size: 100% 100%;
    background-position: 50%;
}
.variable .main .video .icon-bg .icon.repeat{
    background: url(../images/icon-repeat.svg) center center no-repeat;
    background-size: 100% 100%;
    background-position: 50%;
}

.small{width: 100%;margin-top: 120px;}
.small .main{width: 1200px;margin: 0 auto;}
.small .main .desc{z-index: 100;position: relative;}
.small .main .desc img{max-width: 40%;}
.small .main .desc p{font-size: 20px;color: #666;margin-top: 20px;line-height: 30px;}
.small .main img.bg{max-width: 100%;position: relative;z-index: 99;top: -180px;}

.face{width: 100%;margin-top: 80px;}
.face .main{width: 1200px;margin: 0 auto;}
.face .main .desc img{max-width: 50%;}
.face .main .desc p{font-size: 20px;color: #666;margin-top: 20px;line-height: 30px;}
.face .main ul{width: 50%;margin: 0 auto;display: flex;flex-wrap:wrap;justify-content:space-between;margin-top: 30px;}
.face .main ul li{width: calc(50% - 8px);margin-bottom: 16px;}
.face .main ul li img{width: 100%;border-radius: 20px;}

.diy{width: 100%;margin-top: 80px;}
.diy .main{width: 1200px;margin: 0 auto;}
.diy .main .title img{max-width: 45%;}
.diy .main ul.ditem{width: 100%;margin-top: 30px;}
.diy .main ul.first{margin-top: 80px;}
.diy .main ul.ditem li{display: flex;margin: 30px 0;justify-content:space-between;}
.diy .main ul.ditem li .left{width:420px;display: flex;align-items:center;position: relative;}
.diy .main ul.ditem li .left p{font-size: 20px;line-height: 36px;color: #666;}
.diy .main ul.ditem li .left p.sec{padding-left: 80px;}
.diy .main ul.ditem li .left p.bold{font-size: 40px;font-weight: bold;line-height: 60px;}
.diy .main ul.ditem li .left p.bold span{font-size: 60px;color: #666;}
.diy .main ul.ditem li .left p span{font-size: 30px;font-weight: bold;color: #2CB7A3;}
.diy .main ul.ditem li .left img{width: 100%;border-radius: 20px;}
.diy .main ul.ditem li .left span.d3{font-size: 20px;position: absolute;right: 20px;top: 20px;color: #fff;}
.diy .main ul.ditem li .right{width:750px;position: relative;}
.diy .main ul.ditem li .right span{position: absolute;font-size: 20px;}
.diy .main ul.ditem li .right span.d1{color: #fff;left: 20px;top: 20px;}
.diy .main ul.ditem li .right span.d2{left: 20px;bottom: 20px;}
.diy .main ul.ditem li .right span.d6{left: 20px;top: 20px;color: #fff;}
.diy .main ul.ditem li .right img{width: 100%;border-radius: 20px;}
.diy .main ul.img{display: flex;justify-content:space-between;margin: 15px 0;}
.diy .main ul.img li{width: calc(50% - 15px);position: relative;}
.diy .main ul.img li img{width: 100%;border-radius: 20px;}
.diy .main ul.img li span{position: absolute;font-size: 20px;}
.diy .main ul.img li span.d3{top: 15px;right: 10px;}
.diy .main ul.img li span.d4{top: 15px;left: 15px;color: #fff;}
.diy .main ul.img li span.d5{top: 15px;right: 10px;color: #fff;}
.diy .main ul.slist{display: flex;margin: 15px 0;justify-content:space-between;}
.diy .main ul.slist li.sl1{width: 340px;position: relative;}
.diy .main ul.slist li.sl2{width: 410px;position: relative;}
.diy .main ul.slist li img{width: 100%;border-radius: 20px;}
.diy .main ul.slist li span{font-size: 20px;position: absolute;}
.diy .main ul.slist li span.d6{left: 20px;top: 20px;color: #fff;}
.diy .main ul.slist li span.d5{right: 20px;top: 20px;color: #fff;}
.diy .main .ssimg{position: relative;margin-top: 30px;}
.diy .main .ssimg img{width: 100%;border-radius: 20px;}
.diy .main .ssimg p{position: absolute;left: 30px;bottom: 60px;font-size: 20px;color: #fff;line-height: 30px;font-weight: bold;}


.diy .main ul.three li .left,.diy .main ul.three li .right{width: 50%;}
.diy .scenseimg{width: 100%;position: relative;margin-top: 100px;}
.diy .scenseimg img{width: 100%;}
.diy .scenseimg ul{display: flex;height: 60px;line-height: 60px;width: 100%;position: absolute;left: 0;bottom: 0;}
.diy .scenseimg ul li{width: 25%;font-size: 20px;color: #fff;text-indent: 40px;text-shadow:0 0 1px #666;}
.diy .scenseimg ul li.l1{width: 17.5%;}
.diy .scenseimg ul li.l4{width: 32.5%;}

.scense{width: 100%;background: url(../images/scensebg.jpg) no-repeat top left;background-size: 100% 100%;margin-top: 200px;}
.scense .main{width: 1200px;margin: 0 auto;padding-bottom: 80px;}
.scense .main .product{width: 60%;margin: 0 auto;}
.scense .main .product img{width: 100%;}
.scense .main p{font-size: 20px;line-height: 30px;color: #2CB7A4;font-weight: bold;}
.scense .main ul{margin-top: 30px;display: flex;justify-content:space-between;margin-bottom: 30px;border:2px solid #2CB7A4;border-radius: 40px;padding: 40px 30px;}
.scense .main ul li{width: calc(33.33% - 15px);}
.scense .main ul li img{width: 100%;border-radius: 20px;}
/*==========================================*/
.popup-item{width: 100%;height: 100%;display: none;position: relative;}
.popup-item .shadow{
    width: 100%;
    height: 100%;
    background: #333;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100000;
    overflow: hidden;
}
.popup-item .window{
    z-index: 100002;
    width: 1200px;
    height: 676px;position: fixed;
    margin-left: -600px;
    left: 50%;
    top: 50%;
    margin-top: -337px;
}
.popup-item .window video{
    max-width: 100%;
    margin:0 auto;
}
.popup-item .center{
    align-items: center;
    display: -webkit-flex;
    justify-content: center;
}
.popup-item span{
    width: 40px;
    height: 40px;
    display: block;
    position: fixed;
    top: 20px;
    right: 20px;
    font-size: 30px;
    color: #999;
    cursor: pointer;
    z-index: 100002;
}

@media (max-width:1660px){
	.jetfan-header .logo{top: 30%;left: 8%;transform:translateY(-30%);}
}
@media (min-width:1440px) and (max-width:1660px){

}
@media (max-width:1440px){
	.jetfan-header .logo{width: 400px;left: 10%;}
	.jetfan-header .logo h2{font-size: 40px;line-height: 50px;}
	.jetfan-header .logo p{font-size: 20px;margin-top: 5px;line-height: 30px;}
	.color .main,.meter .main,.variable .main,.small .main,.face .main,.diy .main,.scense .main{width: 1000px;}
	.small .main img.bg{top: -150px;}
    .diy .main ul.ditem li .right{width: 630px;}
    .diy .main ul.ditem li .left{width: 350px;}
    .diy .main ul.slist li.sl1{width: 280px;}
    .diy .main ul.slist li.sl2{width: 340px;}
}
@media (max-width:1280px){

}