/**
 
 @Name: layuiSimpleBlog - 极简博客模板
 @Author: xuzhiwen
 @Copyright: layui.com
 
 */


/*end-menu-btn*/



body{font: 14px Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif; overflow-x: hidden;}
.w1000{max-width: 1000px!important; margin:0 auto;}
.header{height: 60px; line-height: 60px; position: relative; font-size: 14px;background:#27282A;}
.header .logo,.header .welcome-text,.header .nav{position: absolute; top: 0;}
.header .logo{left: 20px;}
.header .logo span{display: none;}
.header .logo a img{width:70%;}
.header .nav{right: 0;}
.header .nav a{color: #fff; margin: 0 10px; opacity: .8; position: relative; height: 60px; line-height: 60px;
    display: inline-block; padding: 0 10px; box-sizing: border-box;}
.header .nav a.active{color: #fff; opacity:1;}
.header .nav a.layui-this:after{position: absolute; left: 0; height: 5px; background-color: #ff1874; transition: all .2s;
    -webkit-transition: all .2s; content: ''; top: auto; bottom: 0; width: 100%;
}
.header .nav a:hover:after{position: absolute; left: 0; height: 5px; background-color: #ff1874; transition: all .2s;
    -webkit-transition: all .2s; content: ''; top: auto; bottom: 0; width: 100%;
}
.header .welcome-text{right: 50px;}
.header .header-down-nav{display: none;}
.header.home{position: fixed;width: 100%;z-index: 9999;background: rgba(57,61,73,.4);}
.header .header-down-nav .layui-nav-item a{color: #848484;}

.footer{width: 100%; height: 138px; margin: 0; background: #2b2b2b; box-sizing: border-box; padding: 30px 0;}
.footer p {font-size:15px;text-align:center;height:32px;line-height: 32px;margin: 0;padding: 0;color: white;color: rgba(255,255,255,.41);}
.footer p a {color: rgba(255,255,255,.6);margin-left: 10px;}

.hallmark,.course{width: 100%; margin: 0; padding: 0; overflow: hidden;}
.hallmark{background: #f3f6fd;}
.course{background: #ebebec; padding:40px 0;}
.w1190{width: 1190px; margin: 0 auto; padding: 0; position: relative; overflow: hidden;}
.hallmarkTitle {width: 100%; margin: 0; height: 142px; line-height: 142px; font-size: 24px;color: #0c0c10; text-align: center;}
.hallmark .layui-row div.grid-demo{margin-bottom:10px; height:100px;}
i.icon{width: 40px; height: 40px; float: left; margin: 0; display: block; background: url("../images/download/icon.png?v=20231109") no-repeat;}
i.icon.one{background-position: 0 0;}
i.icon.two{background-position: 0 -50px;}
i.icon.three{background-position: 0 -100px;}
i.icon.four{background-position: 0 -150px;}
i.icon.five{background-position: 0 -200px;}
i.icon.six{background-position: 0 -250px;}
i.icon.seven{background-position: 0 -300px;}
i.icon.eight{background-position: 0 -350px;}
i.icon.nine{background-position: 0 -400px;}
.allText{width: 100%;float: left;margin: -40px 0 0 0;padding: 0 0 0 50px;box-sizing: border-box;}
.allText h3{height: 26px;line-height: 18px;text-align: left;font-size: 16px;color: #0c1824;}
.allText p{color: #3b3b4a;line-height: 20px;font-size: 12px;text-align: justify;padding-right:20px;box-sizing:border-box;}

.course ul{list-style: none; width: 100%; padding: 0; margin: 0; overflow: hidden;}
.course ul li{float: left;width: 100%;margin: 0;padding: 0;overflow: hidden;}
.courseLeft{width: 130px;float: left;min-height: 130px;position: relative;border-right: 2px solid #c5d8db;}
.circle{display: block;width: 8px;height: 8px;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;background: #c5d8db;position: absolute;top: 0;right: -5px;}
.starMate{width: 100px; height: 30px; line-height: 30px; text-align: center;
    color: #fff; margin: 0 0 10px 10px;
    background: #4387d8;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-size: 13px;
    cursor: default;
}
.version{
    width: 100px;
    height: 24px;
    line-height: 24px;
    text-align: right;
    color: #3b3b4a;
    margin: 0 0 0 10px;
    font-size: 12px;
    padding: 0;
    cursor: default;
}
.time{
    width: 100px;
    height: 24px;
    line-height: 24px;
    text-align: right;
    color: #3b3b4a;
    margin: 0 0 0 10px;
    font-size: 12px;
    padding: 0;
    cursor: default;
}
.courseRight{
    width: 100%;
    float: left;
    position: relative;
    margin: -130px 0 0 0;
    padding: 0 0 0 150px;
	box-sizing: border-box;
}
.courseRightBox{
    border-bottom: 1px dashed #c5d8db;
    width: 100%;
    overflow: hidden;
    margin:0 0 10px 0;
    padding-bottom: 20px;
}
.courseRightBox h2{
    text-align: left;
    height: 40px;
    line-height: 40px;
    font-size: 24px;
    color: #0c1824;
    width: 100%;
    margin: 0 0 15px 0;
}
.courseRightBox p{
    width: 100%;
    margin: 0;
    padding: 0;
    line-height: 24px;
    color: #3b3b4a;
    font-size: 12px;
}
.course ul li:last-child .courseRightBox{
    margin:0;
    border-bottom:none;
}
.lastDownload{
    height: 25px;
    line-height: 25px;
    text-align: center;
    display: inline-block;
    background: #4387d8;
    color: #fff;
    font-size: 13px;
    width: 85px;
    top: -4px;
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    left:20px;
}
a.lastDownload:hover{
	color:#fff;
}
.over{overflow:hidden;}
.p60{padding:60px 0;}
.redeploy{
    width: 100%;
    height: 450px;
    overflow: hidden;
    padding: 0;
    margin: 0;
    position: relative;
    box-sizing: border-box;
}
.redeploy.ambient{
    margin: 0;
}
.redeploy.pc{
    background: url("../images/download/taisi_bg.png") no-repeat center top;
    padding: 40px 70px 0;
	background-size: contain;
}
.redeploy.noteBook{
    background: url("../images/download/bijiben_bg.png") no-repeat center top;
    padding: 40px 95px 0;
	background-size: contain;
}
.redeploy .iconBox{
    width: 35px;
    height: 32px;
    padding: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -163px 0 0 -195px;
}
.redeploy .iconBox img{
    width: 35px;
    height: 32px;
}
.textContent{
    height: 219px;
    width: 390px;
    padding: 0 8px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -165px 0 0 -200px;
}
.textContent h2{
    width: 100%;
    height: 40px;
    line-height: 36px;
    font-size: 24px;
    color: #fff;
    margin: 0 0 10px 0;
    padding: 0;
    text-indent: 2em;
}
.textContent p{
    color: #fff;
    font-size: 13px;
    line-height: 30px;
    width: 100%;
    margin: 0;
    padding: 0;
}

.pattern.w1190{margin: 80px auto;}
#support{height: 120px;}
#joinBox{height: 100px;}
.mobileImg,.bazaarRight h2,.description.none{display: none;}
.pcNone,.mobileVideo,.mobileBanner{display: none;}
.support.demand.w1190{margin: 100px auto 0}

.video-container{
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.video-container video {
    display: block;
    width: 100%;
    height: calc(100vw / 16 * 9);
    margin: auto;
}

@media (min-width: 500px) {
    .video-container video {
        height: calc(500px / 16 * 9)
    }
}
.IIV::-webkit-media-controls-play-button,
.IIV::-webkit-media-controls-start-playback-button {
    opacity: 0;
    pointer-events: none;
    width: 5px;
}
.video-container figure {
    width: 100%;
}
.video-container .play {
    float: left;
}
.video-container .fullscreen {
    float: right;
}
.threejs-notice { }
.video-container .threejs-notice a {
    display: inline-block;
    vertical-align: top;
    text-align: left;
}
.video-container h2 {
    margin: 1em 0;
}
.video-container p {
    line-height: 25px;
    font-size: 0.75em;
    margin: 0 0 1em;
}
.video-container a {
    color: #FFF;
}
.video-container code {
    font-size: 1.2em;
}
.video-container h2 span {
    display: block;
    font-size: 12px;
    font-weight: normal;
}

@media screen and (max-width: 1200px){
    .header .logo{left: 20px;}
    .header .nav{left: 150px;}
    .header .nav a{margin: 0 20px;}
    .content .cont .title{padding-left:10px;}
    .content .cont .list-item .item .img{padding:0 10px;}
    .content .cont .list-item .item .item-cont{padding:0 20px;}
    .content .cont .list-item .item .item-cont h3{margin:15px 0; font-size: 22px;}
    .content .cont .list-item .item .item-cont h5{margin-bottom: 10px;}
    .content .cont .list-item .item .item-cont p{line-height: 30px;}
    .content .cont .list-item .item .item-cont .go-icon{margin-top: 5px;}
    .content .cont .list-item .item{margin-bottom: 50px;}
    .content{padding:60px 0 60px 0;}
    .whisper-content{padding:0 0 60px 0;}
    .details-content .article-cont .title{padding:0;}
    .details-content .article-cont .title h3{font-size: 22px;}
}
@media screen and (max-width: 1000px){
    .leacots-content{padding:0 20px 40px 20px;}
    .album-content .img-info img{width: 100%; padding-right: 0; margin-bottom: 20px;}
    .album-content .img-info{margin-top: 0px; margin-bottom: 50px;}
    .album-content .img-list .space>*{padding:30px;}
}
@media screen and (max-width: 768px){
    .header .nav,.header .welcome-text{display: none;}
    .banner .amount{line-height: 40px; }
    .banner .title{top: 245px;}
    .banner .title h3{font-size: 40px; line-height: 44px;}
    .banner .title h4{font-size: 24px;}
    .footer{padding-left: 0;}
    .footer .qrcode{float: none; margin-bottom: 40px; margin-left: 10px;}
    .footer .practice-mode{position: relative; margin-left: 10px;}
    .banner .title{top: 290px; left: 20px;}
    .banner .amount{left: 20px; top: 210px; line-height: 30px;}
    .whisper-content .cont .item{padding:30px;}
    .whisper-content .cont .item-box .item{padding:30px;}
    .content .review-version .list-cont .cont .text{padding-left:0; line-height: 22px; color: #333; }
    .content .review-version .list-cont .cont .text .tit{line-height: 50px; margin-bottom: 0;}
    .content .review-version .list-cont .cont .text .tit .name{margin-left: 20px;}
    .content .review-version .list-cont .cont .text .ct{margin-top: 20px;}
    .leacots-content .review-version .form{margin:40px 0;}
    .album-content .img-list .space>*{padding:10px;}
    .album-content .img-list .layui-laypage{margin: 50px 0 0 0;}
    .album-content .img-list #demo{text-align: center;}
    .about-content .item.info img{margin-right: 0; float: none; height: auto; width: 100%;}
    .about-content .item.info p{padding-left:20px;}
    .about-content .item{padding-bottom: 40px;}
    .about-content .item h3{padding-left: 20px;}
    .about-content .item.contact .cont img{margin:0 30px 0 20px;}
    /*menu-btn*/
    .menu { width: 40px; height: 40px; position: relative; cursor: pointer;}
    .menu:before, .menu:after { content: ""; display: block; width: 40px; height: 3px; background: #fff; border-radius: 8px; position: absolute; left: 0; -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; }
    .menu:before { top: 0px; box-shadow: 0 26px #fff;}
    .menu:after { bottom: 24px; }
    .menu.on:before { top: 13px; box-shadow: none; -webkit-transform: rotate(225deg); transform: rotate(225deg); }
    .menu.on:after { bottom: 24px; -webkit-transform: rotate(135deg); transform: rotate(135deg); }
    .menu-btn{position: absolute; top: 17px; right: 15px;}
    .header .header-down-nav { width: 240px; position: absolute; top: 60px; z-index: 10001; right: 0; padding: 0; border-radius: 0;}
    .header .header-down-nav {background: #fff;}
    .header .header-down-nav .layui-nav-item a{padding:0 40px;text-align: center;}
    .header .header-down-nav li {display: block;}
    .layui-nav .layui-this:after{background: #ff1874;}
    .header .header-down-nav li a{font-size: 16px;}
    .header.home{position:relative;background:#27282A;}
    .footer p a.hide,.hide{display:none;}
    .footer{height:110px;padding:20px 10px; width: 100%; box-sizing: border-box}
    .footer p{font-size:12px; line-height: 22px; height: auto;}
    .w1190,.newsCenter ul li.w1190,.explainLeft,.explainBox{width:100%;}
    .explainLeft{margin: 0;}
    .explainBox{padding: 0;}
    .hallmark .layui-row div.grid-demo{padding:0 0 0 10px;box-sizing:border-box;}
    .allText p{padding-right:10px;}
    .courseRightBox h2 a.lastDownload{display:none;}
    .m30{margin-bottom:30px;}
    .ipad{padding: 30px 10px 0;box-sizing: border-box;}
    .textContent h2{margin: 0 0 5px 0;}
    .textContent p{line-height:24px; font-size:12px;}
    .textContent{margin: auto; width: 100%; padding: 0 10px; box-sizing: border-box; left: 0; top: 15px;}
    .iconBox{margin:0; left: 10px; top: 18px;}
    .redeploy.pc,.redeploy.noteBook{height:220px;background: #27282A; padding: 0; margin: 0 2.5%; width: 95%;}
    .redeploy.pc{margin-bottom: 2.5%;}
    .p60{padding: 0;}
    .address ul{padding: 20px 20px 0; box-sizing: border-box;}
    .address ul li{margin-bottom: 20px;}
    .newsCenter ul li.w1190{height:auto;padding: 0 10px;box-sizing: border-box;margin: 0 13px 30px 0;}
    .explainLeft .layui-tab-content{padding: 10px 0;}
    .newsCenter ul li .contents{width: 100%; height: auto;padding: 10px 0;}
    .explainBox.padding15{padding: 15px 10px; box-sizing: border-box;}
    .contentsBoxTxt.m20{margin: 20px 0 0 0;}
    .contentsBoxTxt.m20 .contentsA  .contentsText{margin-top: 15px;}
    .leftTitleBox{padding: 0 10px; box-sizing: border-box}
    .arrow-down{right: 20px;}
    ul.screenList{right: 10px;}
    .hAuto{height: auto;}
    ul.patternListUl{padding: 0 0 0 5%; box-sizing: border-box;}
    ul.patternListUl li{height:200px;}
    .patternImg{padding: 0 5%; box-sizing: border-box;}
    .marketBox.zhengquan{background: transparent;}
    .market h1.black{color: black;}
    .market ul.w100{width: 100%; box-sizing: border-box; padding: 0 0 0 5%; height: auto;}
    .market ul li{width: 45%; height: 200px; margin: 0 5% 40px 0;}
    .pattern.w1190{margin: 80px auto 0;}
    .marketBox.zhengquan{height: auto;}
    .explain.two{padding-top: 50px; height: auto;}
    .explain.two h1 b{display: block;}
    .explain.two h1{padding: 0 10px; box-sizing: border-box;}
    .explain.two ul{width: 100%; height: auto; margin: 0 0 0 -5%; padding: 0 0 0 5%; box-sizing: border-box;}
    .explain.two ul li{width: 45%; margin: 0 0 0 5%; display: inline-block; text-align: center; border-bottom: none}
    .explain.two ul li .explainImg{margin: 0 auto; width: 100%;}
    .explain.two ul li .explainImg img{width: 100%; height: 100%;}
    .direction.two{height: auto;}
    .direction.two .dirLeft{width: 100%; height: auto;}
    .direction.two .dirLeft ul{width: 100%; height: auto; padding: 0 0 0 5%; margin: 0 0 0 -5%; box-sizing: border-box;}
    .direction.two .dirLeft ul li{width: 45%; float: left; margin: 0 0 0 5%; height: auto;}
    .dirTextBox,.dirText,.support ul.s_ul{height: auto; width: 100%;}
    .support.w1190{height: auto;}
    .support.demand.w1190{margin: 0;}
    .support > p{padding: 0 5%; box-sizing: border-box; text-align: justify;}
    .support ul.s_ul li{width: 100%; padding: 0 5%; border-right: none;}
    .support ul.s_ul li > p{border-bottom: 1px solid #F0E7E7; padding-bottom: 20px;}
    #support{height: 50px;}
    #joinBox{height: 15px;}
    .support.demand h1{padding: 0 5%;box-sizing: border-box;}
    .support.demand > p{text-align: center;}
    .support.demand ul{height: auto; padding: 0 5%; box-sizing: border-box; margin: 30px 0 0 0;}
    .support.demand ul li{width: 100%; height: auto; margin: 0 0 20px 0;}
    .support.demand ul li img{width: 100%; height: 100%;}
    .support.demand ul li p{margin: 0;width: 100%;}
    .mobileImg,.description.none{display: block}
    .pcImg,.dirRightImg{display: none;}
    .explain.two h1, .direction.two h1, .support h1,.pattern h1, .market h1{font-size: 22px;}
    .demand ul li h3{font-size: 20px;}
    .join_in h1{font-size: 18px; height: 80px; line-height: 80px; padding: 0 5%; box-sizing: border-box;}
    .join_in ul{width: 100%; height: auto; margin: 0; padding: 0 5%; box-sizing: border-box;}
    .join_in ul li{width: 25%; margin: 0;}
    .join_in ul li div.line{right: 50%; margin: 0 -30px 0 0;}
    .join_in ul li b{text-align: left;}
    .joinMessage.hAuto.w1190{padding: 0 5%; box-sizing: border-box;}
    .joinMessage.hAuto.w1190 .joinLeft,.joinMessage.hAuto.w1190 .joinRight{margin: 0; width: 100%;}
    .joinMessage.hAuto.w1190 .joinLeft h3,
    .joinMessage.hAuto.w1190 .joinRight h3{margin-top: 15px;}
    .layui-form-item.overflow .layui-input-block{margin: 15px 0;}
    .bazaar,.bazaar .bazaarRight{width: 100%; height: auto;}
    .bazaarRight ul{width: 100%; height: auto; padding: 0 0 0 5%; margin: 0 0 0 -5%; box-sizing: border-box;}
    .bazaarRight ul li{width: 45%; margin: 0 0 5% 5%; box-sizing: border-box;}
    .bazaarRight ul li img,.contentBoxLeftImg img{width: 100%; height: 100%;}
    .bazaarRight ul li a{width: 90%; margin: -18px 0 0 -45%;}
    .bazaarRight h2{color: #27282A; width: 100%; display: block; text-align: center; height: 70px; line-height: 70px; font-size: 22px;}
    .description.none,.contentBoxRightTxt{width: 100%;}
    .description.none{padding: 0 5%; box-sizing: border-box;}
    .description .contentBox,.contentBoxRightTxt{height: auto;}
    .contentBoxLeftImg{width: 100%; height: 100px;}
    .contentBoxRightTxt p{line-height: 20px; font-size: 12px; width: 100%; padding: 0 0 0 5%;box-sizing: border-box;}
    .description .contentBox{padding: 0 0 30px 0;}
    .direction.mobileBox,
    .direction.mobileBox .dirLeft,
    .direction.mobileBox .dirCenter,
    .direction.mobileBox .dirRight{width: 100%;height: auto; padding: 0; margin: 0;}
    .direction.mobileBox .dirLeft ul li,
    .direction.mobileBox .dirCenter ul li,
    .direction.mobileBox .dirRight ul li{width: 100%; padding: 0 5% 31px;}
    .direction.mobileBox .iconBox{width: 64px; height: 74px; margin: 0 20px 0 0; left: 0; top: 0;}
    .direction.mobileBox .dirText{padding: 0 0 0 100px; box-sizing: border-box; margin-left: -100px;}
    .direction.mobileBox .dirLeft ul li:after,
    .direction.mobileBox .dirCenter ul li:after,
    .direction.mobileBox .dirRight ul li:after{width: 90%; margin: 0 5%;}
    .direction.mobileBox .dirRight ul li.m0{margin: 0;}
    .bazaarBox.hAuto{margin: 0;}
    .direction.mobileBox h2{color: #27282A; width: 100%; display: block; height: 90px; line-height: 90px; text-align: center; font-size: 22px;}
    .contentBoxRightTxt h4{line-height: 20px; font-size: 14px; font-weight: bold; width: 100%; padding: 0 0 0 5%; box-sizing: border-box; margin-bottom: 5px;}
    .description.none.hAuto h2{height: 80px; line-height: 80px; text-align: center; font-size: 22px;}
    .videoCase,.caseBox,.caseBottom,.caseBottom ul{width: 100%; height: auto;}
    .caseBox{box-sizing: border-box; padding: 0 10px; margin: 0;}
    .caseBottom ul{margin: 0;}
    .caseBottom ul li{width: 100%; margin: 0 0 10px 0;}
    .caseRight{width: 100%; height: 314px; margin: 0;}
    .jp-video-270p .jp-video-play.h228{height: 228px;}
    .caseTop,.caseBgBox{height: auto;}
    .videoCase,.caseBgBox{padding-top: 30px;}
    .caseLeft{width: 100%; height: 314px; margin-bottom: 10px;}
    .caseTitle{width: 60%; margin: 0 0 0 -30%;}
    .caseText{padding: 58px 20px 0; height: 280px;}
    .caseText p{line-height: 24px; font-size: 12px;}
    .caseBox.pt30{padding-top: 30px;}
    .jp-video .jp-type-single .jp-controls{margin-left: 100px;}
    .popupBox{width: 90%;margin: -235px 5% 0 -45%;padding: 20px 10px;height: 470px;}
    .popupContent, .popupContent ul, .popupContent ul li{width: 100%;height: 412px;}
    .popupContent h1{height: 50px; line-height: 50px;font-size: 25px;}
    .popupContent i.lineH1{top: 55px;}
    .popupTextBox{width: 100%;margin: 30px 0 0 0; height: auto;}
    .textLeftBox{width: 100%; height: 146px;}
    .textRightBox{width: 100%; height: auto; margin: 10px 0 0 0;}
    .textRightBox p{font-size: 13px;}
    .banner.hide01,.bannerHide{display: none!important;}
    .mobileVideo,.mobileBanner{display: block;}
    .contentsBoxTxt{margin:20px 0 0 0;}
}
@media screen and (max-width: 420px) {
    .caseRight{height: 285px;}
}
@media screen and (max-width: 375px) {
    .caseRight{height: 265px;}
    .jp-video-270p .jp-video-play.h228{height: 180px;}
    .caseBottom ul li{height: 294px;}
}
@media screen and (max-width: 320px){
    .whisper-content .cont .item img{width: 100%;}
    .caseBottom ul li{height: 261px;}
    .caseRight{height: 237px;}
}