.pc{
    position: fixed;
}
.warp{
    /* top:60px;
    position: fixed; */
}
.phone-works{
    display:none;
}
.pc-works{
    display: block;
}
.worksPage {
    width: 192rem;
    /* margin-top: 60px; */
    position: absolute;
}

.works-panel-1,
.works-panel-2,
.works-panel-3,
.works-panel-4,
.works-panel-5,
.works-panel-6,
.works-panel-7,
.works-panel-8,
.works-panel-9,
.works-panel-10 {
    width: 100%;
    position: relative;
}

.works-banner,
.works-700AM,
.works-900AM1,
.works-sweet {
    width: 100%;
}


.banner-text {
    width: 50%;
    position: absolute;
    top: 32%;
    left: 15%;
    /* visibility: visible; */
    opacity: 0;
    animation-duration: 8s;
    animation-name: fadeInLeft;
    /* animation-name: fadeOutUp; */
}
@keyframes fadeInLeft{
    0%{ opacity: 0; }
    50% { opacity: 1; }
    100%{ opacity: 0; }
}
.banner-t-title {
    font-family: 'Rany-Regular';
    font-size: 4rem;
    color: #FFFFFF;
}

.banner-t-line {
    width: 61.7rem;
    height: 1px;
    background-color: #FFFFFF;
    margin-top: 2%;
}

.banner-t-text {
    font-family: 'Roboto-Light';
    font-size: 2.4rem;
    color: #FFFFFF;
    width: 57%;
    margin-top: 2%;
}

.wClock {
    width: 40%;
    margin-left: 30%;
    position: absolute;
    top: 0;
    text-align: center;
}

.wClock-line {
    width: 1px;
    background-color: #8c8c8c;
    margin-left: 50%;
}

.above {
    height: 20rem;
}

.below {
    height: 72rem;
}

.wClock-icon-clock {
    width: 6rem;
    width: 6rem;
    margin-top: 5rem;
    margin-bottom: 5rem;
    margin-left: 46%;
}

.w700AM-text {
    position: absolute;
    top: 0;
    left: 33%;
    width: 14%;
    text-align: right;
    visibility: hidden;

}

.wClock-t-logo {
    font-family: 'OPPOSans-R';
    font-size: 2.4rem;
    color: #000000;
    /* width: 70%; */
    width: 89%;
    margin-top: 90%;
    float: right;
}

.wClock-t-title {
    font-size: 3.6rem;
    font-family: 'Rany-Bold';
    color: #000000;
    float: right;
    width: 180%;
    margin-top: 44%;
}

.wClock-t-text {
    font-size: 2.4rem;
    font-family: 'Roboto-Light';
    color: #666666;
    float: right;
    width: 180%;
    margin-top: 14%;
    line-height: 142%;
}

.wClock-t-text-right {
    float: right;
}

.wClock-t-text-left {
    float: left;
}

.w700AM-icon-alarm {
    float: right;
    width: 85%;
    display: flex;
    margin-top: 44%;
}

.w700AM-icon-scene {
    float: right;
    width: 101%;
    display: flex;
    margin-top: 2.9rem;
}

.alarm-text,
.scene-text {
    font-size: 1.8rem;
    font-family: 'OPPOSans-R';
    color: #000000;
    margin-left: 36%;
    -webkit-transform: translateY(25%);

}

.alarm-icon,
.scene-icon {
    width: 3.1rem;
    margin-left: 4%;
}

.w900AM-text {
    position: absolute;
    top: 0;
    left: 53%;
    width: 14%;
    text-align: left;
    visibility: hidden;

}

.w900AM-icon-smart {
    float: left;
    width: 85%;
    display: flex;
    margin-top: 44%;
}

.w900AM-icon-home {
    float: left;
    width: 101%;
    display: flex;
    margin-top: 2.9rem;
}

.smart-text,
.home-text {
    font-size: 1.8rem;
    font-family: 'OPPOSans-R';
    color: #000000;
    margin-left: 4%;
    -webkit-transform: translateY(25%);

}

.smart-icon,
.home-icon {
    width: 3.1rem;
}

.w445-scene-width {
    width: 101%;
}

.w445-text-width {
    width: 184%;
}

.w500-text-width {
    width: 185%;
}

.w700PM-text-width {
    width: 178%;
}

.w700PM-i1-width {
    width: 102%;
}

.w700PM-i1-text {
    -webkit-transform: translateY(-4%);
}

.w700PM-i2-width {
    width: 157%;
}

.w700PM-i2-text {
    margin-left: 39%;
    -webkit-transform: translateY(12%);
}

.w700PM-i2-icon {
    margin-left: 3%;
}

.w800PM-color {
    color: #FFFFFF;
}

.w800PM-text-width {
    width: 180%;
}

.w900PM-text-width {
    width: 179%;
}

.w900PM-i-text {
    margin-left: 0%;
    -webkit-transform: translateY(20%);
}

.w900PM-i2-text {
    margin-left: 32%;
    -webkit-transform: translateY(-7%);
}

.w1000PM-text-width {
    width: 190%;
}

.works-sweet-text {
    text-align: center;
    position: absolute;
    width: 100%;
    top: 30%;
    visibility: hidden;
}

.sweet-title {
    font-family: 'Rany-Regular';
    font-size: 4.8rem;
    color: #000000;
}

.sweet-text {
    margin-top: 2%;
    font-family: 'Roboto-Light';
    font-size: 2.4rem;
    color: #666666;
    width: 22%;
    margin-left: 39%;

}

.sweet-a {
    cursor: pointer;
}

.sweet-button {
    font-family: 'Rany-Light';
    font-size: 3.6rem;
    color: #FF9600;
    width: 22rem;
    height: 6rem;
    border-radius: 5px;
    border: 2px solid #FF9600;
    background: none;
    margin-top: 6%;
}

.works-panel-4 {
    height: 70rem;
}

/*全屏完整视频*/
.full-screen-video-wap-banner{
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 999!important;
    background: rgba(0,0,0,.8);
    display: none;
}
.full-screen-close:link,.full-screen-close:visited  {
    width: 4.8rem;
    height: 4.8rem;
    background: #f4f3f3;
    color: #211d1e;
    line-height: 4.8rem;
    border-radius: 2.4rem;
    font-size: 3.2rem;
    font-weight: 700;
    text-align: center;
    position: absolute;
    right: 2.4rem;
    top: 2.4rem;
    text-decoration: none;
    transform: scale(.9,.9);
    transition: transform .2s ease;
    z-index: 100;
}
.full-screen-video-wap-banner video{
    max-width: 90%;
    max-height: 90vh;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
