/**
 * Created by asus80 on 2016/11/8.
 * by 贾艳妮
 */
* {
    margin:0;
    padding:0;
}
body {
    /* font:16px/1.8 "微软雅黑"; */
    font-family: "Microsoft YaHei", "微软雅黑", "SimHei", "黑体";
}
.section {
    background:#fff;
    overflow: hidden;
    position: relative;
    text-align: center;
}
.section1 {
    background: url('../img/hero_sunset_large_2x.jpg') no-repeat center;
    background-size:cover;
}
.section1 h1 {
    margin-top:5%;
    color:#fff;
    font-weight: normal;
    font-size: 70px;
    opacity: 0.8;
}
.section1 p {
    margin:5% auto 0;
    color:#fff;
    font-size: 18px;
    /* width:60%; */
    opacity:0.6;
    margin-top: 800px;
    padding: 0 1.25rem;
}
.section1 a {
    display: block;
    font-size: 18px;
    margin:5% auto 0;
    color:#ff9000;
    opacity: 0.9;
}

.section2 h1 {
    margin:45px auto;
    color:#333;
    font-size: 40px;
    font-weight: normal;
}
/* .section2 .row {
    width:95%;
    margin-left:20px;
    color:#333;
    font-size: 18px;
} */
.section2 .column {
    float: left;
    display: inline-block;
    width:15%;
    margin:10px;
    background-color: #f2f2f2;
}
.section2 img {
    height: 12.5rem;
    width:  12.5rem;
    margin: 1rem auto 0;
    /* margin-top:30px; */
}



.section2 .column  p {
    margin:10px auto;
    width:90%;
    font-size: 14px;
    height:50px;
    overflow: hidden;
    text-overflow: ellipsis;
 }
.section2 .column  p:hover {
    overflow: auto;
    cursor: pointer;
 }
.section2 .column  a {
    display: block;
    color:#08c;
    margin:10px auto 0;
    font-size: 16px;
 }

.app-item {
    background: #f2f2f2;
    padding: 0.5rem 1.5rem 1.5rem;
    border-radius: 1rem;
    position: relative;
    display: flex;
    flex-direction: column;
}
.content-info {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.context-text {
    flex:1
}
.btn-pill {
    width: 154px;
    height: 32px;
    border-radius: 77px;
}
.btn-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.footer  {
    background-color: #010101;
    color:#fff;
    height: 3.75rem;
    text-align: center;
    position: absolute;
    bottom:0;
    width:100%;
    line-height: 3.75rem;
}

@media (max-width: 576px) {
    .section2 img {
        height: 6.25rem;
        width:  6.25rem;
        margin: 0.5rem auto 0;
    }
    .app-item {
        padding-bottom: 1rem;
    }
    .btn-footer {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    .btn-pill {
        width: 110px;
    }
    .section1 h1 {
        font-size: calc(1.375rem + 1.5vw);
    }
    .btn-footer a {
        margin: 0 .5rem;
    }
}