main#propList {
    min-height: 85rem;

}
main#propList::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 45rem;
    height: 100%;
    background-color: var(--clr-grey);
    z-index: -1;
}
main#propList .prop-lists {
    display: flex;
    column-gap: 2.0rem;
    row-gap: 2.0rem;
    flex-wrap: wrap;
    padding-bottom: 22rem;
}
main#propList .prop-lists .prop-item {
    width: 24rem;
}
main#propList .prop-item .prop-item-content p.prop-title {
    font-size: 1.2rem;
}
main#propList .prop-item .prop-item-content p:not(.range){
    font-size: 1.2rem;
}
main#propList .page-title {
    display: flex;
    column-gap: 2.1rem;
    align-items: flex-end;
    margin-top: 1rem;
    margin-bottom: 2rem;
}
main#propList .page-title span {
    /* font-family: var(--meiryo-font); */
    font-size: 1.5rem;
}
main#propList h2 {
    font-size: 3.2rem;
    
}

.search-form {
    right: 0;
    top: 0;
    width: 30rem;
    padding: 5rem 0;
    z-index: 3;
}
.search-form h3 {
    font-size: 2.3rem;
    /* font-family: var(--yumin-font); */
    margin-bottom: 2rem;
}
.search-form p {
    /* font-family: var(--yumin-font); */
    font-size: 2rem;
    padding-left: 3.4rem;
    line-height: 1.6;
}
.search-form .form-group ul{
    padding: 0.8rem 0;
}
.search-form .radio-list-item {
    padding-left: 3.4rem;
    line-height: 1.8;
}
.search-form .radio-list-item label {
    /* font-family: var(--meiryo-font); */
    font-size: 1.5rem;
}
.search-form * {
    letter-spacing: 0.18em;
}
.search-form button[type='submit'] {
    font-size: 2.1rem;
    display: flex;
    align-items: center;
    padding: 1rem 4rem;
    column-gap: 1rem;
    margin-left: 3.4rem;
}
.search-form button[type='submit'] svg {
    width: 1.4rem;
    height: auto;
}
.switch-search-form {
    display: none;
}
@media only screen and (min-width: 769px) and (max-width: 869px) {
    .search-form {
        
        width: 22%;
        
    }
    main#propList::after {
        
        width: 38%;
        
    }
}
@media only screen and (min-width: 1400px) {
    .search-form {
        
        width: 26%;
        
    }
    main#propList::after {
        
        width: 38%;
        
    }
}

@media only screen and (min-width: 1610px)  {
    .search-form {
        
        width: 28%;
        
    }
    main#propList::after {
        
        width: 39%;
        
    }
}

@media only screen and (max-width: 768px) {
    main#propList::after {
        content: none;
    }
    /* .search-form {
        display: none;
    } */
    main#propList .prop-lists {
        display: grid;
        column-gap: 2rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 2rem;
        flex-wrap: wrap;
        padding-bottom: 22rem;
        padding: 10rem 0;
    }
    main#propList .prop-lists .prop-item {
        width: 100%;
    }
    main#propList .prop-item>a {
        height: 25rem;
    }
    main#propList .prop-item .prop-item-content {
        padding: 2.2rem 1.6rem;
    }
    main#propList .prop-item .prop-item-content p:not(.range) {
        font-size: 2.2rem;
        width: 100%;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        
    }
    main#propList .prop-item .prop-item-content p.range {
        font-size: 2rem;
    }
    .search-form {
        right: 0;
        top: 0;
        width: 80%;
        padding: 5rem 0rem;
        z-index: 3;
        background: #ffffffee;
        /* height: 100%; */
        position: fixed;
        right: -80%;
        top: 12rem;
        height: calc(100% - 12rem);
        border-left: var(--clr-black-blue);
        transition: 0.4s all ease-in-out;
    }
    .search-form.open {
        right: 0;
    }
    .search-form h3 {
        font-size: 3.3rem;
        /* font-family: var(--yumin-font); */
        margin-bottom: 2rem;
        /* padding-left: 4rem; */
        text-align: center;
    }
    .search-form p {
        font-size: 3rem;
        padding-left: 5rem;
        line-height: 1.8;
    }
    .search-form .radio-list-item label {
        /* font-family: var(--meiryo-font); */
        font-size: 2.6rem;
    }
    .form-group:first-of-type {
        margin-bottom: 2rem;
    }
    .search-form button[type='submit'] {
        font-size: 3.2rem;
    display: flex;
    align-items: center;
    padding: 1rem 5rem;
    column-gap: 2rem;
    margin: 1rem auto;
    }
    
    .switch-search-form {
        display: block;
        width: 8rem;
        height: 8rem;
        position: absolute;
        left: 0;
        top: 19rem;
        transform: translateX(-100%);
        padding: 1rem 1rem;
    }
    .switch-search-form svg {
        width: 100%;
        height: 100%;
    }
    .switch-search-form  .cross {
        display: none;
    }
    .switch-search-form.open svg {
        display: none;
    }
    .switch-search-form.open .cross {
        display: flex;
        width: 100%;
        height: 100%;
        justify-content: center;
        align-items: center;
        font-size: 4rem;
        font-weight: 900;
    }
    main#propList {
        min-height: 80rem;
    }
    .wp-pagenavi a, .wp-pagenavi span {
        border: 1px solid #BFBFBF;
        padding: 0.4rem 1rem;
        margin: 3px;
        font-size: 2.4rem !important;
    }
    main#propList h2 {
        font-size: 4.2rem;
    }
    main#propList .page-title {
        display: flex;
        column-gap: 2.1rem;
        align-items: flex-end;  
        margin-top: 1rem;
        margin-bottom: 2rem;
        flex-wrap: wrap;
        row-gap: 3rem;
    }
    main#propList .page-title span {
        /* font-family: var(--meiryo-font); */
        font-size: 2.5rem;
    }
}