.detail-mulu {
    display: flex;
    font-size: 1.6rem;
    padding-left: 81px;
    padding-top: 67px;
    color: #262626;
    .main,.sub {
        position: relative;
        padding: 0px 2px 4px 1px;
        border-bottom: 1px solid #89B137;
        &::after {
            position: absolute;
            content: "";
            width: 37px;
            height: 1px;
            top: 50%;
            right: -53px;
            background-color: #E3E3E3;
        }
    }
    .sub {
        margin-left: 69px;
    }
    .obj {
        margin-left: 69px;
    }
}
.bigbox {
    overflow: hidden;
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 34px;
    padding-bottom: 131px;
    border-bottom: 1px solid #CBC7C1;
    line-height: 3.6rem;
}
.bigbox-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 959px;
    .title-en {
        position: relative;
        text-transform: uppercase;
        font-size: 2.4rem;
        color: #89B137;
        &::after {
            position: absolute;
            content: "";
            left: 50%;
            transform: translateX(-50%);
            bottom: -43px;
            width: 61px;
            height: 1px;
            background-color: #262626;
        }
    }
    .title-cn {
        color: #262626;
        font-weight: bold;
        font-size: 4.6rem;
        margin-top: 85px;
    }
    .picture {
        width: 100%;
        margin-top: 65px;
        img {
            width: 100%;
            object-fit: cover;
        }
    }
}
.content {
    width: 100%;
    padding-left: 77px;
    padding-right: 77px;
    margin-top: 90px;
}
.intro-content {
    padding-bottom: 95px;
    border-bottom: 1px solid #CBC7C1;
    .intro {
        position: relative;
        color: #0E0E11;
        font-size: 2.6rem;
        font-weight: bold;
        &::after {
            position: absolute;
            content: "";
            left: 0;
            bottom: -33px;
            width: 61px;
            height: 1px;
            background-color: #262626;
        }
    }
    .intro-des {
        color: #262626;
        font-size: 1.8rem;
        margin-top: 81px;
        line-height: 36px;
    }
}
.first-result {
    position: fixed;
    top: 60%;
    right: 6%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background-color: #9a8b6c;
    color: #ffffff;
    .result-cn {
        font-size: 1.6rem;
    }
    .result-en {
        font-size: 1.2rem;
    }
    .communicate {
        display: block;
        font-size: 6rem;
        color: #ffffff;
    }
    .result-img-container-box {
        display: none;
        position: absolute;
        bottom: 82px;
        right: 70px;
        width: 150px;
        height: 150px;
        .result-img-container {
           display: flex;
            justify-content: center;
            align-items: center;
            width: 100px;
            height: 100px;
            background-color: #fff;
            border-radius: 10px;
            box-shadow: 7px 7px 7px 3px rgba(0, 0, 0, 0.1);
        }
    }
    
    
    &:hover { 
        .result-img-container-box {
            display: block; 
        }      
    }
}
.process-content {
    margin-top: 80px;
    padding-bottom: 88px;
    border-bottom: 1px solid #CBC7C1;
    .process {
        font-size: 2.6rem;
        font-weight: bold;
        color: #0E0E11;
    }
    .process-first {
        position: relative;
        padding: 43px 52px 67px 52px;
        margin-top: 42px;
        border: 1px solid #CBC7C1;
        &::after {
            position: absolute;
            content: "";
            left: 50%;
            bottom: -31px;
            width: 62px;
            height: 62px;
            border-radius: 50%;
            transform: translateX(-50%);
            background-color: #ffffff;
            border: 1px solid #CBC7C1;
            z-index: 1;
        }
        &::before {
            content: "";
            position: absolute;
            bottom: -13px;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 0;
            height: 0;
            border-left: 10px solid transparent;
            border-right: 10px solid transparent;
            border-top: 10px solid #89B137;
            z-index: 2;
        }
        .process-title {
            display: flex;
            align-items: center;
            padding-right: 52px;
            padding-bottom: 36px;
            border-bottom: 1px solid #CBC7C1;
            .num {
                color: #89B137;
                font-size: 1.8rem;
            }
            .way {
                color: #0E0E11;
                font-size: 2.4rem;
                margin-left: 22px;
            }
        }
        .process-des {
            color: #262626;
            font-size: 1.8rem;
            line-height: 36px;
            margin-top: 37px;
        }
        &:last-child{
            &::after {
                display: none;
            }
            &::before {
                display: none;
            }

        }
    }
    .process-second {
        margin-top: 56px;
    }
    .process-third {
        margin-top: 56px;
        position: relative;
        padding: 43px 52px 67px 52px;
        border: 1px solid #CBC7C1;
        .process-title {
            display: flex;
            align-items: center;
            padding-right: 52px;
            padding-bottom: 36px;
            border-bottom: 1px solid #CBC7C1;
            .num {
                color: #89B137;
                font-size: 1.8rem;
            }
            .way {
                color: #0E0E11;
                font-size: 2.4rem;
                margin-left: 22px;
            }
        }
        .process-des {
            color: #262626;
            font-size: 1.8rem;
            line-height: 36px;
            margin-top: 37px;
        }
        .list {
            width: 100%;
            background-color: #F4F4F4;
            padding: 0px 51px 0px 51px;
            margin-top: 46px;
            .list-content {
                color: #262626;
                padding-bottom: 55px;
                padding-top: 48px;
                border-bottom: 1px solid #CBC7C1;
                &:last-child {
                    border-bottom:none;
                }
                .list-name {
                    font-size: 2rem;
                    padding-left: 17px;
                    border-left: 1px solid #38A0D9;
                }
                .list-des {
                    font-size: 1.8rem;
                    margin-top: 32px;
                }
            }
        }
    }
}
.guide-content {
    margin-top: 82px;
    padding-bottom: 92px;
    border-bottom: 1px solid #CBC7C1;
    .guide {
        position: relative;
        color: #0E0E11;
        font-size: 2.6rem;
        font-weight: bold;
        &::after {
            position: absolute;
            content: "";
            left: 0;
            bottom: -43px;
            width: 61px;
            height: 1px;
            background-color: #262626;
        }
    }
    .guide-more {
        display: flex;
        margin-top: 89px;
        .fang {
            width: 162px;
            height: 162px;
            border: 1px solid #CBC7C1;
            img{
                width: 100%;
                height: 100%;
                object-fit: cover;
                object-position: center;
            }
        }
        .guide-right {
            margin-left: 44px;
            width: calc(100% - 162px);
            .top {
                display: flex;
                align-items:center ;
                padding-bottom: 17px;
                border-bottom: 1px solid #E3E3E3;
                .top-num {
                    font-size: 1.8rem;
                    color: #89B137;
                    padding-left: 8px;
                }
                .top-title {
                    color: #000000;
                    font-size: 2.4rem;
                    padding-left: 15px;
                }
            }
            .guide-bottom {
                /* width: 541px; */
                color: #262626;
                font-size: 1.8rem;
                margin-top: 30px;
            }
        }
    }
    .save {
        width: 100%;
        background-color: #F4F4F4;
        padding-bottom: 54px;
        margin-top: 56px;
        .save-content {
            padding-left: 51px;
            padding-top: 46px;
            .save-title {
                font-size: 2rem;
                color: #262626;
                padding-left: 20px;
                position: relative;
                border-left: 1px solid #38A0D9;
            }
            .save-des {
                font-size: 1.8rem;
                color: #262626;
                margin-top: 20px;
                padding-right: 49px;
            }
        }
    }
}
.recover-content {
    margin-top: 87px;
    padding-bottom: 92px;
    border-bottom: 1px solid #CBC7C1;
    .intro-content {
        padding-bottom: 0;
        border-bottom: none;
    }
    .recover-way {
        margin-top: 65px;
        .way-title {
            .num {
                color: #89B137;
                font-size: 1.8rem;
            }
            .title-cn {
                margin-left: 22px;
                font-size: 2.4rem;
                color: #000000;
            }
        }
        .way-des {
            width: 100%;
            margin-top: 32px;
            background-color: #F4F4F4;
            .des-content {
                padding: 0 53px 48px 53px;
                .top {
                    padding-top: 48px;
                    padding-bottom: 41px;
                    border-bottom: 1px solid #CBC7C1;
                    &:last-child {
                        border-bottom: none;
                    }
                    .toway {
                        color: #262626;
                        font-size: 2rem;
                        padding-left: 15px;
                        border-left: 1px solid #38A0D9;
                    }
                    .thing {
                        color: #262626;
                        font-size: 1.8rem;
                        margin-top: 33px;
                    }
                }
            }
        }
    }
}
.select-content {
    margin-top: 80px;
    .intro-content {
        padding-bottom: 0;
        border-bottom: none;
    }
    .way-des {
        width: 100%;
        margin-top: 96px;
        background-color: #F4F4F4;
        .des-content {
            padding: 0px 53px 48px 53px;
            .top {
                padding-top: 48px;
                padding-bottom: 41px;
                border-bottom: 1px solid #CBC7C1;
                &:last-child {
                    border-bottom: none;
                }
                .toway {
                    color: #262626;
                    font-size: 2rem;
                    padding-left: 15px;
                    border-left: 1px solid #38A0D9;
                }
                .thing {
                    color: #262626;
                    font-size: 1.8rem;
                    margin-top: 33px;
                }
            }
        }
    }
}
.return {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 195px;
    border-bottom: 1px solid #CBC7C1;
    .return-a {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .return-list {
        font-size: 1.8rem;
        color: #262626;
        padding-left: 15px;
    }
}
.return i {
    font-size: 3.9rem;
    color: #89B137;
}
@media screen and (max-width:1440px) {
        .first-result {
            right: 3%;
    }
} 
@media screen and (max-width:1366px) {
    .first-result {
        right: 1%;
    }
}
@media screen and (max-width:1280px) {
    .first-result {
        width: 130px;
        height: 130px;
        .result-cn {
            font-size: 1.4rem;
        }
        .result-en {
            font-size: 1rem;
        }
        .result-img-container {
            width: 90px;
            height: 90px;
        }
        .result-img-container-box {
            bottom: 82px;
            right: 67px;
            width: 130px;
            height: 130px;
    }
    .communicate {
        font-size: 5rem;
    }
    }
} 
@media screen and (max-width:1024px) {
    .first-result {
        display: none !important;
    }
}
@media screen and (max-width:820px) {
    .detail-mulu {
        display: none;
    }
    .bigbox {
        padding-left: 20px;
        padding-right: 20px;
        .bigbox-box {
            width: 100%;
            .content {
                padding-left: 0;
                padding-right: 0;
            }
        }

    }
}
@media screen and (max-width:480px) {
    .bigbox {
        padding-bottom: 0;
        line-height: 28px;
        padding-left: 28px;
        padding-right: 28px;
    }
    .bigbox-box {
        padding-bottom: 45px;
        .title-en {
            font-size: 1.546rem;
            &::after {
                bottom: -25px;
                width: 42px;
            }
        }
        .title-cn {
            font-size: 2.964rem;
            margin-top: 45px;
        }
        .picture {
            margin-top: 43px;
        }
        .content {
            margin-top: 45px;
        }
        .intro-content {
             .intro {
                font-size: 2.222rem;
                &::after {
                    bottom: -25px;
                    width: 45px;
                }
            }
        }
        .intro-content {
            padding-bottom: 35px;
            
            .intro-des {
                margin-top: 45px;
                font-size: 1.511rem;
                line-height: 26.67px;
            }
        }
        .process-content {
            margin-top: 30px;
            padding-bottom: 55px;
        }
        .process-content {
            .process-first {
                &::after {
                    bottom: -24px;
                    width: 45px;
                    height: 45px;
                }
                &::before {
                    bottom: -12px;
                    border-left: 8px solid transparent;
                    border-right: 8px solid transparent;
                    border-top: 8px solid #89B137;
                }
            }
            .process {
                font-size: 2.3rem;
            }
            .process-third {
                margin-top: 40px; 
                padding: 25px;
                .process-title {
                    padding-bottom: 22px;
                    .way {
                        font-size: 1.867rem;
                    }
                }
                .list {
                    padding: 0px 25px;
                    margin-top: 0;
                    .list-content {
                        padding-bottom: 26px;
                        padding-top: 25px;
                        .list-name {
                            font-size: 1.8rem;
                        }
                        .list-des {
                            font-size: 1.6rem;
                            margin-top: 20px;
                            line-height: 26.67px;
                        }
                    }
                }
                .process-des {
                    font-size: 1.511rem;
                    margin-top: 20px;
                    line-height: 26.67px;
                    padding-bottom: 30px;
                }

            }
        }
        .guide-content {
            margin-top: 45px;
            padding-bottom: 45px;
            .guide {
                font-size: 2.3rem;
                &::after {
                    bottom: -25px;
                    width: 45px;
                }
            }
            .guide-more {
                margin-top: 55px;
                .guide-right {
                    .guide-bottom {
                        line-height: 26.67px;
                        margin-top: 25px;
                        font-size: 1.511rem;
                    }
                    .top {
                        .top-title {
                            font-size: 1.867rem;
                        }
                    }
                }
            }
            .save {
                margin-top: 25px;
                padding-bottom: 0;
                .save-content {
                    padding: 25px;
                    .save-des {
                        font-size: 1.511rem;
                        line-height: 26.67px;
                    }
                }
            }
        }
        .recover-content {
            margin-top: 45px;
            padding-bottom: 50px;
            .recover-way {
                margin-top: 0;
                .way-des {
                    margin-top: 20px;
                    .des-content {
                        padding: 0 25px;
                        .top {
                            padding-top: 25px;
                            padding-bottom: 25px;
                            .thing {
                                font-size: 1.511rem;
                                margin-top: 20px;
                            }
                        }
                    }
                }
            }
        }
        .select-content {
            margin-top: 40px;
             .way-des {
                margin-top: 20px;
                .des-content {
                    padding: 0 25px;
                    .top {
                        padding-top: 25px;
                        padding-bottom: 35px;
                        .toway {
                            font-size: 1.6rem;
                        }
                        .thing {
                            font-size: 1.511rem;
                            margin-top: 20px;
                            line-height: 26.67px;
                        }
                    }
                }
            }
        }
    }
    .return {
        height: 120px;
        .return-list {
            font-size: 2rem;
        }
    }
    .process-content {
         .process-third {
             .process-title {
                .num {
                    color: #89B137;
                    font-size: 1.418rem;
                    padding-top: 3px;
                }
            }
        }
    }
    .bigbox-box {
        .guide-content {
            .guide-more {
                display: flex;
                flex-wrap: nowrap;
                align-items: center;
                .guide-right {
                    .top {
                       display: flex;
                       
                       .top-num {
                           font-size: 1.422rem;
                           color: #89B137;
                           padding-left: 8px;
                           padding-top: 5px;
                       }
                   }
               }
           }
       }
    }
    .guide-content {
         .save {
             .save-content {
                .save-title {
                    font-size: 1.6rem;
                    
                }
            }
        }
    }
    .recover-content {
         .recover-way {
             .way-des {
                 .des-content {
                     .top {
                        .toway {
                            font-size: 1.6rem;
                        }
                    }
                }
            }
        }
    }
    .return i {
        font-size: 3rem;
    }
    .guide-content {
         .guide-more {
            .fang {
                width: 134px;
                height: 134px;
            }
        }
    }
}
