html,body{
    min-width: 1200px;
    height:100%;
    overflow: auto;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    letter-spacing: .04rem;
    font: 14px/1.25 Helvetica Neue,Helvetica,PingFang SC,"\5FAE\8F6F\96C5\9ED1",Tahoma,Arial,sans-serif;
    scroll-behavior: smooth;

}
@media only screen and (min-width:400px) {
    html {
        font-size: 21.33px !important
    }
}

@media only screen and (min-width:414px) {
    html {
        font-size: 22.08px !important
    }
}

@media only screen and (min-width:480px) {
    html {
        font-size: 25.6px !important
    }
}
@media only screen and (min-width:1800px) {
    html {
        font-size: 30px !important
    }
}
:root{
    /****** 颜色相关 *********/
    --text-color_normal: #0d1319;
    --bg-color_normal: #ffffff;
    --border-color_normal: rgb(232,232,232);


    --text-color_success: #008d00;
    --bg-color_success: #27ae60;
    --border-color_success: #27ae60;


    --text-color_error: #c0392b;
    --bg-color_error: #e74c3c;
    --border-color_error: #e74c3c;

    --text-color_warning: #d35400;
    --bg-color_warning: #e67e22;
    --border-color_warning: #e67e22;


    --text-color_info: #2980b9;
    --bg-color_info: #3498db;
    --border-color_info: #3498db;


    --text-color_assist: #7f8c8d;
    --bg-color_assist: #95a5a6;
    --border-color_assist: #95a5a6;

    --text-color_secret: #8e44ad;
    --bg-color_secret: #9b59b6;
    --border-color_secret: #9b59b6;

    --text-color_dark: #2c3e50;
    --bg-color_dark: #404040;
    --border-color_dark: #34495e;


    --text-color_light: #bdc3c7;
    --bg-color_light: #ecf0f1;
    --border-color_light: #ecf0f1;

    /****** 动画相关 *********/
    --animate-duration: 800ms;
    --animate-delay: 0;
}

.tc-normal{
    color: var(--text-color_normal);
}
.tc-success{
    color: var(--text-color_success);
}
.tc-assist {
    color: var(--text-color_assist);
}
.tc-warning {
    color: var(--text-color_warning);
}
.tc-error {
    color: var(--text-color_error);
}
.tc-info {
    color: var(--text-color_info);
}
.tc-secret {
    color: var(--text-color_secret);
}
.tc-dark {
    color: var(--text-color_dark);
}
.tc-light {
    color: var(--text-color_light);
}
.tc-white{
    color: white;
}
.bold {
    font-weight: 500;
}
.bolder{
    font-weight: 700;
}
*{
    flex-shrink:0;
    margin:0;
    padding:0;
}
.hide{
    display:none !important;
}

.fx{
    display:flex;
    flex-direction:row;
}

.fx-col{
    display:flex;
    flex-direction:column;
    align-items: stretch;
}

.fx-g1{
    flex-grow:1;
    flex-shrink:1;
    overflow:auto;
}
.fx-g2{
    flex:2;
}
.fx-g3{
    flex:3;
}
.fx-g4{
    flex:4;
}
.fx-g5{
    flex:5;
}
.noshrink{
    flex-shrink:0;
}
/**主轴排列**/
.fx-m_start{
    justify-content : flex-start;
}
.fx-m_end{
    justify-content : flex-end;
}
.fx-m_center{
    justify-content : center;
}
.fx-m_between{
    justify-content : space-between;
}
.fx-m_around{
    justify-content : space-around;
}
/**交叉轴排列**/
.fx-c_start{
    align-items : flex-start;
}
.fx-c_end{
    align-items : flex-end;
}
.fx-c_center{
    align-items : center;
}
.fx-c_baseline{
    align-items : baseline;
}
.fx-c_stretch{
    align-items : stretch;
}
.fx-center{
    justify-content : center;
    align-items : center;
}
.fx-wrap{
    flex-wrap: wrap;
}
.fl{
    float:left;
}
.fr{
    float:right;
}
.font12{
    font-size: 12px !important;
}
.font14{
    font-size: 14px !important;
}
.font16{
    font-size: 16px !important;
}
.font18{
    font-size: 18px !important;
}
.font20{
    font-size: 20px !important;
}
.font22{
    font-size: 22px !important;
}
.font24{
    font-size: 24px !important;
}
.font26{
    font-size: 26px !important;
}
.font28{
    font-size: 28px !important;
}
.font30{
    font-size: 30px !important;
}
.font36{
    font-size: 36px !important;
}
.font40{
    font-size: 40px !important;
}
.font50{
    font-size: 50px !important;
}
.ml10 {
    margin-left: 10px;
}
.mr10 {
    margin-right: 10px;
}
.mt10 {
    margin-top: 10px;
}
.mb10 {
    margin-bottom: 10px;
}
.ml15 {
    margin-left: 15px;
}
.mr15 {
    margin-right: 15px;
}
.mt15 {
    margin-top: 15px;
}
.mb15 {
    margin-bottom: 15px;
}
.ml20 {
    margin-left: 20px;
}
.mr20 {
    margin-right: 20px;
}
.mt20 {
    margin-top: 20px;
}
.mb20 {
    margin-bottom: 20px;
}
.ml30 {
    margin-left: 30px;
}
.mr30 {
    margin-right: 30px;
}
.mt30 {
    margin-top: 30px;
}
.mb30 {
    margin-bottom: 30px;
}
.ml40 {
    margin-left: 40px;
}
.mr40 {
    margin-right: 40px;
}
.mt40 {
    margin-top: 40px;
}
.mb40 {
    margin-bottom: 40px;
}
/******** 盒子模型相关样式 ***********/
.mar-5 {
    margin: 5px;
}

.ml-5 {
    margin-left: 5px;
}

.mr-5 {
    margin-right: 5px;
}

.mt-5 {
    margin-top: 5px;
}

.mb-5 {
    margin-bottom: 5px;
}

.pad-5 {
    padding: 5px;
}

.pl-5 {
    padding-left: 5px;
}

.pr-5 {
    padding-right: 5px;
}

.pt-5 {
    padding-top: 5px;
}

.pb-5 {
    padding-bottom: 5px;
}

.mar-10 {
    margin: 10px;
}

.ml-10 {
    margin-left: 10px;
}

.mr-10 {
    margin-right: 10px;
}

.mt-10 {
    margin-top: 10px;
}

.mb-10 {
    margin-bottom: 10px;
}

.pad-10 {
    padding: 10px;
}

.pl-10 {
    padding-left: 10px;
}

.pr-10 {
    padding-right: 10px;
}

.pt-10 {
    padding-top: 10px;
}

.pb-10 {
    padding-bottom: 10px;
}

.mar-15 {
    margin: 15px;
}

.ml-15 {
    margin-left: 15px;
}

.mr-15 {
    margin-right: 15px;
}

.mt-15 {
    margin-top: 15px;
}

.mb-15 {
    margin-bottom: 15px;
}

.pad-15 {
    padding: 15px;
}

.pl-15 {
    padding-left: 15px;
}

.pr-15 {
    padding-right: 15px;
}

.pt-15 {
    padding-top: 15px;
}

.pb-15 {
    padding-bottom: 15px;
}

.mar-20 {
    margin: 20px;
}

.ml-20 {
    margin-left: 20px;
}

.mr-20 {
    margin-right: 20px;
}

.mt-20 {
    margin-top: 20px;
}

.mb-20 {
    margin-bottom: 20px;
}

.pad-20 {
    padding: 20px;
}

.pl-20 {
    padding-left: 20px;
}

.pr-20 {
    padding-right: 20px;
}

.pt-20 {
    padding-top: 20px;
}

.pb-20 {
    padding-bottom: 20px;
}

.mar-25 {
    margin: 25px;
}

.ml-25 {
    margin-left: 25px;
}

.mr-25 {
    margin-right: 25px;
}

.mt-25 {
    margin-top: 25px;
}

.mb-25 {
    margin-bottom: 25px;
}

.pad-25 {
    padding: 25px;
}

.pl-25 {
    padding-left: 25px;
}

.pr-25 {
    padding-right: 25px;
}

.pt-25 {
    padding-top: 25px;
}

.pb-25 {
    padding-bottom: 25px;
}

.mar-30 {
    margin: 30px;
}

.ml-30 {
    margin-left: 30px;
}

.mr-30 {
    margin-right: 30px;
}

.mt-30 {
    margin-top: 30px;
}

.mb-30 {
    margin-bottom: 30px;
}

.pad-30 {
    padding: 30px;
}

.pl-30 {
    padding-left: 30px;
}

.pr-30 {
    padding-right: 30px;
}

.pt-30 {
    padding-top: 30px;
}

.pb-30 {
    padding-bottom: 30px;
}

.mar-35 {
    margin: 35px;
}

.ml-35 {
    margin-left: 35px;
}

.mr-35 {
    margin-right: 35px;
}

.mt-35 {
    margin-top: 35px;
}

.mb-35 {
    margin-bottom: 35px;
}

.pad-35 {
    padding: 35px;
}

.pl-35 {
    padding-left: 35px;
}

.pr-35 {
    padding-right: 35px;
}

.pt-35 {
    padding-top: 35px;
}

.pb-35 {
    padding-bottom: 35px;
}

.mar-40 {
    margin: 40px;
}

.ml-40 {
    margin-left: 40px;
}

.mr-40 {
    margin-right: 40px;
}

.mt-40 {
    margin-top: 40px;
}

.mb-40 {
    margin-bottom: 40px;
}

.pad-40 {
    padding: 40px;
}

.pl-40 {
    padding-left: 40px;
}

.pr-40 {
    padding-right: 40px;
}

.pt-40 {
    padding-top: 40px;
}

.pb-40 {
    padding-bottom: 40px;
}

.mar-45 {
    margin: 45px;
}

.ml-45 {
    margin-left: 45px;
}

.mr-45 {
    margin-right: 45px;
}

.mt-45 {
    margin-top: 45px;
}

.mb-45 {
    margin-bottom: 45px;
}

.pad-45 {
    padding: 45px;
}

.pl-45 {
    padding-left: 45px;
}

.pr-45 {
    padding-right: 45px;
}

.pt-45 {
    padding-top: 45px;
}

.pb-45 {
    padding-bottom: 45px;
}

.mar-50 {
    margin: 50px;
}

.ml-50 {
    margin-left: 50px;
}

.mr-50 {
    margin-right: 50px;
}

.mt-50 {
    margin-top: 50px;
}

.mb-50 {
    margin-bottom: 50px;
}

.pad-50 {
    padding: 50px;
}

.pl-50 {
    padding-left: 50px;
}

.pr-50 {
    padding-right: 50px;
}

.pt-50 {
    padding-top: 50px;
}

.pb-50 {
    padding-bottom: 50px;
}
.w-100 {
    width: 100%;
    box-sizing: border-box;
}
.h-100 {
    height: 100%;
    box-sizing: border-box;
}
.ta-c {
    text-align: center;
}
.ta-l {
    text-align: left;
}
.ta-r {
    text-align: right;
}

*::-webkit-scrollbar {
    /*滚动条整体样式, 需要排除table 滚动条样式*/
    width : 10px;  /*高宽分别对应横竖滚动条的尺寸*/
    height: 10px;
}
*::-webkit-scrollbar-thumb {
    /*滚动条里面小方块*/
    border-radius: 10px;
    box-shadow   : inset 0 0 5px rgba(52, 64, 64, 0.2);
    background   : #257cd6;
}
*::-webkit-scrollbar-track {
    /*滚动条里面轨道*/
    box-shadow   : inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    background   : #f4f4f4;
}
.pointer {
    cursor: pointer;
}
.bg-white{
    background: white;
}
.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    white-space: nowrap;
}

.ellipsis2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    /*! autoprefixer: ignore next */
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
.ellipsis3 {
    overflow: hidden;
    text-overflow: ellipsis;
    /*! autoprefixer: ignore next */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
.ellipsis4 {
    overflow: hidden;
    text-overflow: ellipsis;
    /*! autoprefixer: ignore next */
    display: -webkit-box;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
/*图标转动*/
@keyframes icon-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
.iconfont {
    display: inline-block;
}
.iconfont.spin{
    animation-name: icon-spin;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-duration: 1.4s;
}
/*******自定义单选按钮样式*********/
.radio {
    display: inline-block;
    position: relative;
    height: 48px;
    line-height: 48px;
}
.radio input[type="radio"] {
    position: absolute;
    opacity: 0;
}
.radio input[type="radio"] + label:before {
    content: '';
    background: #f4f4f4;
    border-radius: 100%;
    border: 1px solid #b4b4b4;
    display: inline-block;
    width: 20px;
    height: 20px;
    position: relative;
    top: 0.7em;
    margin-right: 1em;
    vertical-align: top;
    cursor: pointer;
    text-align: center;
    -webkit-transition: all 250ms ease;
    transition: all 250ms ease;
}
.radio input[type="radio"]:checked + label:before {
    background-color: #3197EE;
    box-shadow: inset 0 0 0 4px #f4f4f4;
}
.radio input[type="radio"]:focus + label:before {
    outline: none;
    border-color: #3197EE;
}
.radio input[type="radio"]:disabled + label:before {
    box-shadow: inset 0 0 0 4px #f4f4f4;
    border-color: #b4b4b4;
    background: #b4b4b4;
}
.radio input[type="radio"] + label:empty:before {
    margin-right: 0;
}
/*****************主页************************/
.page {
    background: white;
}
.header {
    width: 1200px;
    height: 80px;
}
.header .navs {
}
.header .navs a{
    text-decoration: none;
    color: black;
    font-size: 15px;
    margin: 0 50px;
    transition: color .8s;
}
.header .navs a.active, .header .navs a:hover {
    color: #FF871E;
}

.header .navs a.nav_btn {
    height: 34px;
    padding: 0 20px;
    background: #FF871E;
    box-sizing: border-box;
    line-height: 34px;
    border-radius: 17px;
    color: white;
    cursor: pointer;
}
.module {
    margin-bottom: 100px;
}
.module_content img{
    max-width: 100%;
}
.banner {
    line-height: 0;
}
.banner img{
    width: 100%;
}
.module_title {
    margin: 60px 0 50px;
    font-size: 36px;
}
.why_video{
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 20px;
}
.why_reasons {
    min-width: 500px;
    box-sizing: border-box;
    padding: 10px 50px;
}
.why_reasons>div{
    margin-bottom: 30px;
}
.why_reasons img{
    margin-right: 20px;
}
.why_reasons h3 {
    font-size: 22px;
}
.why_reasons p {
    margin-top: 10px;
    font-size: 16px;
}