* {
    margin: 0;
    padding: 0;
    font-size: 10px;
}


/* 大背景图 */

.doc {
    background: url(../images/app/bg2.png) center center no-repeat;
    text-align: center;
}

.user {
    background: url(../images/app/bg1.png) center center no-repeat;
    text-align: center;
}

.doc-phone img:first-of-type,
.rotation {
    display: inline-block;
}

.doc-code,
.doc-phone,
.user-code,
.user-phone {
    display: inline-block;
}

.doc-phone img,
.user-phone img {
    width: 80%;
    height: 80%;
}

.doc-code,
.user-code {
    text-align: center;
    position: relative;
    top: -7rem;
}

.doc-code-log,
.user-code-log {
    width: 9rem;
    height: 9rem;
    margin: 1rem 0;
}

.doc-code p:first-of-type,
.user-code p:first-of-type {
    font-size: 3rem;
}

.doc-code p:last-of-type,
.user-code p:last-of-type {
    font-size: 1.5rem;
}


/* 设置二维码区域 */

.doc-code-box,
.user-code-box {
    background-color: white;
    width: 32rem;
    border-radius: 5%;
}

.doc-code-box div,
.user-code-box div {
    display: inline-block;
    margin: 1rem 1rem 0 1rem;
}

.doc-code-box img,
.user-code-box img {
    width: 90%;
    height: 90%;
}

.doc-code-box p,
.user-code-box p {
    margin-top: .5rem;
}

.doc-code-box span,
.user-code-box span {
    font-size: 2rem;
}

.doctor,
.client{
    width: 100%;
    height: 900px;
    max-width: 1920px;
    margin: 0 auto;
}

.doctor{
    background: url('../images/new/app/bg_1.png')no-repeat center center/cover;
}

.client{
    background: url('../images/new/app/bg_2.png')no-repeat center center/cover;
}

.bg{
    width: 100%;
}

.doctor_hang{
    position: absolute;
    top: 520px;
    left: 140px;
    
}

.doctor_hang .download >div,
.client_hang .download >div{
    width: 247px;
    height: 65px;
    border-radius: 5px;
    background: #FFFFFF;
    margin-bottom: 15px;
    cursor: pointer;
    transition: all 0.3s;
}

.doctor_hang .download >div span,
.client_hang .download >div span{
    white-space: nowrap;
    font-size: 26px;
    color: #1AAEB6;
}

.doctor_hang .download >div.active,
.client_hang .download >div.active{
    background: #FFA53B;
    
}

.doctor_hang .download >div.active span,
.client_hang .download >div.active span{
    color: #fff;
}

.icon-ios{
    width: 28px;
    height: 34px;
    background: url('../images/new/app/ios2.png')no-repeat center center/cover;
}

.active .icon-ios{
    background: url('../images/new/app/ios.png')no-repeat center center/cover;
}

.icon-android{
     width: 31px;
    height: 37px;
    background: url('../images/new/app/android.png')no-repeat center center/cover;

}

.active .icon-android{
    background: url('../images/new/app/android2.png')no-repeat center center/cover;
}

.download >div:last-child img,
.download >div:first-child img{
    position: absolute;
    width: 159px;
    height: 148px;
    right: -170px;
    top: 0;
    opacity: 0;
   
}

.download >div.active:last-child img,
.download >div.active:first-child img{
    opacity: 1;
}

.client_hang{
    position: absolute;
    top: 620px;
    right: 590px;
    
}