﻿body {
}

#footer {
    position: relative;
}

#page-top a {
    display: flex;
    justify-content: center;
    align-items: center;
    /*  background: #942D2F;*/
    background-color: #15FFE8;
    opacity: 0.6;
    border-radius: 50px;
    width: 100px;
    height: 100px;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 1.6rem;
    transition: all 0.3s;
}

/*#page-top a:hover {
            background: #15FFE8;
        }*/

/*リンクを右下に固定*/
#page-top {
    display: block !important;
    position: fixed;
    right: 100px;
    z-index: 2;
    /*はじめは非表示*/
    opacity: 0;
    transform: translateY(200px);
}

    /*　上に上がる動き　*/

    #page-top.UpMove {
        animation: UpAnime 0.5s forwards;
    }

@keyframes UpAnime {
    from {
        opacity: 0;
        transform: translateY(200px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/*　下に下がる動き　*/

#page-top.DownMove {
    animation: DownAnime 0.5s forwards;
}

@keyframes DownAnime {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 1;
        transform: translateY(200px);
    }
}

@media screen and (min-width: 768px) {
    　
    /*/* 背景用*/
   
    img {
        width: 100%;
    }

    body {
      /*  min-height: 175vh;*/
        /*position: relative;*/ /*←相対位置*/
       
        /*box-sizing: border-box;*/ /*←全て含めてmin-height:100vhに*/
     /*   overflow: scroll;*/
        min-width: 768px;
    }

  
    details {
      /*  border: 1px solid #aaa;*/
       
        padding: .5em .5em 0;
    }

    summary {
        font-weight: bold;
        /* margin: -.5em -.5em 0;*/
        padding: .5em;
        cursor: pointer;
        transition: background-color 5s;
        border-radius: 8px;
        display: list-item;
    }
        summary:hover {
               /*   background-image: linear-gradient(-225deg, #D4FFEC 0%, #57F2CC 48%, #4596FB 100%);*/
            background-color: #15ffe8;
        }
   /* details[open] {
        padding: .5em;
    }*/

    details[open] summary {
        /*border-bottom: 1px solid #aaa;*/
        margin-bottom: .5em;
      border-radius:10px;
    }
    .canvas-parent {
       
        width: 100%;
     
    }

    .Chart {
        max-width: 100%;
        max-height: 100vh;
    }
   /* #chart_div{
        width:400px!important;
        height:500px!important;
    }*/

   

    .modal-middle {
        /*モーダルウィンドウの縦表示位置を調整*/
        margin: 2% auto;
    }

    .modal-sm {
        /*モーダルウィンドウの縦表示位置を調整*/
        margin: 15% auto;
    }

    .modal-img_footer {
        /*表示予定のテキストとボタンを中央揃え*/
        padding: .5em;
        text-align: center;
    }

}


/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@media screen and (max-width: 768px)and (max-width: 1024px) {
    body {
        max-width: 768px;
        max-width: 1024px;
    }

    .canvas-parent {
        width: 100%;
    }

    .Chart {
        max-width: 100%;
        max-height: 100vh;
    }
}
/* タブレット・スマホ */
@media screen and (max-width: 768px) {
    body {
        max-width: 768px;
    }
    .canvas-parent {
        width: 100%;
    }

    .Chart {
        max-width: 100%;
        max-height: 100vh;
    }
}
/* PC・タブレット */
@media screen and (min-width: 621px) {
    body {
        min-width: 621px;
    }
    .canvas-parent {
        width: 100%;
    }

    .Chart {
        max-width: 100%;
        max-height: 100vh;
    }

}
/* タブレットのみ */
@media screen and (min-width: 621px) and (max-width: 768px) {

    .canvas-parent {
        width: 100%;
    }

    .Chart {
        max-width: 100%;
        max-height: 100vh;
    }
}

/*@media screen and (min-width: 540px) and (max-width:540px;) {
  
}*/
/* スマホ以外 */
@media screen and (min-width: 510px) and (max-width:600px) {
    body {
        min-width: 510px;
        max-width: 600px;
    }

}
/* スマホ */
@media screen and (max-width: 620px) {
    body {
        max-width: 620px;
    }

    img {
        width: 100%;
    }

   
}
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* スマホ横 */
@media screen and (min-width: 500px) {
    img {
        width: 100%;
    }
    body {
       /* min-height: 175vh;*/
        /*position: relative;*/ /*←相対位置*/
        /*padding-bottom: 120px;*/ /*←footerの高さ*/
      /*  box-sizing: border-box; ←全て含めてmin-height:100vhに*/
       /* overflow: scroll;
        -webkit-overflow-scrolling: touch;*/
    }
    .canvas-parent {
       /* margin-top: 15vh;*/
        position: relative;
        width: 100%;
        overflow: visible;
       
    }

    .Chart {
        max-width: 100%;
        max-height: 100vh;
       
    }
}
/*スマホ縦 */
@media screen and (max-width: 500px) {

    body {
        min-height: 175vh;
        position: relative; /*←相対位置*/
        padding-bottom: 120px; /*←footerの高さ*/
        box-sizing: border-box; /*←全て含めてmin-height:100vhに*/
        overflow: scroll;
        -webkit-overflow-scrolling: touch;
    }

    img {
        width: 100%;
    }
   
    .canvas-parent {
        margin-top: 15vh;
        position: relative;
        width: 800px;
        overflow: visible;
    }

    .Chart {
        max-width: 100%;
        max-height: 50vh;
    }

   
}

/*/////ここからが最新2022/09/09//ここからが最新2022/09/09//ここからが最新2022/09/09//ここからが最新2022/09/09//ここからが最新2022/09/09//ここからが最新2022/09/09//ここからが最新2022/09/09/////*/


@media screen and (max-width: 1024px) {
    .Motomoto{
        display:none;
    }
    .DoiPhotoWrap {
        display: none;
    }
    .mobilePersonalSeiriese {
        display:block!important;
    }
    .Fontmobile18 {
        font-size: 18px;
              
    }
    .Fontmobile18b {
        font-size: 18px;
        font-weight: bold;
    }
    .HokanoMobile {
        margin-top: 10px!important;
        margin-left: 10px!important;
    }
    .HokanoMobilenaka {
        margin-right: 0px !important;
        display: flex;
        justify-content: flex-start!important;
    }
    .Tojirumobile{
        max-width:25vw;
    }
    .QQQMobile {
        margin-right: 10px !important;
        margin-left: 10px !important;
    }
    #shindanButton {
        width: 30vw !important;
    }
    #shindanRirekiButton {
        width: 35vw!important;
    }
    .MobileRightButton {
        display: block !important;
    }
    .RightButton {
        display: none;
    }
    .MobileButtonWrapInfo {
        margin-left: 0px !important;
    }
    .mobileCenterbutton {
        display: flex;
        justify-content: space-between;
        margin-right: 20px !important;
    }
    .MobileHiroshi{
        width:150px!important;
    }
    .MobileShindanNyuryoku{
        margin-left:0px!important;
    }

    /*#footer {
        position: relative;
        
    }
    #page-top a {
        display: flex;
        justify-content: center;
        align-items: center;*/
        /*  background: #942D2F;*/
        /*background-color: #15FFE8;
        opacity: 0.6;
        border-radius: 50px;
        width: 100px;
        height: 100px;
        color: #fff;
        text-align: center;
        text-transform: uppercase;
        text-decoration: none;
        font-size: 1.6rem;
        transition: all 0.3s;
    }*/

        /*#page-top a:hover {
            background: #15FFE8;
        }*/

    /*リンクを右下に固定*/
    /*#page-top {
        display:block!important;
        position: fixed;
        right: 100px;
        z-index: 2;*/
        /*はじめは非表示*/
        /*opacity: 0;
        transform: translateY(200px);
       
    }*/

        /*　上に上がる動き　*/

        /*#page-top.UpMove {
            animation: UpAnime 0.5s forwards;
        }

    @keyframes UpAnime {
        from {
            opacity: 0;
            transform: translateY(200px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }*/

    /*　下に下がる動き　*/

    /*#page-top.DownMove {
        animation: DownAnime 0.5s forwards;
    }

    @keyframes DownAnime {
        from {
            opacity: 1;
            transform: translateY(0);
        }

        to {
            opacity: 1;
            transform: translateY(200px);
        }
    }*/

    .SelectExamMobile {
        margin-left: 100px!important;
    }
    .bloodparant {
        display: block!important;
       
    }

    .UrinetableMobile {
        margin-left: 0px!important;
      
    }
    .Mainurine{
        overflow-x:scroll;
    }
    .Mainrapid {
        overflow-x: scroll;
    }
    .RapidTableMobile {
        margin-left: 0px !important;
    }
    .Inspectionclear {
      
        padding-left: 0px!important;
        
    }

    .tbl-r03 {
        width: 90%;
    }

        .tbl-r03 tr {
            display: block;
            float: left;
        }

            .tbl-r03 tr td,
            .tbl-r03 tr th {
                border-left: none;
                display: block;
                height: 50px;
            }

        .tbl-r03 thead {
            display: block;
            float: left;
            width: 30%;
        }

            .tbl-r03 thead tr {
                width: 100%;
            }

        .tbl-r03 tbody {
            display: block;
            float: left;
            width: 70%;
        }

            .tbl-r03 tbody tr {
                width: 50%;
            }

        .tbl-r03 tr td + td {
            border-left: none;
        }

        .tbl-r03 tbody td:last-child {
            border-bottom: solid 1px #ccc;
        }
  /*  .Standard{
        display:none;
    }
    .NinjyaTrPcr{
        display:block!important;
    }*/
}

@media screen and (max-width: 768px) {
}


@media screen and (max-width: 375px) {
    /* 375pxまでの幅の場合に適応される */

}

@media screen and (max-width: 320px) {
    /* 320pxまでの幅の場合に適応される */
   
}

