@charset "utf-8";
/* CSS Document */
@font-face{
    font-family: "pf_font";
    src: url("../ttf/pf_font.ttf");
}
* {
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none
}
*,:after,:before {
    box-sizing: border-box
}
body {
    font: 400 14px/1.5 Arial,sans-serif;
    background-color: #FDFDFD;
    overflow-x: hidden;
    -webkit-text-size-adjust: none
}
a,body {
    color: #303030
}
a {
    text-decoration: none
}
a:hover{
    color: #FE2E2E
}
body,dd,dl,dt,form,h1,h2,h3,h4,h5,h6,html,input,label,li,ol,p,textarea,ul {
    margin: 0;
    padding: 0
}
article,aside,details,footer,header,nav,section {
    display: block
}
em,i {
    font-style: normal
}
img {
    width: 100%;
    border: none;
    vertical-align: middle
}
ol,ul {
    list-style: none
}
input[type=checkbox],input[type=email],input[type=number],input[type=password],input[type=radio],input[type=search],input[type=tel],input[type=text] {
    vertical-align: middle;
    outline: 0;
    color: #424242;
    -webkit-appearance: none;
    -webkit-user-select: text
}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {
    color: $text-color-hold
}
select,textarea {
    outline: 0;
    color: #424242;
    -webkit-appearance: none
}
textarea {
    -webkit-user-select: text
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
.fl{float: left}
.fr{float: right}
.pa{position: absolute}
.pr{position: relative}
.tl{text-align: left}
.tc{text-align: center}
.tr{text-align: right}
.clearfix:after{content:".";display:block;height:0;font-size:0;clear:both;visibility:hidden}

.main-index{
    width: 100%;
    height: 100%;
    object-fit: cover;
    background-image: url("../images/index-bg.png");
    background-size: 100% 100%;
}
.main-about{
    width: 100%;
    height: 500px;
    background-image: url("../images/about-bg.png");
    background-size: 100% 100%;
}
.weapper{
    width: 1200px;
    margin: 0 auto;
}
.weapper-960{
    width: 960px;
    margin: 0 auto;
}
.head{
    height: 100px;
}
.head .logo{
    padding-left: 48px;
    padding-top: 27px;
}
.head .logo img{
    width: 182px;
    height: 47px;
}
.sub-nav{
    line-height: 100px;
    padding-right: 160px;
}
.sub-nav a.nav-a{
    width: 100px;
    position: relative;
    font-size:16px;
    font-family:"pf_font";
    font-weight:600;
    color:#FFFFFF;
}
.sub-nav a.cur::after{
    position: absolute;
    content: "";
    bottom: 30px;
    left: 37px;
    width:27px;
    height:2px;
    background:rgba(255,255,255,1);
}
.download-info{
    padding-top: 93px;
}
.download-info .img{
    width: 1095px;
    height: 622px;
}

.download-info a{
    width:187px;
    height:70px;
    line-height: 70px;
    background:#FF639E;
    border-radius:35px;
    font-size:24px;
    font-family:"pf_font";
    font-weight:bold;
    color:#fff;
}
.download-info a.android{
    top: 450px;
    left: 53px;
}
.download-info a.ios{
    top: 561px;
    left: 53px; 
}
.download-info .code{
    top: 450px;
    left: 314px;
}
.code img{
    width: 182px;
    height: 182px;
}
.foot,.about-foot{
    padding: 70px 0 30px;
    line-height: 20px;
}
.foot p{
    font-size:14px;
    font-family:"pf_font";
    font-weight:400;
    color:#fff;
}
.about-foot p{
    font-size:14px;
    font-family:"pf_font";
    font-weight:400;
    color:#BBBBBB;
}
.about-p p{
    font-size:48px;
    font-family:"pf_font";
    font-weight:bold;
    color:rgba(255,255,255,1);
    line-height:67px;
    letter-spacing:1px;
}
.about-p{
    padding-top: 132px;
}

.about-info{
    padding: 80px 0 45px; 
}
.about-info p.p1{
    font-size:36px;
    font-family:"pf_font";
    font-weight:500;
    color:rgba(33,35,35,1);
    line-height:50px;
}
.about-text{
    color: #555555;
    font-size:16px;
    font-family:"pf_font";
    font-weight:400;
    line-height:22px;
    letter-spacing:1px;
    padding: 45px 56px;
}

.about-img-list{
    padding-left: 120px;
}
.about-img-list .list{
    margin-right: 52px;
    width: 267px;
    height: 325px;
    position: relative;
    overflow: hidden
}
.about-img-list .list:nth-child(3n){
    margin-right: 0;
}
.about-img-list .list img{
    width: 267px;
    height: 325px;
}
.about-img-list .list:hover a.l-a{
    opacity: 0;
    transition: all .6s ease;
}
.about-img-list .list:hover .l-text{
    opacity: 1;
    bottom: 0;
    transition: all .6s ease;
    background: #FDE218;
}
.list a.l-a{
    position: absolute;
    width: 267px;
    height: 325px;
}
.list a.l-a .l-a-t{
    top: 107px;
    left: 73px;
    width: 122px;
}
.list a.l-a .l-a-t p{
    font-size:16px;
    font-family:"pf_font";
    font-weight:600;
    color:#FFFFFF;
    line-height: 30px;
    letter-spacing:1px;
}
.list .l-text{
    opacity: 0;
    position: absolute;
    width: 267px;
    height: 325px;
    left: 0;
    top: 0;
}
.l-text p.p1{
    margin-top: 17px;
    font-size:20px;
    font-family:"pf_font";
    font-weight:400;
    color:#212323;
    line-height:30px;
}
.l-text p.p2{
    font-size:16px;
    font-family:"pf_font";
    font-weight:600;
    color:rgba(33,35,35,1);
    line-height:22px;
    letter-spacing:1px;
}
.l-text p.line{
    margin: 14px auto 7px;
    background-color: #D9C10A;
    width:213px;
    height:1px;
}
.l-text p.p3{
    margin: 0 auto;
    width:213px;
    font-size:14px;
    font-family:"pf_font";
    font-weight:300;
    color:#887800;
    line-height:25px;
    letter-spacing:1px;
}