@charset "UTF-8";
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
}

body {
    overflow-x: hidden;
    font-family: Microsoft Yahei, Tahoma, Arial, Helvetica, "寰蒋闆呴粦", "瀹嬩綋";
}

a {
    text-decoration: none;
}

ul {
    list-style: none;
}

.ft-header {
    background: url("../images/header-bg.jpg") center no-repeat;
    background-size: cover;
    width: 100%;
    height: 520px;
    position: relative;
}

.ft-header .header-info {
    background: url("../images/header-info.png") no-repeat;
    width: 390px;
    height: 104px;
    position: absolute;
    top: 180px;
    left: 230px;
}

.ft-header .apply-trial-btn {
    background: #215ecc;
    width: 145px;
    height: 36px;
    line-height: 33px;
    font-size: 16px;
    color: #ffffff;
    display: block;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    text-align: center;
    position: absolute;
    left: 350px;
    bottom: 180px;
}

.ft-header .apply-trial-btn:hover {
    background: #2755a8;
}

.ft-section-two {
    background: url("../images/section-two-bg.jpg") #ffffff center bottom no-repeat;
    width: 100%;
    padding-bottom: 120px;
}

.ft-section-two .section-two-title {
    margin-top: 75px;
    margin-bottom: 80px;
    text-align: center;
}

.ft-section-two .section-two-info {
    text-align: center;
}

.ft-section-three {
    background: url("../images/section-three-bg.jpg") center no-repeat;
    background-size: cover;
    width: 100%;
    height: 520px;
    position: relative;
	overflow:hidden;
}

.ft-section-three .section-three-title {
    position: absolute;
    left: 142px;
    top: 84px;
    z-index: 5;
}

.ft-section-three .section-three-info {
    position: absolute;
    right: -275px;
    top: 50px;
}

.ft-section-tabs {
    width: 100%;
}

.ft-section-tabs .section-tabs-title {
    width: 100%;
    text-align: center;
    margin-top: 40px;
    margin-bottom: 35px;
}

.ft-section-seven {
    background: url("../images/section-seven-bg.jpg") center no-repeat;
    background-size: cover;
    width: 100%;
    height: 512px;
    position: relative;
}

.ft-section-seven .section-seven-title {
    position: absolute;
    top: 185px;
    right: 90px;
}

/*tabs*/
.tabBox {
    width: 624px;
    display: block;
    margin: 0 auto;
}

.tabBox .hd {
    width: 100%;
    height: 23px;
}

.tabBox .hd ul {
    overflow: hidden;
    font-size: 0;
}

.tabBox .hd ul li {
    float: left;
    width: 208px;
    font-size: 0;
}
.tabs-icon{
    background: url("../images/formtalk-tabs-title.png") no-repeat;
    width: 208px;
    height: 23px;
}
.tabs-one{
    background-position: 0 0;
}
.tabs-two{
    background-position: -208px 0;
}
.tabs-three{
    background-position: -416px 0;
}
.tabs-one.on{
    background-position: 0 -23px;
}
.tabs-two.on{
    background-position: -208px -23px;
}
.tabs-three.on{
    background-position: -416px -23px;
}

.tabBox .bd li {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 40px;
}
@media screen and (min-width: 280px) and (max-width: 640px) {
    .ft-header{
        background-position: center center;
        background-size: cover;
        height: 200px;
        overflow: hidden;
    }
    .ft-header .header-info {
        background-size: 200px auto;
        width: 100%;
        height: 100px;
        position: absolute;
        top: 55px;
        left: 15px;
    }
    .ft-header .apply-trial-btn{
        width: 120px;
        height: 30px;
        line-height: 28px;
        font-size: 14px;
        left: 50px;
        bottom: 40px;
    }
    .ft-section-two{
        background-size: cover;
        text-align: center;
        padding-bottom: 40px;
    }
    .ft-section-two .section-two-title{
        margin-top: 40px;
        margin-bottom: 20px;
        text-align: center;
    }
    .ft-section-two img{
        width: 85%;
    }
    .ft-section-three{
        height: 180px;
        margin-bottom: 40px;
    }
    .ft-section-three .section-three-title{
        width: 60%;
        left: 0;
        text-align: right;
        top: 40px;
    }
    .ft-section-three .section-three-title img{
        width: 90%;
    }
    .ft-section-three .section-three-info{
        width: 57%;
        right: -30px;
    }
    .ft-section-three .section-three-info img{
        width: 100%;
    }
    .ft-section-tabs .section-tabs-title img{
        height: 48px;
    }
    .tabBox{
        width: 100%;
    }
    .tabBox .hd ul li{
        width: 33.33333333%;
        font-size: 16px;
        text-align: center;
        color: #999;
        font-style: italic;
    }
    .tabBox .bd li{
        margin-top: 10px;
        margin-bottom: 0;
    }
    .tabBox .hd ul li.on{
        color: #333;
        font-weight: bold;
    }
    .tabBox .bd li img{
        max-width: 100%;
    }
    .tabs-icon{
        background: none;
    }
    .ft-section-tabs .section-tabs-title{
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .ft-section-seven{
        background-position: 60% center;
        background-size: cover;
        height: 240px;
        margin-top: 20px;
    }
    .ft-section-seven .section-seven-title{
        width: 100%;
        right: 10px;
        top:40px;
        text-align: right;
    }
    .ft-section-seven .section-seven-title img{
        width: 60%;
    }
}
@media screen and (min-width: 641px) and (max-width: 960px) {
    .ft-header,
    .ft-section-two,
    .ft-section-three,
    .ft-section-tabs,
    .ft-section-seven {
        max-width: 640px;
        margin: 0 auto;
    }
    .ft-header .header-info{
        left: 30px;
    }
    .ft-header .apply-trial-btn{
        left: 150px;
    }
    .ft-section-three .section-three-title{
        left: 22px;
        top: 60px;
    }
    .ft-section-three .section-three-info{
        text-align: center;
        top: 207px;
    }
    .ft-section-three .section-three-info img{
        width: 70%;
    }
    .ft-section-seven .section-seven-title{
        top: 40px;
        right: 40px;
    }
}