﻿.img-fill{width:100%;}
.banner {
    color: #fff;
    text-align:center;
    position:relative;
    background:#fff
}
.banner  .title{
    position: absolute;
    top: 42%;
    text-align: center;
    width:100%;
    left:0
}
.banner .chTitle {
    font-size: 2.5rem;
    font-family: PingFang Heavy;
}
.banner .engTitle{    
    font-size: 1.25rem; 
    margin: .5rem 0 5rem;
}
.banner .desc {
    font-size: 1.35rem;
    letter-spacing: 5px;
    margin-top: 3rem;
}
.desc > p {
    margin-bottom: .75rem;
    line-height: 1.75;
}
.eng-txt{font-size:1rem}
.volunteer {
    padding: 12rem 16.66%;
}
.volunteer img{margin:5rem 0 6rem}
.section-t {
    position: absolute;
    top: 17%;
    text-align: center;
    width: 100%;
    left: 0;
}
.section-t h2,.news-t h2{
    font-weight: bold;
    font-size: 2.75rem;
}
.section-t p,.news-t p{
    text-transform: uppercase;
    font-size: 1.75rem;
    margin-top: 0.5rem;
}
.section-t .desc-sub{margin-top:2rem}
.section-t .desc-sub p{font-size:1.25rem}
.harvest {
    padding: 0 16.66%;
    margin-top: -10rem;
    position: relative;
}
.harvest-i {
    display: flex;
    background: #f6f6f6;
}
.harvest-i img{width:50%}
.harvest-i .desc {
    flex: 1;
    padding: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.gain .harvest-i{align-items:center}
.gain .harvest img{width:30rem}
.gain .desc{display:block}
.harvest-i .num{font-size:2.5rem;font-weight:bold}
.harvest-i:nth-child(odd){background:#eee}
.desc-str{color:#e70310;margin-bottom:1.5rem;font-weight:bold}
.desc-str p{font-size:1.25rem}
.program{padding-bottom:15rem}
.join{padding-bottom:15rem}
.email {
    width: 66.666%;
    margin: -10rem auto 0;
    position: relative;
    background: #f6f6f6;
    display: flex;
    justify-content: center;
    padding: 3rem 0;
    align-items: center;
}
.email img{width:13rem;margin-right:2rem}
.email .src {
    color: #e60000;
    font-size: 1.5rem;
    margin-top: 2rem;
    font-weight: bold;
}
.news-t{color:#e60000;text-align:center;margin:9rem 0}
.news-list {
    width: 66.666%;
    margin: auto;
}
.item {
    line-height: 0;
    padding: 3rem 0;
    border-bottom: 1px solid #f8f8f8;
    position: relative;
    display: block;
    color: #000;
}
.item .picture {
    width: 25%;
    display: inline-block;
    margin-right: 3rem;
    height: calc(15vw/2.3);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
}
.news-content {
    position: absolute;
    right: 0;
    top: 3rem;
    height: calc(100% - 6rem);
    width: calc(75% - 3rem);
}
.news-text {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}
.news-title {
    font-size: 1.5rem;
    font-family: PingFang Heavy;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.news-desc {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.news-date {
    position: absolute;
    bottom: 0;
    right: 0;
    color: #ccc;
}
.more {
    margin-top: 0.75rem;
}
.arrow-line {
    height: 2px;
    width: 0;
    display: inline-block;
    background: #ebbd7a;
    margin-right: -13px;
    margin-left: 10px;
    transition: width 0.3s ease-in-out;
    -webkit-transition: width 0.3s ease-in-out;
}
.arrow-right {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}
.more>span {
    vertical-align: middle;
    color: #ebbd7a;
    font-weight: bold;
}
.item:hover .mask {
    opacity: 0.3;
}
.news-text:hover .news-title, .news-text:hover .news-desc {
    text-decoration: underline;
}
.item:hover .arrow-line {
    width: 20px;
}
.mask {
    position: absolute;
    opacity: 0;
}
.video{margin:5rem 0;position:relative}
.playBtn {
    position: absolute;
    width: 80px;
    height: 80px;
    background-image: url(../../Images/home/btn-play.png);
    background-size: cover;
    background-position: center;
    left: 50%;
    top: 50%;
    margin-top: -40px;
    margin-left: -40px;
}
.playBtn:hover{background-image: url('../../Images/home/btn-play2.png');}
.video-box{display:flex;justify-content:space-between}
.video-box .video{width:49%;}
.desc-title{color:#e70310;margin:3rem 0}
.desc-title h2{font-weight:bold;font-size:2rem}