#loglist {
     margin-top: 3em;
 }

 #loglist li {
     height: var(--search-thumbnail-height);
     overflow: hidden;
     margin-bottom: 5px;

 }

 .list-thumb-text {
     float: left;
     height: var(--search-thumbnail-height);
     width: var(--search-thumbnail-width);
     border: 1px solid #999;
     background-color: var(--thumbnail-back-color);
     background-image: var(--background-text-thumb);
     background-size: cover;
     overflow: hidden;
     background-position: center center;
     display: grid;
     place-items: center;
     padding: 0.5em;
     color: var(--base-text-light-color);
 }



 .list-thumb-box {
     float: left;
     height: var(--search-thumbnail-height);
     width: var(--search-thumbnail-width);
     background-color: var(--thumbnail-back-color);
     border: 1px solid #999;
     overflow: hidden;
     background-size: cover;
     background-position: center center;
 }

 .list-thumb {
     max-height: 200px;
     margin: 0 auto 0 auto;
 }

 .search-list-info {
     float: left;
     margin-left: 1em;
     overflow: hidden;
     width: calc(90% - 102px);
 }

 #pager {
     margin-top: 2em;
     font-size: 1.5em;
     text-align: center;
 }

 .pager-current-index {
     font-size: 1.2em;
     font-weight: 800;
 }

 .created_at {
     font-size: 0.8em;
 }

 .created_at::after {
     content: "\A";
     white-space: pre;
 }

 .comment {
     font-size: 0.8em;
 }

 .comment br {
     display: none;
 }

 .comment br::after {
     content: "  ";
 }

 .title {
     font-weight: 600;
 }

 .title::after {
     content: "\A";
     white-space: pre;
 }

 a {
     color: var(--base-text-color);
     text-decoration: none;
 }

 a:hover {
     color: var(--base-text-light-color);
     text-decoration: underline;
 }

 #control {
     margin-bottom: 2em;
     width: 100%;
 }

 #add-new-button {
     margin-right: 1em;
     height: 2em;
     min-width: 40%;
 }

 #search-area {
     text-align: left;
     margin-top: 1em;
     margin-bottom: 1em;
 }

 #search-input {
     position: relative;
     word-wrap: none;
 }

 #search {
     font-size: 120%;
     border: 1px solid #999;
     border-radius: 20px;
     height: 2em;
     color: #555;
     background-color: #fff;
     padding: 0 2em 0 2em;
     word-wrap: none;
     min-width: 20%;
 }

 #search-button {
     font-size: 120%;
     vertical-align: middle;
     position: absolute;
     display: inline-block;
     height: 1.8em;
     line-height: 1.8em;
     margin-left: 0.5em;
     cursor: pointer;
 }

 #search-clear-button {
     color: rgb(36, 180, 199);
     font-size: 120%;
     vertical-align: middle;
     display: inline-block;
     height: 1.4em;

     position: relative;
     right: 1.6em;

     cursor: pointer;
 }

 #message {
     margin: 1em;
     text-align: center;
 }


 #control {
     width: 100%;
     text-align: center;
 }

 .button {
     margin: 0px auto 0px auto;
 }