.mt0{margin-top: 0!important;}
.mt1per{margin-top: 1%!important;}
.mt2per{margin-top: 2%!important;}
.mt3per{margin-top: 3%!important;}
.mt4per{margin-top: 4%!important;}
.mt5per{margin-top: 5%!important;}
.mt10per{margin-top: 10%!important;}


img.sp,video.sp{display: none;}
img.pc,video.pc{ display: block;}
@media only screen and (max-width: 599px) {
img.pc,video.pc{display: none;}
img.sp,video.sp{display: block;}
  .supertone_bg{
        padding: 5%;
        margin: 5% auto;
    }  
}
video{
    width: 100%;
    height: auto;
}



.mb-last{margin-bottom: 5%!important;}
.bg_gray{
    background: #efefef;
    padding: 4%;
}
.h2-gen8-l{font-size: 190%;line-height: 1.5}
.h2-gen8-l span{color: #b6a810;}
.gen-flex-4,.gen-flex-4-2,.gen-flex-2{display: flex;justify-content: space-between;}
.gen-flex-4 > div img{margin: auto;width: 100%; max-width: 130px;}
.gen-flex-4-2 > div img{margin: auto;width: 100%; max-width: 196px;}
.gen-flex-4 > div p{
    color: #b6a810;
    font-weight: bold;
    font-size: 120%;
    text-align: center;
    margin-top: 5px;
}

.gen-flex-2 div img{
    width: 100%;
    max-width: 418px;
}
.gen-flex-2 div {margin-right: 10px;}
.h2-gen8{
    font-size: 170%;
    color: #b6a810;
    margin-bottom: .5em;
    font-weight: bold;
}
.h3-gen8{
    font-size: 145%;
    position: relative;
    padding: 0;
    font-weight: bold;
}
.h3-gen8::before{
    content: "|";
    position: relative;
    color: #b6a810;
    display: inline-block;
    margin-right: .2em;
}
.table-type01 th{
    background:#e5e5e6;
    border-left:solid 1px #ddd;
    border-top:solid 1px #ddd;
    text-align: center;
}
.table-type01 td{
    border-left:solid 1px #ddd;
}
.table-type01 th:last-child,.table-type01 td:last-child{
    border-right:solid 1px #ddd;
}
.h3-caution{
    margin-top: 5%;
}

@media only screen and (max-width: 599px) {
    .mb-last{margin-bottom: 8%!important;}
    .h2-gen8-l{
        font-size: 160%;
        margin-top: 8%!important;
    }
    .gen-flex-2{
        padding-bottom: 5%;
        flex-direction: column;
    }
    .gen-flex-2 div img{
        width: 80%;
    }
    .gen-flex-2 div {margin-right: 0;margin-bottom: 10px;}
    .gen-flex-4,.gen-flex-4-2{
        flex-wrap: wrap;
    }
    .gen-flex-4 > div,.gen-flex-4-2 > div{
        width: 50%;
        text-align: center;
    }
    .gen-flex-4 > div p{
        font-size: 100%;
    }
    .gen-flex-4 > div img{
        max-width: 120px;
    }
    .gen-flex-4-2 > div img{
        max-width: 170px;
    }
    .h2-gen8{
        font-size: 150%;
    }
    .h3-gen8{
        font-size: 125%;
    }
    .h3-caution{
        margin-top: 10%;
    }
    .table-type01 td{
        text-align: center;
    }
}


.h2-xang-l{font-size: 190%;line-height: 1.5}
.h2-xang-l span{color: #e28f00;}
.xang-flex-4-2,.xang-flex-2{display: flex;justify-content: space-between;}
.xang-flex-4-2 > div img{margin: auto;width: 100%; max-width: 196px;}
.xang-flex-2{align-items: center;}
.xang-flex-2 div{
    width: 382px;
}
.xang-flex-2 p{width: calc(100% - 382px); padding-left: 20px;}
.h2-xang{
    font-size: 170%;
    color: #e28f00;
    margin-bottom: .5em;
    font-weight: bold;
}
.h3-xang{
    font-size: 145%;
    position: relative;
    padding: 0;
    font-weight: bold;
}
.h3-xang::before{
    content: "|";
    position: relative;
    color: #e28f00;
    display: inline-block;
    margin-right: .2em;
}
.xang_img05 img{
    width:100%;
    max-width: 424px !important;
}


@media only screen and (max-width: 599px) {
    .h2-xang-l{
        font-size: 160%;
        margin-top: 8%!important;
    }
    .xang-flex-2{
        flex-direction: column;
        padding-bottom: 5%;
    }
    .xang-flex-2 div{
        width: 100%;
        max-width: 382px;
    }
    .xang-flex-2 p{width: 100%;padding-left: 0;margin-top: 10px;}
    .xang-flex-4-2{
        flex-wrap: wrap;
    }
    .xang-flex-4-2 > div{
        width: 50%;
        text-align: center;
    }
    .xang-flex-4-2 > div img{
        max-width: 170px;
    }
    .h2-xang{
        font-size: 150%;
    }
    .h3-xang{
        font-size: 125%;
    }
    .xang_img05 img{
        width:80%;
    }

}

.table_basic01{width: 100%;}
.table_basic01 tr td:first-child{text-align: left;}