.wrapper {
    padding: 0 10% 150px;
    min-height: 400px;
}
.wrapper > img {
    margin-top: 50px;
}

.table {
    width: 100%;
    border-style: solid;
    border-color: #585657;
    border-width: 1px;
}

.table div {
    display: flex;
}

.table span {
    font-size: 16px;
    text-align: center;
    border-style: solid;
    border-color: #585657;
    border-width: 1px;
}

.table-row img {
    width: auto;
    height: 6vw;
}

.table-header span, .table-row span {
    width: 20%;
    padding: 0 10px;
}

.table-row span {
    font-size: 12px;
    line-height: 8vw;
}
/* .table-row span.note, .table-row span.color { */
.table-row span.note {
    line-height: inherit;
}

.table-header {
    background-color:#dddddd;
}

.title {
    margin-top: 10px;
}
.prod img {
    width: auto;
    height: 6vw;
    margin: 5px;
}
.prod td {
    border-style: solid;
    border-width: 1px;
    text-align: center;
}
.prod td.color, .prod td.note {
    font-size: 2vw;
}

.notification {
    padding: 0 50px;
    text-align: center;
}
.not_found {
    color: red;
    text-align: center;
    font-size: 4rem;
    font-weight: bold;
}

form {
    margin: 30px;
    padding: 3px;
    font-size: 1.5rem;
}

form > input {
    width: 70%;
    height: 8vw;
    font-size: 3vw;
}
form > input + input {
    width: 20%;
}

footer {
    position: fixed;
    bottom: 0;
}

.logo1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 50px;
}
.logo1 > img {
    width: 40vw;
    max-width: 390px;
}
.logo1 > div {
    font-size: 6vw;
    font-weight: 900;
    letter-spacing: -1px;
}

.logo2 {
    display: flex;
    flex-direction: row;
    padding-top: 50px;
}
.logo2 > img {
    width: 20vw;
    height: auto;
    object-fit: contain;
}
.logo2 > div {
    font-size: 4.5vw;
    font-weight: 900;
    letter-spacing: -1px;
}