@import url(main.less);

// PC
@media (min-width:@screen-sm-min) {

    // 头部
    .goatai_header {
        width: 100%;
        height: 6.1458vw;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(174, 174, 174, 0) 100%);
        position: fixed;
        top: 0;
        z-index: 999;

        .header_content {
            height: 100%;
            width: 72.9167vw;
            margin: 0 auto;
            display: flex;

            .logo {
                /* 214px 44px */
                display: block;
                width: 11.1458vw;
                height: 2.2917vw;
                margin-top: 1.3542vw;
                margin-right: 2.5vw;
            }

            .menu {
                display: flex !important;

                .item {
                    padding-top: 1.5625vw;
                    margin-right: .5208vw;

                    a {
                        display: block;
                    }

                    .father {
                        display: flex;
                        align-items: center;
                        padding: 0 .8vw 0 1.2vw;

                        a {
                            font-size: 1.25vw;
                            font-family: SourceHanSansCN-Regular, SourceHanSansCN !important;
                            font-weight: 400 !important;
                            color: rgba(255, 255, 255, 0.8);
                            line-height: 1.875vw;
                        }

                        .icon {
                            width: 1.875vw;
                            height: 1.875vw;
                            display: flex !important;
                            align-items: center;
                            justify-content: center;


                            p {
                                width: .4167vw;
                                height: .4167vw;
                                border-right: .1563vw solid rgba(255, 255, 255, 0.8);
                                border-bottom: .1563vw solid rgba(255, 255, 255, 0.8);
                                transform: rotate(45deg);
                            }
                        }

                        &:first-child{
                            padding: 0 1.2vw 0 1.2vw;
                        }
                    }

                    .child {
                        display: none;
                    }

                    .active {
                        font-family: SourceHanSansCN-Bold, SourceHanSansCN !important;
                        font-weight: bold !important;
                    }

                    &:hover {
                        background: #FFFFFF;
                        border-radius: 0px 0px 0.5208vw 0.5208vw;

                        .father {

                            a {
                                color: #333333;
                                font-weight: bold !important;
                            }

                            .icon {

                                p {
                                    border-right: .1563vw solid #333333;
                                    border-bottom: .1563vw solid #333333;
                                    transform: rotate(-135deg);
                                    position: relative;
                                    top: .2083vw;
                                }
                            }
                        }

                        .child {
                            padding: 1.25vw 1.2vw;
                            background: #FFFFFF;
                            border-radius: 0 0 .8333vw .8333vw;
                            display: block;

                            a {
                                font-size: .9375vw;
                                font-family: SourceHanSansCN-Regular, SourceHanSansCN;
                                font-weight: 400;
                                color: #666666;
                                line-height: 1.4063vw;
                                margin-bottom: 1.25vw;

                                &:last-child {
                                    margin-bottom: 0;
                                }
                            }
                        }
                    }

                    &:first-child {
                        height: 3.9063vw;
                    }
                }

                .selected {
                    .father {
                        a {
                            font-family: SourceHanSansCN-Bold, SourceHanSansCN;
                            font-weight: bold;
                            color: #FFFFFF;
                        }
                    }
                }
            }
        }
    }

    .under_header {
        // margin-bottom: -6.1979vw;
    }

    // 侧边工具箱
    .side_tool_box {
        position: fixed;
        right: 1.5625vw;
        bottom: 30%;
        z-index: 999;
        display: none;

        .jump_to_top {
            width: 2.8125vw;
            height: 2.8125vw;
            background: #FF7C00;
            border-radius: .3125vw;
            display: flex;
            align-items: center;
            justify-content: center;

            img {
                width: 1.0938vw;
                height: 1.3542vw;
            }
        }
    }

    .isShow {
        display: block;
    }
}

// H5
@media (max-width:@screen-xs-max) {
    .goatai_header {
        width: 100%;
        height: 21.6vw;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(174, 174, 174, 0) 100%);
        position: fixed;
        top: 0;
        z-index: 999;

        .header_content {
            width: 100%;
            height: 100%;
            padding: 0 3.2vw;
            box-sizing: border-box;
            display: flex;
            align-items: center;
            justify-content: space-between;
            position: relative;

            .logo {
                /* 280px 58px */
                width: 37.3333vw;
                height: 7.7333vw;
                margin-right: 0;
            }

            .menu_h5_btn {
                width: 8vw;
                height: 8vw;
                background: url("../images/header/h5/menu.png") no-repeat;
                background-size: contain;
            }

            .menu_h5 {
                display: none;
                width: 100%;
                background: #FFFFFF;
                box-shadow: 0px 3.7333vw 3.7333vw 0px rgba(0, 0, 0, 0.2);
                padding: .8vw 4.2667vw;
                box-sizing: border-box;
                position: absolute;
                left: 0;
                top: 100%;

                .item {

                    a {
                        display: block;
                    }

                    .father {
                        padding: 3.4667vw 0;
                        display: flex;
                        align-items: center;
                        justify-content: space-between;

                        a {
                            font-size: 4.8vw;
                            font-family: SourceHanSansCN-Regular, SourceHanSansCN;
                            font-weight: 400;
                            color: #333333;
                            line-height: 7.2vw;
                        }

                        .icon {
                            width: 7.2vw;
                            height: 7.2vw;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            margin-left: -0.3vw;

                            p {
                                width: 1.6vw;
                                height: 1.6vw;
                                border-right: .4vw solid #444444;
                                border-bottom: .4vw solid #444444;
                                transform: rotate(45deg);
                            }
                        }

                        .icon_active {

                            p {
                                border-right: .4vw solid #444444;
                                border-bottom: .4vw solid #444444;
                                transform: rotate(-135deg);
                            }
                        }

                    }

                    .child {
                        padding-left: 6.1333vw;
                        display: none;

                        a {
                            font-size: 4.2667vw;
                            font-family: SourceHanSansCN-Normal, SourceHanSansCN;
                            font-weight: 400;
                            color: #666666;
                            line-height: 6.4vw;
                            margin-bottom: 3.2vw;

                            &:last-child {
                                margin-bottom: 1.6vw;
                            }
                        }

                        .active {
                            font-family: SourceHanSansCN-Normal, SourceHanSansCN;
                            font-weight: bold;
                            color: #333333;
                        }
                    }
                }

                .selected {
                    .father {
                        a {
                            font-family: SourceHanSansCN-Bold, SourceHanSansCN;
                            font-weight: bold;
                            color: #333333;
                        }
                    }
                }
            }

            .show {
                display: block;
            }
        }

        .header_content_h5 {
            background: #FFFFFF;

            .menu_h5_btn {
                background: url("../images/header/h5/menu_show.png") no-repeat;
                background-size: contain;
            }
        }
    }

    .under_header {
        margin-bottom: -21.6vw;
    }

    // 侧边工具箱
    .side_tool_box {
        position: fixed;
        right: 3.4667vw;
        bottom: 12%;
        z-index: 999;
        display: none;

        .jump_to_top {
            width: 12vw;
            height: 12vw;
            background: #FF7C00;
            border-radius: .8vw;
            margin-bottom: 2.1333vw;
            display: flex;
            align-items: center;
            justify-content: center;

            img {
                width: 5.3333vw;
                height: 5.3333vw;
            }
        }

        .call_phone {
            width: 12vw;
            height: 12vw;
            background: #FF7C00;
            border-radius: .8vw;
            display: flex;
            align-items: center;
            justify-content: center;

            img {
                width: 4.8vw;
                height: 4.8vw;
            }
        }
    }

    .isShow {
        display: block;
    }


}