/* pc */
@media screen {
    .contact2 {
        padding: 3.542vw 3.385vw 9.896vw;
    }

    .contact2 .ev {
        width: 21.354vw;
        padding: 2.188vw 1.042vw;
        border: 1px solid #EAEAEA;
        text-align: center;
        position: relative;
    }

    .contact2 .ev .icon {
        width: 4.792vw;
        margin: 0 auto;
    }

    .contact2 .ev h2 {
        color: #000;
        font-size: 1.25vw;
        font-weight: 400;
        margin: 0.781vw 1.875vw;
    }

    .contact2 .ev p {
        color: #646060;
        font-size: 0.833vw;
        word-break: break-all;
    }

    .contact2 .ev .qr {
        display: none;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255, 0.5);
    }

    .contact2 .ev:hover .qr {
        display: block;
    }

    .contact2 .ev .qr img {
        width: auto;
        height: 100%;
    }

    .contact3 {
        padding: 0 14.583vw;
    }

    .contact4 {
        padding: 4.792vw 14.063vw;
    }

    .contact4 .main {
        overflow: hidden;
    }

    .contact4 .ev {
        width: 25%;
        padding: 0.833vw 1.667vw;
        margin-bottom: 2.083vw;
        border-left: 1px solid #EBEBEB;
        margin-left: -0.052vw;
        color: rgb(58, 58, 58);
        text-align: center;
    }

    .contact4 .ev .icon {
        width: 1.667vw;
    }

    .contact4 .ev:hover .icon {
        animation: bounce 2s infinite;
    }

    .contact4 .ev h2 {
        font-size: 1.042vw;
        margin-top: 1em;
        transition: all ease .3s;
    }

    .contact4 .ev:hover h2 {
        color: #EB9D2F;
    }

    .contact4 .ev p {
        font-size: 0.833vw;
        opacity: 0.8;
        margin-top: 1em;
    }

    @keyframes bounce {

        0%,
        20%,
        50%,
        80%,
        100% {
            transform: translateY(0);
        }

        40% {
            transform: translateY(0.781vw);
        }

        60% {
            transform: translateY(0.417vw);
        }
    }

    .contact5 {
        padding: 0 16.667vw 7.188vw;
    }
}

/* mob */
@media screen and (max-width:768px) {
    .contact2 {
        padding: 40px 5%;
    }

    .contact2 .ev {
        width: calc(50% - 5px);
        padding: 15px;
        border: 1px solid #EAEAEA;
        margin-bottom: 10px;
        border-radius: 5px;
    }

    .contact2 .ev .icon {
        width: 42px;
    }

    .contact2 .ev h2 {
        font-size: 12px;
        margin: 10px 0;
    }

    .contact2 .ev p {
        font-size: 14px;
    }

    .contact2 .ev .qr img {
        height: 100%;
    }

    .contact3 {
        padding: 0 5%;
    }

    .contact4 {
        padding: 60px 5%;
    }

    .contact4 .ev {
        width: 50%;
        padding: 16px;
        margin-bottom: 30px;
        border-left: 1px solid #EBEBEB;
        margin-left: -1px;
    }

    .contact4 .ev .icon {
        width: 22px;
    }

    .contact4 .ev h2 {
        font-size: 18px;
    }

    .contact4 .ev p {
        font-size: 14px;
    }

    @keyframes bounce {

        0%,
        20%,
        50%,
        80%,
        100% {
            transform: translateY(0);
        }

        40% {
            transform: translateY(15px);
        }

        60% {
            transform: translateY(8px);
        }
    }

    .contact5 {
        padding: 0 5% 100px;
    }
}