@charset "utf-8";
/* CSS Document */
*{ margin: 0; padding: 0; list-style: none; font-style: normal; font-weight:normal;}
html {
    height: 100%;
    font-size: 62.5%;
}

* {
    margin: 0;
    padding: 0;
    list-style: none;
    font-style: normal;
}

*:focus {
    outline: none
}

body {
    font-family: "微软雅黑", Tahoma, Geneva, sans-serif;
    font-size: 1.2rem;
    color: #181818;
    background: #fff;
}

img {
    border: 0;
    display: inline-block;
}

input, textarea, select, label {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
}

a {
    text-decoration: none;
    color: #666;
}

a:focus {
    color: #666;
}

img {
    border: 0;
}

.flt {
    float: left;
}

.frt {
    float: right;
}

.clr {
    *zoom: 1;
}

.clr:after {
    display: block;
    overflow: hidden;
    clear: both;
    height: 0;
    visibility: hidden;
    content: ".";
}

.bg-f5 {
    background: #f5f5f5;
}

/*投放页*/
.bg-f5 {
    background: #f5f5f5;
}

.top img, .main img {
    width: 100%;
    display: block;
}

.banner-num {
    margin: -13% 10px 0;
    padding: 20px;
    position: relative;
    z-index: 2;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.banner-num h4 {
    font-size: 1.7rem;
    font-weight: bold;
    text-align: center;
    position: relative;
    padding-bottom: 5%;
}

.banner-num h4:before, .banner-num h4:after {
    content: "";
    display: inline-block;;
    width: 30px;
    height: 4px;
    background: url(../images/r-icon.png) no-repeat left top;
    background-size: 100%;
    position: absolute;;
    top: 10px;;
}

.banner-num h4:before {
    background: url(../images/r-icon.png) no-repeat left top;
    background-size: 100%;
    left: 15px;
}

.banner-num h4:after {
    background: url(../images/l-icon.png) no-repeat left top;
    background-size: 100%;
    right: 15px;
}

.bg-box {
    display: inline-block;
    width: 10.811111%;
    height: 36px;
    background: url(../images/bg-i.png) no-repeat left top;
    background-size: 100%;
    text-align: center;
    line-height: 32px;
    font-size: 1.5rem;
    font-weight: bolder;
}

.an-btn {
    display: inline-block;;
    width: 30px;
    height: 30px;
    vertical-align: middle;
}

.inner {
    padding: 18px 10px 5px;
}

.btn {
    display: inline-block;
    width: 49%;
    height: auto;
    margin: 2px 0 10px;
}

.top-text {
    margin: 0 15px 30px;
    padding: 10px;
    font-size: 1.3rem;
    line-height: 25px;
}

/*main*/
.main {
    padding: 0 5px 20px;
    text-align: center;
}

.main > p {
    text-align: center;
}

.main .title {
    width: 195px;
    margin: 15px auto;
}

/*列表*/
.title-list {
    padding: 10px 5px;
}

.title-list li {
    background: #fff url(../images/zuanshi.png) no-repeat 96% center;
    background-size: 87.5px 52px;
    box-shadow: 0 0 13px rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 67px;
    margin-bottom: 10px;
    text-align: left;
}

.title-list li:nth-child(2) {
    background: #fff url(../images/chuzhi.png) no-repeat 96% center;
    background-size: 87.5px 52px;
}

.title-list li:nth-child(3) {
    background: #fff url(../images/fanli.png) no-repeat 96% center;
    background-size: 87.5px 52px;
}

.title-list li:last-child {
    background: #fff url(../images/zuanshi.png) no-repeat 96% center;
    background-size: 87.5px 52px;
}

.title-list li:last-child {
    background: #fff url(../images/dazhe.png) no-repeat 96% center;
    background-size: 87.5px 52px;
}

.title-list li p {
    padding-left: 10px;
}

.title-list li strong {
    font-size: 17px;
    font-weight: bold;
    line-height: 40px;
}

.title-list li strong i {
    color: #277dff;
}

.banner {
    padding-top: 20px;
    margin: 0 10px 22px;
}

.banner .swiper-slide {
    text-align: center;
    font-size: 18px;
    width: 60%;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.banner .swiper-slide img {
    width: 100%;
}

.main .inner {
    padding: 10px 5px 50px;
    text-align: left;
}

.main .inner .btn {
    width: 290px;
    margin: 25px auto 0;
    display: block;
}

.main .inner h3 {
    font-size: 1.7rem;
    line-height: 40px;
    padding-left: 15px;
    position: relative;
    padding-bottom: 10px;
}

.main .inner h3:before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 15px;
    border-radius: 30px;
    background: #277dff;
    position: absolute;
    left: 0;
    top: 15px;
}

.main .inner p {
    font-size: 1.4rem;
    line-height: 30px;
    text-indent: 24px;
    border: 1px dashed #d2d2d2;
    padding: 10px;
}

.main .inner p a {
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 10px 0 20px;
}
/*2018.4.2添加*/
.section-mian {
    position: relative;
    top: 0;
    left: 0;
    z-index: 100;
}
/*点击放大*/
.carrousel {
    position: fixed; width:100%; height:100%;
    background-color:#f7f7f7; top:0px; left:0;
    display: none; z-index:1000;
}
.carrousel img{ width:100%; position:absolute; top: 0;
    left:50%;
    -webkit-transform: translate(-50%,0);
    border-radius:0px;
    transform: translate(-50%,0);
}

/*2016-09-06 end 图片点击放大*/
/*隐私协议*/
.top-title{position: fixed;left: 0;top:0;width: 100%;height: 44x;text-align: center;font-size: 1.5rem;line-height: 44px;background: #fff;}
.top-title h4{position: relative;}
.top-title h4 img{position: absolute;left: 20px;top: 12px;width: 14px;height: auto;}
.main-text{margin-top: 50px;font-size: 1.4rem;line-height: 28px;color: #666;background: #f7f7f7;padding: 10px 20px;}
.main-text h3{font-size: 1.5rem;line-height: 34px;color: #ff8f19;padding: 10px 0;margin: 0;font-weight: normal;}
.main-text p{text-indent: 24px;}
/*2018.4.2end*/

/*2018.4.3添加下载页*/
.main-down{padding:0 10px;}
.title-h3{font-size: 1.5rem;line-height: 25px;padding:20px 0;}
.title-icon{display: inline-block;width: 13px;height: 14.5px;background: url(https://tfa.8688you.com/index/tf4_m/images/title-icon-l.png) no-repeat left top;background-size:100%;margin:0 10px;}
.title-icon-right{width: 11.5px;background: url(https://tfa.8688you.com/index/tf4_m/images/title-icon-r.png) no-repeat left top;background-size:100%}
.feat-list li{float: left;box-sizing:border-box;width:48%;height:53px;line-height:30px;margin:0  2.5% 7% 0;border: 1px dashed #bfbfbf;border-radius:4px;position: relative;
    background-color: #fff;
    background-image: -webkit-gradient(linear, 0 100%, 100% 0,color-stop(.25, #f6f6f6), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #f6f6f6),color-stop(.75, #fcfcfc), color-stop(.75, transparent),to(transparent));
    background-size:5px 5px;}
.feat-list li:nth-child(2n){margin-right:0;}
.feat-list li p{padding-top: 15px;}
.feat-list li i{display: inline-block;width: 55px;height: 25px;border:none;color:#fff;border-radius: 4px;background:#ff7414;font-size:1.2rem;line-height:22px;height: 22px;
    position:absolute;left:50%;top:0;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);}
/*输入框*/
input{border: none;background: none;}
.input-box{text-align:left;}
.input-box>div{position:relative;width: 100%;height:42px;background: #f4f4f4;border: 1px solid #aaa;border-radius:4px;box-sizing: border-box;padding: 10px;margin-bottom: 15px;}
.input-box>div i{display: inline-block;;width:20px;height:22px;vertical-align: middle;margin-right:10px;}
.yy-icon-people{background: url(https://tfa.8688you.com/index/tf4_m/images/input-people.png) no-repeat left center;background-size: auto 22px;}
.yy-icon-password{background: url(https://tfa.8688you.com/index/tf4_m/images/input-password.png) no-repeat left center;background-size:auto 22px;}
.input-box>div input{padding-left: 10px;border-left: 1px solid #aaa;width: 78%;line-height:22px;}
.eye-open-btn{display: inline-block;;width:18px;height:12px;background: url(https://tfa.8688you.com/index/tf4_m/images/eye-open.png) no-repeat left center;background-size:100%;position: absolute ;right: 20px;top: 14px;}
.eye-down-btn{background: url(https://tfa.8688you.com/index/tf4_m/images/eye-down.png) no-repeat left center;background-size:100%;}
.reg-btn{display:inline-block;color:#fff;font-size:1.6rem;width: 100%;box-sizing: border-box;height:41px;line-height: 41px;text-align: center;
    border-radius: 6px;box-shadow: 1px 1px 3px rgba(255,106,52,0.6);
    background: #ff863e;
    background: -moz-linear-gradient(45deg, #ff863e 0%, #ff3b1b 100%);
    background: -webkit-linear-gradient(45deg, #ff863e 0%,#ff3b1b 100%);
    background: linear-gradient(45deg, #ff863e 0%,#ff3b1b 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff863e', endColorstr='#ff3b1b',GradientType=1 );
}
.input-box>p{line-height: 34px;font-size: 1.2rem;color: #999;padding: 10px 0;}
.input-box>p a{color: #438efd;text-decoration: underline;}
/*2018.4.3添加下载页-end*/

/*2018.4.4安装问题*/
.problem-anz{  background: url(https://tfa.8688you.com/index/tf4_m/images/img-q02.jpg) center bottom #48b4ff no-repeat; background-size:100% auto; font-size:1.25rem; padding:5% 15px 15% 15px; line-height:2.4rem; color:#fff; }
.problem-anz h3{ width:100%; text-align:center;}
.problem-anz p{text-indent:22px;}

.problem-list{ width:100%; padding:0 10px; box-sizing:border-box; -webkit-box-sizing:border-box;}
.problem-list .list{display:table; width:100%; }
.border-bottom{ border-bottom:1px solid #e4e4e4; padding-bottom:20px; margin-bottom:20px; overflow:hidden;}
.problem-list .list > span,.problem-anz .list > div{ display:table-cell; vertical-align:top;}
.problem-list .list > span{  width:50px; text-align:center; padding-right:5px;}
.problem-list .list > span img{ height:24px;}
.problem-list .list > span i{ display:inline-block; text-align:center; width:35px; height:35px ; line-height:35px; background:#ffc000; border-radius:50%; font-size:2rem; color:#fff;}
.problem-list .list > div{ font-size:1.4rem; color:#3a3a3a; padding-right:20px;}
.problem-list .list > div button{ background:#48b4ff; border:none; color:#fff; border-radius:3px; padding:2% 0; width:48%; font-size:1.6rem; margin-top:20px;}
/*end 安装问题*/
/*提示*/
.tishi,.mask{ width:100%; height:100%; background:rgba(0,0,0,.8); position:fixed; top:0; left:0; z-index:2000;}
.tishi img{ width:100%; margin-top:10px;}
/*end 提示*/

/*mask*/
.mask-content {
    width: 90%;
    position: fixed;
    left: 5%; top:52%; transform:translateY(-50%); -webkit-transform:translateY(-50%);
    background: #fff;
    border-radius: 8px;
}
.mask-content h3{ font-size:1.8rem; font-weight:normal; color:#1b1b1b; border-bottom:1px solid #e7e7e7; padding:4% 0; text-align:center; position:relative;}
.mask-content h3 .mask-close{ position:absolute; top:-40px; right:5px; height:60px; display:block;}
.mask-content h3 .mask-close img{ height:100%;}
.mask-content .mask-banner{ width:100%; color:#1b1b1b; font-size:1.4rem; margin-bottom:2%; text-align:center;}
.mask-content .mask-banner img{ width:75%;}
.mask-content .mask-button{ width:100%; border:none; background:#ff9b25; font-size:1.8rem; border-radius:0 0 8px 8px; color:#fff; padding:4% 0; text-align:center;}

/*安装弹框*/
.mask-anz {
    width:80%; left:10%;
}
.mask-anz  h3{ font-weight:bold;}
.mask-wenz{ padding:30px 15px;}
.mask-wenz p{ text-align:left; text-indent:2.8rem; line-height:1.6em; font-size:1.4rem; margin-bottom:10px; color:#666;}
.mask-wenz p:last-child{ margin-bottom:0;}
/*两个按钮*/
.button01{ overflow:hidden;  }
.button01 button{ width:100%; float:left; height:45px; line-height:45px; border:0; font-size:1.5rem; text-align:center;}
.button01 .bg-blue{ background:#ffb618; color:#fff; border-radius:0 0 6px 6px;}
/*end 安装弹框*/

@media only screen and (max-width: 768px) {
    html {
        font-size: 75%;
    }
}

@media only screen and (max-width: 435px) {
    html {
        font-size: 68.8%;
    }
}

@media only screen and (max-width: 384px) {
    html {
        font-size: 68.8%;
    }
}

@media only screen and (max-width: 375px) {
    html {
        font-size: 68.8%;
    }

    .banner-num h4:before {
        left: -6px;
    }

    .banner-num h4:after {
        right: -6px;
    }
}

@media only screen and (max-width: 320px) {
    html {
        font-size: 62.5%;
    }

    .banner-num h4:before, .banner-num h4:after {
        content: "";
        display: inline-block;
        width: 20px;
    }

    .banner-num h4:before {
        left: -5%;
    }

    .banner-num h4:after {
        right: -5%;
    }

    .bg-box {
        display: inline-block;
        width: 10.811111%;
        height: 30px;
        line-height: 26px;
    }
}
@media only screen and (min-width: 720px) {
    .section-mian {
    	margin: auto;
        width: 720px;
    }
	
}