*{color: #fff;}

body{background: #000925;}
.banner{background: url(/images/index/bg-color-1.png) top center no-repeat;background-size: 100% 383px;}
.banner>.center{padding-top: 126px;}
.banner .banner_left{max-width: 540px;width: 100%;margin-top: 16px;}
.banner h1{font-weight: bold;font-size: 44px;color: #FFFFFF;line-height: 56px;}
.banner p.title{font-weight: bold;font-size: 24px;color: #FFFFFF;line-height: 32px;margin: 12px 0 22px;}
.banner p.info{font-weight: 400;font-size: 18px;color: #FFFFFF;line-height: 24px;}
.banner a.buy_now{background: #FF523D;border-radius: 58px 58px 58px 58px;height: 64px;font-weight: bold;font-size: 22px;color: #FFFFFF;text-align: center;line-height: 64px;min-width: 240px;padding: 0 15px;display: inline-block;text-decoration: none;margin-top: 50px;}
.banner a.buy_now img{display: inline-block;vertical-align: -7px;margin-right: 10px;}


/* section */
.section{margin: 120px auto;}
.section h2{font-weight: bold;font-size: 32px;color: #FFFFFF;line-height: 40px;text-align: center;max-width: 1000px;margin: 0 auto;}
.h2_des{font-weight: 400;font-size: 16px;color: #FFFFFF;line-height: 28px;text-align: center;margin: 20px auto 40px;max-width: 1000px;}
.section.bottom{background: url(/images/index/bg-color-2.png) bottom center no-repeat;background-size: 100% 523px;padding-bottom: 120px;margin-bottom: 0;}

.main .text_part{max-width: 524px;width: 100%;}
.text_part .column_part{display: flex;flex-direction: column;justify-content: space-evenly;}
.column_part div{margin: 30px 0;}
.main .s_width{max-width: 1100px;margin-left:auto ;margin-right: auto;margin-top: 70px;}
.main .text_part p.title{font-weight: bold;font-size: 24px;color: #FFFFFF;line-height: 28px;margin-bottom: 10px;}
.main .text_part p.info{font-size: 16px;color: #FFFFFF;line-height: 28px;font-weight: 400;}
.main .flex_box{align-items: center;}
.main img{max-width: 100%;display: block;margin: auto 0;height: auto;}
.main .img_box img{margin: 40px auto 0;}

ul.function li{background: #0055D6;border-radius: 16px 16px 16px 16px;max-width: 375px;width: 100%;margin-bottom: 40px;box-sizing: border-box;padding: 40px;}
ul.function li img{margin: 0 auto;}
ul.function li p{font-weight: bold;font-size: 24px;color: #FFFFFF;line-height: 28px;text-align: center;margin-top: 30px;}


/* buy_pop */
.mask{display: none;background: rgba(0,0,0,0.7);position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 5;}
.modal { max-width: 100%; max-height: 70vh; /* 最大高度 */overflow-y: auto; }
.buy_pop{position: fixed;transform: translate(-50%,-50%);top: 50%;left: 50%;background: #FFFFFF;border-radius: 24px 24px 24px 24px;max-width: 1200px;width: 100%;padding: 50px;box-sizing: border-box;text-align: center;display: none;z-index: 6;}
.buy_pop p.title{font-weight: bold;font-size: 24px;color: #333333;line-height: 24px;text-align: center;margin-bottom: 32px;}
.buy_pop i.close{display: inline-block;background: url(/images/index/close.svg);width: 24px;height: 24px;position: absolute;top: 30px;right: 30px;cursor: pointer;}

.buy_pop .tab{border: 1px solid #3888FF;border-radius: 65px 65px 65px 65px;height: 40px;display: inline-block;margin: 26px auto;cursor: pointer;}
.buy_pop .tab span i{display: inline-block;width: 22px;height: 22px;background: url(/images/index/choose-win-mac.svg) no-repeat;vertical-align: -6px;margin-right: 6px;}
.buy_pop .tab .win_tab i{background-position-y: -22px;}
.buy_pop .tab .win_tab.active i{background-position-y: 0px;}
.buy_pop .tab .mac_tab i{background-position-y: -66px;}
.buy_pop .tab .mac_tab.active i{background-position-y: -44px;}

.buy_pop .tab span{font-size: 14px;font-weight: bold;text-align: center;color: #3888FF;line-height: 40px;min-width: 140px;padding: 0 12px;box-sizing: border-box;display: inline-block;}
.buy_pop .tab span.active{background: #3888FF;border-radius: 65px 65px 65px 65px;color: #FFFFFF;}

.buy_pop .buy_box{max-width: 820px;width: 100%;margin: 0 auto;}
.buy_pop .buy_item{max-width: 360px;width: 100%;}
.buy_pop .buy_item .item_top{padding: 30px 50px 40px;background: #EDF7FF;border-radius: 14px 14px 0px 0px;text-align: center;}
.buy_pop .item_top .buy_time{font-weight: bold;font-size: 24px;color: #333333;line-height: 24px;text-align: center;}
.buy_pop .item_top .buy_des{font-weight: 400;font-size: 16px;color: #333333;line-height: 24px;text-align: center;margin: 10px 0 20px;}
.buy_pop .item_top .buy_line{display: inline-block;background: #C8C8C8;height: 1px;width: 90%;}
.buy_pop .item_top .price{text-align: center;margin: 20px 0;}
.buy_pop .item_top .price span{font-weight: bold;color: #FF0000;font-size: 36px;line-height: 36px;}
.buy_pop .item_top .price del{font-weight: bold;font-size: 18px;color: #333333;}
.buy_pop .item_top .buy_btn{height: 50px;background: #3888FF;box-shadow: 0px 8px 20px 0px rgba(35,73,199,0.2);border-radius: 10px;color: #FFFFFF;text-align: center;font-weight: bold;font-size: 20px;box-sizing: border-box;padding: 0 16px;max-width: 220px;width: 100%;line-height: 50px;text-decoration: none;display: none;}
.buy_pop .item_top .buy_btn.active{display: inline-block;}
.buy_pop .item_top .buy_btn img{display: inline-block;vertical-align: -7px;margin-right: 10px;}

.buy_pop .buy_item .item_bottom{background: #A9D5FF;border-radius: 0px 0px 14px 14px;padding: 8px 50px 36px;}
.buy_pop .item_bottom li{font-size: 16px;color: #3A526A;line-height: 24px;text-align: left;font-weight: 400;margin-top: 16px;}
.buy_pop .item_bottom li i{display: inline-block;width: 20px;height: 20px;background: url(/images/index/ok.svg);vertical-align: -5px;margin-right: 10px;}

.buy_pop ul.support {max-width: 700px;width: 100%;margin: 30px auto 0;}
.buy_pop ul.support li{font-weight: 400;font-size: 18px;color: #333333;line-height: 24px;text-align: center;}
.buy_pop ul.support li i{display: inline-block;width: 20px;height: 20px;background: url(/images/index/ok-1.svg);vertical-align: -3px;margin-right: 8px;}


@media screen and (max-width:1200px) {
    .banner .banner_left{max-width: 800px;text-align: center;}
    .center{padding-left: 20px;padding-right: 20px;}
    .banner>.center{justify-content: center;padding-top: 80px;}
    .banner>.center>img{margin: 36px auto 0;}
    
    .section{margin: 100px auto;}
    .section.bottom{padding-bottom: 100px;}
    .section .h2_des,.section h2{max-width: 800px;}
    .main .text_part{max-width: 800px;text-align: center;order: 1;margin-top: 36px;}
    .main>.center>.flex_box{justify-content: center;}
    .main .flex_box>img{order: 0;}
    .main>.center>ul.function{max-width: 820px;justify-content: space-between;margin: 0 auto;}
    .buy_pop{max-width: 94%;}
    .column_part div:last-child{margin-bottom: 0;}
    .column_part div{margin: 20px 0;}
}
@media screen and (max-width:900px) {
    .buy_pop{padding: 30px;}
    .buy_pop .buy_box{max-width: 600px;justify-content: center;}
    .buy_pop .buy_item:nth-child(1){margin-bottom: 36px;}
    .buy_pop ul.support{max-width: 360px;}
    .buy_pop ul.support li{margin: 4px 0;}
    .buy_pop p.title{max-width: 80%;margin: 0 auto 24px;}
}
@media screen and (max-width:800px) {
    .main>.center>ul.function{max-width: 400px;justify-content: center;}

    .section{margin: 80px auto;}
    .section.bottom{padding-bottom: 80px;}
    .banner h1{font-size: 39px;line-height: 46px;}
    .section h2{font-size: 26px;line-height: 32px;}
    .main .text_part p.title{font-size: 20px;line-height: 28px;}
    .main .flex_box>img{max-width: 88%;}
    .main .s_width{margin-top: 40px;}
}
@media screen and (max-width:520px) {
    .banner>.center>img{margin: 36px auto 0;width: 100%;height: auto;}
    .banner>.center{padding-top: 60px;}
    ul.function li{padding: 20px;}
    ul.function li p{margin-top: 20px;}

    .section h2{font-size: 24px;line-height: 30px;}
    .banner p.title{font-size: 20px;line-height: 30px;margin: 12px 0;}
    .banner p.info{font-size: 16px;}
    .banner a.buy_now{min-width: 200px;line-height: 50px;height: 50px;font-size: 20px;}

    .buy_pop{padding: 24px;}
    .buy_pop .buy_item{max-width: 100%;}
    .buy_pop .tab{height: 32px;}
    .buy_pop .tab .win_tab.active i{margin-right: 3px;}
    .buy_pop .tab span{min-width: auto;font-size: 12px;line-height: 32px;}
    .buy_pop p.title{font-size: 20px;line-height: 26px;}
    .buy_pop .tab{margin: 14px auto;}
    .buy_pop .buy_item .item_top{padding: 16px 20px 20px;}
    .buy_pop .buy_item .item_bottom{padding: 5px 20px 16px;}
    .buy_pop .item_top .buy_time{font-size: 18px;line-height: 24px;}
    .buy_pop .item_top .buy_des{font-size: 12px;line-height: 16px;margin: 8px 0 4px;}
    .buy_pop .item_top .price{margin: 12px auto;}
    .buy_pop .item_top .price span{font-size: 24px;line-height: 24px;}
    .buy_pop .item_top .price del{font-size: 16px;}
    .buy_pop .item_bottom li{margin-top: 8px;}
    .buy_pop .item_bottom li{font-size: 13px;line-height: 18px;}
    .buy_pop ul.support li{font-size: 14px;line-height: 20px;}
    .buy_pop ul.support{margin-top: 16px;}
    .buy_pop .buy_item:nth-child(1){margin-bottom: 20px;}
    .buy_pop i.close{top: 10px;right: 10px;width: 15px;height: 15px;background-size: 100% 100%;}
    .buy_pop .item_top .buy_btn{height: 42px;line-height: 42px;font-size: 16px;}
    .buy_pop .item_top .buy_btn img{width: 30px;height: 30px;vertical-align: -10px;margin-right: 8px;}
}