html {
    font-family: 'メイリオ', Meiryo,'Meiryo UI','Yu Gothic UI',YuGothic,'Yu Gothic','ヒラギノ丸ゴ ProN','Hiragino Maru Gothic ProN',sans-serif;
}
body {
    font-family: 'メイリオ', Meiryo,'Meiryo UI','Yu Gothic UI',YuGothic,'Yu Gothic','ヒラギノ丸ゴ ProN','Hiragino Maru Gothic ProN',sans-serif;
    background-color: #e7e7e7;
}
.font {
    font-family: 'メイリオ', Meiryo,'Meiryo UI','Yu Gothic UI',YuGothic,'Yu Gothic','ヒラギノ丸ゴ ProN','Hiragino Maru Gothic ProN',sans-serif;
}
.color-blue {
    color: blue;
}
.color-red {
    color: red;
}
.bold {
    font-weight: bold;
}
.slider{
    width:70%;
    margin:0 auto;
}
.slider img{
    width:100%;
}
.slider .slick-slide{
    height:auto!important;
}
.swiper {
    width: 1000px;
}
.strain-box {
    max-width: 1000px;
    margin: 0 auto;
}
.strain-row {
    display: flex;
    justify-content: center;
    align-items: center;
}
.nowrap {
    white-space: nowrap;
}
.strain {
    width: 300px;
    margin: 5px;
}
.strain-name {
    text-align: center;
}
.line-1 {
    background-color: #f5f5f5;
    padding: 10px 0px;
}
.line-2 {
    background-color: #e4b62d;
    padding: 5px 0px;
}
.ranking-box {
    max-width: 1000px;
    margin: 10px auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.ranking {
    margin: 5px 7.5px;
    border-radius: 5px;
    padding: 7px;
    background-color: #fff;
}
tr {
    border-bottom: 1px solid #c7c7c7;
}
th {
    text-align: center;
}
td {
    padding: 3px;
}
.rank-width {
    width: 150px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.toc-001 {
    margin-bottom: 30px;
    padding: 1em 1em 1em 2em;
    border: 1px solid #999;
    background-color: #fffaf5;
}

.toc-001 div {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 5px 0;
}

.toc-001 div::before {
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 5px;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%23333%22%3E%3Cpath%20d%3D%22M3.8%2017.2h-3c-.5%200-.8.4-.8.8v3c0%20.4.3.8.8.8h3c.4%200%20.8-.3.8-.8v-3c-.1-.4-.4-.8-.8-.8zm0-15h-3c-.5%200-.8.4-.8.8v3c0%20.4.3.8.8.8h3c.4%200%20.8-.3.8-.8V3c-.1-.4-.4-.8-.8-.8zm0%207.6h-3c-.5%200-.8.3-.8.7v3c0%20.4.3.8.8.8h3c.4%200%20.8-.3.8-.8v-3c-.1-.4-.4-.7-.8-.7zM23.2%2018h-15c-.4%200-.8.3-.8.8v1.5c0%20.4.3.8.8.8h15c.4%200%20.8-.3.8-.8v-1.5c0-.5-.3-.8-.8-.8zm0-15h-15c-.4%200-.7.3-.7.8v1.5c0%20.4.3.7.7.7h15c.5%200%20.8-.3.8-.8V3.8c0-.5-.3-.8-.8-.8zm0%207.5h-15c-.4%200-.8.3-.8.8v1.5c0%20.4.3.8.8.8h15c.4%200%20.8-.3.8-.8v-1.5c0-.5-.3-.8-.8-.8z%22%2F%3E%3C%2Fsvg%3E');
    content: '';
}

.toc-001 ol {
    list-style-type: decimal;
    margin: 0;
    padding: 0 1.2em;
    overflow: hidden;
}

.toc-001 ol ol {
    margin-top: 5px;
}

.toc-001 li {
    padding: 5px 0;
}

.toc-001 a {
    color: #166c9d;
}
.link-box {
    display: flex;
    justify-content: center;
    align-items: center;
}
.link {
    margin: 10px;
}
.linkimg {
    width: 300px;
    border-radius: 5px;
}
.more {
    text-align: center;
}
@media screen and (max-width: 1199px){
    body{
        font-size: 0.8em;
    }
    .swiper {
        width: 700px;
    }
    .strain-box {
        max-width: 700px;
        margin: 0 auto;
    }
    .strain {
        margin: 10px auto;
    }
    .rank-width {
        max-width: 150px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    
    .lingimg {
        width: 200px;
    }
}
@media screen and (max-width: 767px){
    html {
        width: 100%;
    }
    body{
        font-size: 0.8em;
        width: 100%;
    }
    .strain-box {
        max-width: 300px;
        margin: 0 auto;
    }
    .strain-row {
        display: initial;
        width: 300px;
        margin: 0 auto;
    }
    .strain {
        margin: 10px auto;
    }
    .slide-box {
        width: 100%;
        margin: 0 auto;
    }
    .swiper {
        width: 100%;
    }
    .ranking-box {
        display: initial;
    }
    .ranking {
        display: flex;
        justify-content: center;
    }
    .line-2 {
        padding: 0.5px;
    }
    .rank-width {
        max-width: 150px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .link-box {
        display: initial;
    }
    .lingimg {
        width: 300px;
    }
}