.search-title { /*検索条件タイトル*/
    margin-left: 5px;
}

.button {
    font-size: 14px;
    width: 100px;
}

@media screen and (max-width: 576px) {
    .button {
        float: right;
        margin-top: 10px;
    }
}

.tm {
    margin-top: 10px;
}

.title-font {
    font-size: 14.5px;
}

.fr {
    float: right;
    margin-right: 50px;}
@media screen and (max-width: 576px) {
    .fr {
        float: right;
        margin-right: 5px;
    }
}

.search-input {
    width: 450px;
    margin-top: 14px}
@media screen and (max-width: 576px) {
    .search-input {
        width: 92vw;
        margin-top: 2px
    }
}

.search-input-material {
    margin-top: 14px}
@media screen and (max-width: 576px) {
    .search-input-material {
        width: 92vw;
        margin-top: 2px
    }
}

.search-input-r {
    width: 450px;
    /*margin-top: 8px*/
    }
@media screen and (max-width: 576px) {
    .search-input-r {
        width: 92vw;
        margin-top: 2px
    }
}

.search-input-material-r {
    margin-top: 12px}
@media screen and (max-width: 576px) {
    .search-input-material-r {
        width: 92vw;
        margin-top: 5px
    }
}

#result table {
    table-layout: fixed;
    word-wrap: break-word;
    width: 350px;
    margin-left: 20px;}
    @media screen and (max-width: 576px) {
    #result table {
    width: 350px;
    margin-left: 20px;
    }
}

#result th {
    background-color: rgba(231, 231, 231, 0.46);
    width: 120px;
    white-space: nowrap;
    font-size: small;
}

#result td {
    font-size: small;
}

.result-table {
    margin-left: 110px;}
@media screen and (max-width: 576px) {
    .result-table {
        margin-left: 10px;

    }
}

#detail table{
    table-layout: fixed;
    word-wrap: break-word;
}

#detail th{
    font-size: 10pt;
}

#detail td{
    font-size: 10pt;
}

#detail td.no{
    width: 4px;
    text-align: right;
}
#detail td.display{
    width: 400px;
    word-break:break-all;
}
#detail td.division{
    word-break:break-all;
    white-space:nowrap;
    width: 90px;
}
#detail td.allergen{
    word-break:break-all;
    width: 260px;
}

hr {
  height: 10px;
  border: 0;
  box-shadow: 0 10px 10px -10px #bbb inset;
}

hr.dot {
	background-color: #FFF;
	border-top: 3px dotted #5bc0de;
}

*:focus {
    box-shadow:none !important;
}

/* CSVファイル */
.custom-file {
    overflow: hidden;
}
.custom-file-label {
    white-space: nowrap;
}
#customFile{
    display: none;
}
#selBtn{
    background: rgba(1, 144, 244, 0.7);
    color: #fff;
    cursor: pointer;
    padding: 8px 13px;
    display: inline-block;
}
#customFilename{
    width: 450px;
}

.bs-component{
    position: relative;
    min-height: 100%;
}

html {
  min-height: 100%;
  position: relative;
}

body {
  margin-bottom:1.5em;
}

footer {
  bottom: 0;
  height: 1.5em;
  width: 100%;
  position: absolute;
  background-color: #f5f5f5;
  text-align: center;
}

.copyright {
    text-align: center;
    color: #000000;
}


.clear {
    clear:both;
}

.bm{
    margin-bottom: 8em;
}

.com-img {
    width: 20%;
    height: auto;
    background-color: #ffffff;
    margin: 0.5em auto;
}
@media screen and (max-width: 576px) {
    .com-img {
    width: 40%;
    height: auto;
    background-color: #ffffff;
    margin: 0.5em auto;
    }
}

red{ /*必須*/
    color: #ff0000;
}
/* 評価結果テーブル色 */
.additive-col{ /*添加物*/
    color: #5000ff;
}
.additive2-col{ /*原材料／添加物*/
    color: #0064ff;
}
.error-bg { /*黄色*/
    background-color: #ffff62;
}
.warning-bg { /*緑*/
    background-color: #d1ffd6;
}
.info-bg { /*青*/
    background-color: #f0f8ff;
}

.error { /*黄色*/
    color: #ffff62;
}
.warning { /*緑*/
    color: #d1ffd6;
}
.info { /*青*/
    color: #f0f8ff;
}