.search_area {
    position: relative;
}

.search_area form {
    display: block;
    width: min(661px, 43.544vw);
    height: min(92px, 6.061vw);
    padding: 0 min(55px, 7.171vw);
    background: url('/_skin/pass_sidae_renew/main/search_box.png') no-repeat center / 100% auto;
    z-index: 2;
}

.search_area input[name='auto_mocktest_name'] {
    width: 100%;
    height: 100%;
    color: var(--main-font-color);
    font-size: min(2.3rem, 1.515vw);
    font-family: 'spoqa4';
}

.search_area input[name='auto_mocktest_name']::placeholder {
    color: #cfd3d8;
}

.search_area .search_icon {
    position: absolute;
    top: 50%;
    right: min(50px, 3.29vw);
    transform: translateY(-50%);
    width: min(32px, 2.11vw);
    height: min(30px, 1.98vw);
}

.search_area .search_icon img {
    width: 100%;
}

.search_area .ui-autocomplete {
    left: 0 !important;
}

.search_area .ui-widget-content {
    top: min(46px, 3.03vw) !important;
    width: min(661px, 43.544vw) !important;
    padding: min(46px, 3.03vw) 0 0;
    border-radius: 0 0 32px 32px;
    overflow: hidden;
}

.search_area .ui-menu-item {
    width: min(661px, 43.544vw) !important;
    list-style: none;
    z-index: 1;
}

.search_area .ui-menu-item:last-child {
    border-bottom: none;
}

.search_area .ui-menu-item-wrapper {
    display: block;
    padding: min(16px, 1.055vw) min(55px, 7.171vw);
    color: var(--main-font-color);
    font-size: min(2.3rem, 1.515vw);
    font-family: 'spoqa4';
    cursor: pointer;
    background: none;
    transition: background-color 0.2s ease;
}

.search_area .ui-state-active {
    background-color: #e8f0fe;
    color: var(--main-font-color);
    border: none;
}

.search_area .ui-autocomplete::-webkit-scrollbar {
    width: min(6px, 0.395vw);
}

.search_area .ui-autocomplete::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.search_area .ui-autocomplete::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: min(3px, 0.198vw);
}

.search_area .ui-autocomplete::-webkit-scrollbar-thumb:hover {
    background: #999;
}

@media screen and (max-width: 767px) {
    .search_area form {
        width: 100%;
        height: 12.778vw;
    }

    .search_area .search_icon {
        right: 6.944vw;
        width: 4.444vw;
        height: 4.167vw;
    }

    .search_area input[name='auto_mocktest_name'] {
        font-size: clamp(12px, 3.194vw, 2.3rem);
    }

    .search_area .ui-widget-content {
        top: 6.389vw !important;
        width: 100% !important;
        padding: 7.389vw 0 2vw !important;
    }

    .search_area .ui-menu-item {
        width: 100% !important;
    }

    .search_area .ui-menu-item-wrapper {
        font-size: clamp(12px, 3.194vw, 2.3rem);
    }
}