.search-form form {
    font-size: 0.8em;
    line-height: 220%;
    padding: 5px;
    border: 1px solid #CCC;
}
.search-form form:after {
    content: " ";
    display: block;
    clear: both;
}

.search-item {
    float: left;
    margin-right: 15px;
}
.search-item-name {
    display: inline-block;
    vertical-align: middle;
    margin: 0px 0px;
    padding: 0px 5px;
    color: #810000;
}
.search-item-value {
    display: inline-block;
    vertical-align: middle;
}
.search-item-value label {
    display: inline-block;
    cursor       : pointer;
    padding-left : 2px;
    margin-right : 2px;
}
.search-item-value label input {
    vertical-align: middle;
}
.search-item-value label span {
    padding-left : 2px;
    margin-right : 5px;
}

.search-button {
    float: left;
    padding: 5px;
}
.search-button input {
    width: 80px;
    background-color: #7BAFCF;
    border: none;
    color: #FFF;
    font-weight: bold;
    text-align: center;
    border-radius: 5px;
    box-shadow: 0 2px 5px #555;
    cursor: pointer;
    -webkit-appearance: none;
}
.button-area {
    clear: both;
}
.search-count-area {
    float: left;
    padding: 5px;
}
.search-count {
    font-size: 1.4em;
    color: #FF0000;
    font-weight: bold;
    padding: 0 5px;
}

/* 検索結果用 */
#search-result a {
    color: #3D9ABB;
}
#search-result a:hover {
    color: #9ECCDD;
    text-decoration: none;
}
#search-result a:hover img {
    background: none;
}
#search-result a img {
    background: none;
}
#search-result a:hover {
    left: 1px;
    position: relative;
    top: 1px;
}

#search-result table {
    width: 100%;
    font-size: 0.9em;
    margin: 10px 0;
    border-collapse: collapse;
    border-spacing: 0px;
    border: 0;
}
#search-result th {
    background-color: #7BAFCF;
    color: #FFF;
    padding: 6px;
    text-align: center;
}
#search-result th div {
    text-align: center;
}
#search-result tr {
    border: solid 1px #CCC;
}
#search-result td {
    background-color: #FFFFFF;
    text-align: center;
    padding: 6px;
}
#search-result td div {
    text-align: center;
}
#search-result td, #search-result th {
    border: solid 1px #CCC;
}
#search-result .search-sp-only {
    display: none;
}
#search-result .right-box {
    text-align: center;
}
#search-result #sorter td:nth-child(1) {
    width: 160px;
}
#search-result #sorter td:nth-child(1) img {
    width: 120px;
}
#search-result #sorter td:last-child img {
    width: 140px;
}

/* tablesorter theme.blue.cssを参考 */
#search-result .tablesorter-header {
    background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==);
    background-repeat: no-repeat;
    background-position: center right;
    padding: 6px 18px 6px 4px;
    white-space: normal;
    cursor: pointer;
}
#search-result .tablesorter-headerAsc {
    background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);
}
#search-result .tablesorter-headerDesc {
    background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7);
}
#search-result .sorter-false {
    background-image: none !important;
    cursor: default !important;
    padding: 4px !important;
}

@media screen and (max-width: 640px) {
    #search-result a:hover {
        left: 0;
        top: 0;
    }
    
    #search-result th, #search-result tr, #search-result td {
        box-sizing: border-box;
    }
    
    #search-result #sorter td:nth-child(1) {
        width: 100%;
    }
    #search-result #sorter td:nth-child(1) img {
        width: 260px;
    }
    #search-result #sorter td:last-child img {
        width: 240px;
    }
    #search-result tr, #search-result td {
        display: block;
        width: 100%;
        border: none;
    }
    #search-result th {
        font-size: 0.9em;
        padding: 6px;
        text-align: center;
    }
    #search-result tbody tr {
        border: #999 1px solid;
        margin: 10px 0;
        padding: 10px 20px;
    }
    #search-result td {
        padding: 10px 0px;
        border-bottom: #999 1px solid;
    }
    #search-result td:last-child {
        border: none;
    }
    #search-result .search-pc-only {
        display: none !important;
    }
    #search-result .search-sp-only {
        display: table-cell;
        width: 40vw;
        text-align: left;
    }
    #search-result .right-box {
        display: table-cell;
        width: 60vw;
        text-align: left;
    }
    
    /* th要素 3～7個まで対応（最初と最後は表示しないため幅は加味して調整）*/
    #search-result #sorter th:first-child:nth-last-child(3),
    #search-result #sorter th:first-child:nth-last-child(3) ~ th {
        width: 100vw;
    }
    #search-result #sorter th:first-child:nth-last-child(4),
    #search-result #sorter th:first-child:nth-last-child(4) ~ th {
        width: 50vw;
    }
    #search-result #sorter th:first-child:nth-last-child(5),
    #search-result #sorter th:first-child:nth-last-child(5) ~ th {
        width: 33vw;
    }
    #search-result #sorter th:first-child:nth-last-child(6),
    #search-result #sorter th:first-child:nth-last-child(6) ~ th {
        width: 25vw;
    }
    #search-result #sorter th:first-child:nth-last-child(7),
    #search-result #sorter th:first-child:nth-last-child(7) ~ th {
        width: 20vw;
    }
}

#search-result-free table#sorter {
    width: 100%;
    margin: 10px 0;
    border-collapse: collapse;
    border-spacing: 0px;
    border: 0;
}
#search-result-free th.tablesorter-header {
    background-color: #7BAFCF;
    color: #FFF;
    padding: 6px;
    text-align: center;
}
#search-result-free th.tablesorter-header div {
    text-align: center;
}

#search-result-free .tablesorter-header {
    background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==);
    background-repeat: no-repeat;
    background-position: center right;
    padding: 6px 18px 6px 4px;
    white-space: normal;
    cursor: pointer;
}
#search-result-free .tablesorter-headerAsc {
    background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);
}
#search-result-free .tablesorter-headerDesc {
    background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7);
}
